:root{--bg:#f6f5f2;--surface:#ffffff;--surface-2:#efede8;--ink:#1c1a17;--ink-soft:#6b675f;--line:#e0ddd5;--accent:#a8842c;--accent-ink:#7c6120;--danger:#c0392b;--ok:#1e8c3a;--canvas-bg:#fdfdfc;--shadow:0 1px 3px rgba(28,26,23,0.08),0 4px 16px rgba(28,26,23,0.06);--radius:10px;--font-ui:"Segoe UI",system-ui,-apple-system,sans-serif;--font-mono:"Cascadia Mono","Consolas",ui-monospace,monospace}[data-theme=dark]{--bg:#121110;--surface:#1c1b19;--surface-2:#26241f;--ink:#f0ede6;--ink-soft:#a39d90;--line:#35322c;--accent:#c9a84c;--accent-ink:#e0c886;--danger:#e06050;--ok:#4cc470;--canvas-bg:#171614;--shadow:0 1px 3px rgba(0,0,0,0.4),0 4px 16px rgba(0,0,0,0.3)}*{box-sizing:border-box}body,html{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font-ui);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}button{font-family:inherit}.landing{min-height:100vh;flex-direction:column;justify-content:center;gap:24px;padding:max(32px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(32px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.install-banner,.landing{display:flex;align-items:center}.install-banner{gap:10px;background:var(--surface);border:1px solid var(--accent);border-radius:12px;padding:10px 14px;font-size:13px;max-width:min(560px,92vw);box-shadow:var(--shadow)}.install-banner .x{background:none;border:none;cursor:pointer;color:var(--ink-soft);font-size:13px;padding:4px 6px;border-radius:6px;flex-shrink:0}.install-banner .x:hover{color:var(--danger);background:var(--surface-2)}.landing h1{font-size:30px;font-weight:650;letter-spacing:-.02em;margin:0}.landing .sub{color:var(--ink-soft);max-width:560px;text-align:center;margin:0}.dropzone{width:min(680px,92vw);border:2px dashed var(--line);border-radius:16px;background:var(--surface);padding:56px 32px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s,transform .1s;box-shadow:var(--shadow)}.dropzone.dragover,.dropzone:hover{border-color:var(--accent);background:var(--surface-2)}.dropzone.dragover{transform:scale(1.01)}.dropzone .big{font-size:19px;font-weight:600;margin-bottom:6px}.dropzone .formats{color:var(--ink-soft);font-size:13px}.privacy-badge{display:inline-flex;align-items:center;gap:7px;background:color-mix(in srgb,var(--ok) 12%,transparent);color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 35%,transparent);border-radius:999px;padding:5px 14px;font-size:12.5px;font-weight:600}.samples-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.sample-btn{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;padding:8px 14px;cursor:pointer;font-size:13px;transition:border-color .15s,background .15s}.sample-btn:hover{border-color:var(--accent)}.error-banner{background:color-mix(in srgb,var(--danger) 10%,transparent);border:1px solid color-mix(in srgb,var(--danger) 40%,transparent);color:var(--danger);border-radius:10px;padding:12px 18px;max-width:640px;font-size:13.5px}.viewer{display:grid;grid-template-columns:320px 1fr 240px;grid-template-rows:52px auto 1fr;grid-template-areas:"topbar topbar topbar" "strip strip strip" "sidebar canvas right";height:100vh;overflow:hidden;padding-top:env(safe-area-inset-top);overscroll-behavior:none}.filestrip{grid-area:strip;display:flex;gap:6px;padding:6px 12px;background:var(--surface);border-bottom:1px solid var(--line);overflow-x:auto}.filechip{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:8px;padding:3px 8px;cursor:pointer;background:var(--bg);font-size:12px;white-space:nowrap;flex-shrink:0}.filechip.active,.filechip:hover{border-color:var(--accent)}.filechip.active{background:color-mix(in srgb,var(--accent) 10%,transparent);font-weight:600}.filechip img{height:32px;width:44px;object-fit:contain;background:#fff;border-radius:4px;border:1px solid var(--line)}.filechip .chip-name{max-width:160px;overflow:hidden;text-overflow:ellipsis}.filechip .chip-x{background:none;border:none;cursor:pointer;color:var(--ink-soft);font-size:11px;padding:2px 4px;border-radius:4px}.filechip .chip-x:hover{color:var(--danger);background:var(--surface-2)}.photo-preview img{width:100%;border-radius:8px;border:1px solid var(--line);display:block}.topbar{grid-area:topbar;display:flex;align-items:center;gap:12px;padding:0 max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left));background:var(--surface);border-bottom:1px solid var(--line)}.topbar .brand{font-weight:700;letter-spacing:-.01em;white-space:nowrap}.topbar .brand em{color:var(--accent);font-style:normal}.topbar .filename{font-family:var(--font-mono);font-size:12.5px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:min(320px,22vw)}.topbar .spacer{flex:1 1}.sidebar{grid-area:sidebar;background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden}.tabs{display:flex;border-bottom:1px solid var(--line)}.tabs button{flex:1 1;padding:10px 4px;background:none;border:none;border-bottom:2px solid transparent;color:var(--ink-soft);font-size:13px;font-weight:600;cursor:pointer}.tabs button.active{color:var(--ink);border-bottom-color:var(--accent)}.panel-scroll{overflow-y:auto;padding:14px;flex:1 1}.canvas-region{grid-area:canvas;position:relative;overflow:hidden;background:var(--canvas-bg)}.canvas-region canvas{position:absolute;inset:0;touch-action:none}.rightbar{grid-area:right;background:var(--surface);border-left:1px solid var(--line);padding:14px;overflow-y:auto;display:flex;flex-direction:column;gap:18px}.section-title{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-weight:700;margin:0 0 8px}.details-table{width:100%;border-collapse:collapse;font-size:13px}.details-table td{padding:6px 4px;border-bottom:1px solid var(--line);vertical-align:top}.details-table td:first-child{color:var(--ink-soft);white-space:nowrap;padding-right:10px}.details-table td:last-child{font-family:var(--font-mono);font-size:12.5px;text-align:right}.swatch{display:inline-block;width:13px;height:13px;border-radius:3px;border:1px solid rgba(0,0,0,.2);vertical-align:-2px;margin-right:6px}.score-ring{display:flex;align-items:baseline;gap:8px;margin-bottom:10px}.score-num{font-size:40px;font-weight:750;font-family:var(--font-mono);line-height:1}.score-good{color:var(--ok)}.score-mid{color:var(--accent-ink)}.score-bad{color:var(--danger)}.penalty-line{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid var(--line);font-size:12.5px}.penalty-line .pen{color:var(--danger);font-family:var(--font-mono);white-space:nowrap}.issue-item{width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:6px 4px;font-size:12.5px;font-family:var(--font-mono);color:var(--ink);cursor:pointer;border-radius:4px}.issue-item:hover{background:var(--surface-2)}.object-item{padding:6px 4px;border-bottom:1px solid var(--line)}.object-item,.object-item button.jump-btn{display:flex;align-items:center;gap:8px;font-size:12.5px}.object-item button.jump-btn{flex:1 1;background:none;border:none;color:var(--ink);cursor:pointer;text-align:left;padding:2px}.object-item button.jump-btn:hover{color:var(--accent-ink)}.eye-btn{background:none;border:none;cursor:pointer;font-size:14px;opacity:.75}.eye-btn.hidden-obj{opacity:.25}.toolbar{position:absolute;top:12px;left:50%;transform:translateX(-50%);display:flex;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:5px;box-shadow:var(--shadow);z-index:5;flex-wrap:wrap;max-width:calc(100% - 24px)}.toolbar select.plain{max-width:130px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.tb-btn{border:none;background:none;color:var(--ink);border-radius:8px;min-width:32px;height:30px;padding:0 9px;font-size:13px;cursor:pointer;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.tb-btn:hover{background:var(--surface-2)}.tb-btn.active{background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent-ink);font-weight:600}.tb-sep{width:1px;background:var(--line);margin:3px 2px}.playbar{position:absolute;bottom:max(14px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:8px 14px;box-shadow:var(--shadow);z-index:5;width:min(560px,calc(100% - 24px))}.playbar input[type=range]{flex:1 1;accent-color:var(--accent)}.playbar .counter{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-soft);white-space:nowrap}.badge-corner{position:absolute;right:12px;bottom:14px;z-index:5}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;padding:8px 12px;font-size:13px;font-weight:600;cursor:pointer;width:100%;transition:border-color .15s,background .15s}.btn.primary,.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);color:#fff}.btn.primary:hover{filter:brightness(1.06)}.btn:disabled{opacity:.5;cursor:default}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;font-size:12.5px}.field label{color:var(--ink-soft);display:flex;justify-content:space-between}.field label .val{font-family:var(--font-mono);color:var(--ink)}.field input[type=range]{accent-color:var(--accent)}.field input[type=number],.field select,select.plain{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:7px;padding:6px 8px;font-size:13px;font-family:inherit}.palette-chip{display:flex;align-items:center;gap:8px;width:100%;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px 10px;cursor:pointer;font-size:12.5px;margin-bottom:6px;color:var(--ink)}.palette-chip.active{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}.palette-chip .dots{display:flex;gap:2px}.palette-chip .dots i{width:10px;height:10px;border-radius:50%;border:1px solid rgba(0,0,0,.15)}.drawer-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:40}.drawer{position:fixed;top:0;right:0;bottom:0;width:min(360px,92vw);background:var(--surface);border-left:1px solid var(--line);box-shadow:var(--shadow);z-index:41;padding:18px;overflow-y:auto}.drawer h2{margin:0 0 14px;font-size:17px}.parse-overlay{position:fixed;inset:0;background:color-mix(in srgb,var(--bg) 75%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;z-index:50}.spinner{width:34px;height:34px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.stage-text{font-family:var(--font-mono);font-size:13px;color:var(--ink-soft)}@media (max-width:1080px){.viewer{grid-template-columns:280px 1fr;grid-template-areas:"topbar topbar" "strip strip" "sidebar canvas"}.rightbar{display:none}.sidebar .rightbar-inline{display:block;border-top:1px solid var(--line);padding:14px}}@media (min-width:1081px){.sidebar .rightbar-inline{display:none}}@media (max-width:760px){.viewer{grid-template-columns:1fr;grid-template-rows:52px auto 55vh auto;grid-template-areas:"topbar" "strip" "canvas" "sidebar";height:auto;overflow:auto}.sidebar{border-right:none;border-top:1px solid var(--line)}body{overflow:auto}}@media (max-width:480px){.topbar{gap:8px;padding:0 10px}.topbar .brand-full{display:none}.topbar .filename{max-width:90px}.topbar .btn .btn-label{display:none}.topbar .btn{width:auto;padding:6px 9px}.toolbar select.plain{max-width:88px;font-size:11px}.playbar{flex-wrap:wrap;justify-content:center;row-gap:6px;padding:8px 10px}.playbar input[type=range]{order:5;flex:1 1 100%}.playbar .counter{font-size:10.5px}}