:root { color-scheme: light dark; --bg:#f5f6f1; --surface:#fff; --ink:#20251e; --muted:#697063; --line:#d7ded0; --accent:#c5ff7a; --error:#a63725; font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); min-width:280px; }
header { padding:23px 22px 19px; border-bottom:1px solid var(--line); display:flex; gap:12px; align-items:center; justify-content:space-between; }
header img { object-fit:contain; }
.version { font-size:9px; font-weight:650; letter-spacing:.08em; text-align:right; }
main { max-width:560px; margin:auto; padding:0 22px; }
.intro { padding:30px 0 24px; }
.eyebrow { font-size:10px; font-weight:700; letter-spacing:.12em; }
h1 { font-size:clamp(26px,7.8vw,38px); line-height:1.1; font-weight:620; letter-spacing:-.04em; margin:14px 0; }
p { margin:10px 0; }
.intro>p:last-child, .model>p { color:var(--muted); font-size:13px; }
.model { background:var(--surface); padding:18px; border:1px solid var(--line); border-radius:12px; }
.section-title { display:flex; align-items:center; gap:10px; justify-content:space-between; margin-bottom:13px; }
h2 { margin:0; font-size:11px; font-weight:450; white-space:nowrap; color:var(--muted); }
h2 span { color:var(--ink); font-size:13px; font-weight:650; margin-left:9px; }
.badge { background:var(--bg); border:1px solid var(--line); border-radius:4px; font-size:10px; padding:3px 7px; white-space:nowrap; }
button,input,textarea,select { font:inherit; }
button,a,.file-button,summary { -webkit-tap-highlight-color:transparent; }
button,.file-button { cursor:pointer; }
a { color:inherit; text-underline-offset:3px; }
button:disabled { opacity:.45; cursor:not-allowed; }
button { border:1px solid var(--line); border-radius:6px; padding:10px 13px; background:var(--surface); color:var(--ink); }
.file-button { display:flex; justify-content:space-between; background:var(--ink); color:var(--surface); padding:11px 13px; border-radius:6px; font-weight:600; margin:16px 0 12px; }
.remember { display:flex; gap:8px; align-items:center; font-size:11px; color:var(--muted); }
.remember input { accent-color:#537c29; margin:0; }
.model-actions { display:flex; gap:14px; align-items:center; justify-content:space-between; margin-top:10px; font-size:11px; }
.text-button { border:0; padding:3px 0; background:none; text-decoration:underline; text-underline-offset:3px; font-size:11px; }
form { padding:27px 0 20px; }
form>label { display:block; margin:17px 0 6px; font-size:12px; font-weight:650; }
.hint { color:var(--muted); font-size:11px; font-weight:400; }
label .hint { float:right; }
textarea,form>input,select { width:100%; border:1px solid var(--line); border-radius:6px; background:var(--surface); color:var(--ink); padding:11px 12px; }
textarea { resize:vertical; min-height:70px; }
textarea::placeholder,input::placeholder { color:#818879; }
:focus-visible { outline:2px solid #679827; outline-offset:3px; }
details { border-top:1px solid var(--line); margin-top:17px; padding:12px 0 0; font-size:12px; }
summary { cursor:pointer; color:var(--muted); }
details label { display:block; margin:10px 0 5px; }
.run-actions { display:flex; gap:10px; margin-top:19px; }
#run { flex:1; background:var(--accent); color:#1e2915; font-weight:650; border-color:transparent; display:flex; justify-content:space-between; }
#status { font-size:12px; color:var(--muted); overflow-wrap:anywhere; }
#status[data-error="true"] { color:var(--error); }
.result { border-top:2px solid var(--ink); padding:23px 0; }
.result h3 { font-size:24px; line-height:1.25; margin:9px 0; overflow-wrap:anywhere; }
#reason { color:var(--muted); font-size:12px; }
ol { list-style:none; padding:0; margin:18px 0; }
li { margin:12px 0; }
.rank-label { display:flex; justify-content:space-between; gap:15px; font-size:12px; overflow-wrap:anywhere; }
progress { width:100%; height:5px; border:0; display:block; margin-top:7px; accent-color:#709b42; }
progress::-webkit-progress-bar { background:var(--line); border-radius:4px; }
progress::-webkit-progress-value { background:#709b42; border-radius:4px; }
.boundary { font-size:11px; background:var(--surface); border-left:3px solid #a5b592; padding:9px 12px; }
pre { font:10px/1.6 ui-monospace,monospace; overflow:auto; max-height:240px; white-space:pre-wrap; overflow-wrap:anywhere; }
footer { border-top:1px solid var(--line); padding:16px 0 25px; color:var(--muted); font-size:10px; }
footer p:first-child { color:var(--ink); font-weight:650; }
nav { display:flex; gap:18px; margin-top:15px; }
[hidden] { display:none!important; }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.file-button:has(+input:focus-visible) { outline:2px solid #679827; outline-offset:3px; }
@media(prefers-color-scheme:dark) { :root { --bg:#1d221c; --surface:#252c23; --ink:#edf4e8; --muted:#a5b09e; --line:#434e3d; --error:#ffb09c; } header img { background:#f5f6f1; border-radius:2px; } }