:root{font-family:Noto Sans Thai,system-ui,sans-serif;color:#f4efff;background:#08060d;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 78% 8%,#3c1457 0,transparent 35%),radial-gradient(circle at 8% 68%,#241044 0,transparent 30%),#08060d}.shell{width:min(1040px,calc(100% - 36px));margin:auto;padding:64px 0 40px}.masthead{display:grid;grid-template-columns:86px 1fr;gap:28px;align-items:start;margin-bottom:38px}.brand-mark{height:86px;display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #ffffff1c;background:#ffffff0b;border-radius:24px}.brand-mark i{display:block;width:5px;border-radius:6px;background:linear-gradient(#ffd66b,#f34caa 55%,#7338e8);box-shadow:0 0 16px #ec55c980}.brand-mark i:nth-child(1),.brand-mark i:nth-child(5){height:24px}.brand-mark i:nth-child(2),.brand-mark i:nth-child(4){height:44px}.brand-mark i:nth-child(3){height:62px}.eyebrow{margin:2px 0 12px;color:#d493ff;font:600 12px/1.2 Space Grotesk,sans-serif;letter-spacing:.2em}.masthead h1{margin:0;font-size:clamp(38px,6vw,66px);line-height:1.06;letter-spacing:-.04em}.lede{max-width:700px;margin:15px 0 0;color:#b8afc8;font-size:18px;line-height:1.7}.workspace{border:1px solid #ffffff20;background:linear-gradient(145deg,#171020e8,#0f0b17e8);box-shadow:0 36px 90px #0008;border-radius:30px;overflow:hidden}.drop-zone{min-height:390px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer;outline:none;transition:.25s}.drop-zone:hover,.drop-zone:focus,.drop-zone.dragging{background:#a45cff0d;box-shadow:inset 0 0 0 2px #c179ff80}.drop-icon{width:76px;height:76px;display:grid;place-items:center;border-radius:24px;background:linear-gradient(145deg,#f0a6ff,#7d47ff);box-shadow:0 14px 36px #863dff55;margin-bottom:24px}.drop-icon svg{width:42px;fill:none;stroke:#150c20;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.drop-zone h2{font-size:27px;margin:0 0 8px}.drop-zone p{margin:0;color:#9f96ae}.privacy-pill{margin-top:22px;padding:7px 12px;border-radius:999px;color:#bca8d5;background:#ffffff0c;border:1px solid #ffffff14;font-size:12px}.job{padding:32px}.job-head{display:flex;justify-content:space-between;gap:20px;align-items:start}.label{margin:0 0 5px;color:#9b8bab;font-size:12px;letter-spacing:.08em}.job h2{margin:0;font-size:22px;overflow-wrap:anywhere}.meta{margin:5px 0 0;color:#8f879c;font-size:13px}.quiet-button,.primary-button{border:0;font:600 14px Noto Sans Thai,sans-serif;cursor:pointer}.quiet-button{color:#d7c9e7;background:#ffffff0c;border:1px solid #ffffff18;border-radius:12px;padding:9px 14px}.meter{height:8px;background:#ffffff0b;border-radius:99px;overflow:hidden;margin-top:28px}.meter div{height:100%;width:0;background:linear-gradient(90deg,#7e3cff,#e645ac,#ffca63);box-shadow:0 0 18px #e34fa5;transition:width .25s}.status-line{display:flex;justify-content:space-between;color:#a8a0b3;font-size:13px;margin:9px 0 22px}.status-line strong{color:#f1dcff}canvas{width:100%;height:auto;display:block;background:#030205;border:1px solid #ffffff10;border-radius:16px;aspect-ratio:3/1}.result{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:24px;padding:18px;border-radius:18px;background:#8ae8c50c;border:1px solid #8ae8c52b}.result-copy{display:flex;align-items:center;gap:13px}.result-copy .check{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#08140f;background:#8ae8c5;font-weight:800}.result-copy strong,.result-copy small{display:block}.result-copy small{color:#9caaa5;margin-top:3px}.primary-button{color:#130817;background:linear-gradient(135deg,#f4b3ff,#ffcc70);padding:12px 18px;border-radius:13px;white-space:nowrap}.error{color:#ff9ea7;background:#ff425417;border:1px solid #ff758033;padding:13px 15px;border-radius:12px}.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}.facts article{display:flex;gap:16px;align-items:center;padding:19px 20px;border:1px solid #ffffff13;background:#ffffff08;border-radius:17px}.facts span{font:600 20px Space Grotesk,sans-serif;color:#efc2ff;white-space:nowrap}.facts p{margin:0;color:#918a9d;font-size:12px;line-height:1.5}.howto{border-top:1px solid #ffffff14;padding:22px 4px;color:#aaa2b5}.howto summary{cursor:pointer;color:#ddd4e8;font-weight:600}.howto li,.howto p{line-height:1.7}.howto code{color:#efc2ff}footer{text-align:center;color:#6f6879;font-size:11px;margin-top:42px}@media(max-width:720px){.shell{padding-top:36px}.masthead{grid-template-columns:1fr}.brand-mark{width:72px;height:72px}.facts{grid-template-columns:1fr}.job{padding:22px}.job-head,.result{align-items:stretch;flex-direction:column}.primary-button{width:100%}}.project-info{margin-top:36px;padding:32px;border:1px solid #ffffff20;border-radius:24px;background:#13101be6;color:#c8c0d4;line-height:1.9;overflow-wrap:anywhere}.project-info h2{margin:0;color:#f4efff;font-size:clamp(24px,4vw,32px);line-height:1.5}.project-info h3{color:#f4efff;font-size:21px;line-height:1.6;margin:0 0 16px}.project-info p{margin:14px 0}.project-info .project-byline{color:#e0b5ff;font-size:14px}.project-info section{border-top:1px solid #ffffff16;margin-top:30px;padding-top:28px;scroll-margin-top:24px}.project-info a{color:#e5baff;text-decoration-thickness:1px;text-underline-offset:4px}.project-info a:hover{color:#ffdb9a}.project-info a:focus-visible{outline:2px solid #ffdb9a;outline-offset:4px;border-radius:3px}.info-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.info-nav a{padding:6px 12px;border:1px solid #ffffff24;border-radius:10px;text-decoration:none;font-size:14px;background:#ffffff06}.project-info li{margin:10px 0;padding-left:4px}.project-info ol,.project-info ul{padding-left:25px}.analysis-specs{margin:20px 0}.analysis-specs>div{display:grid;grid-template-columns:minmax(180px,1fr) 2fr;gap:20px;padding:12px 0;border-bottom:1px solid #ffffff12}.analysis-specs dt{font-weight:600;color:#eee3f7}.analysis-specs dd{margin:0}.project-info blockquote{margin:18px 0;padding:18px 22px;border-left:3px solid #c179ff;background:#ffffff06;border-radius:0 12px 12px 0}.project-info .reference-list{list-style:none;padding-left:0}.reference-list li{padding-left:24px;text-indent:-24px;margin:22px 0}@media(max-width:720px){.project-info{padding:22px 18px}.analysis-specs>div{grid-template-columns:1fr;gap:2px}.project-info blockquote{padding:14px 16px}}[hidden]{display:none!important}#viewer-host{margin:24px -3vw}#viewer-host iframe{width:100%;height:1300px;border:1px solid #41394f;border-radius:16px;background:#0c0b12}#file-name{overflow-wrap:anywhere}.masthead{display:block}.shell{width:min(1500px,calc(100% - 48px))}#job{padding:24px}#viewer-host{margin:24px 0}:root{color-scheme:light;--lab-bg:#fff;--lab-surface:#f5f5f7;--lab-border:#e5e5ea;--lab-text:#1d1d1f;--lab-muted:#6e6e73;--lab-accent:#0066cc;color:var(--lab-text);background:var(--lab-bg)}body{color:var(--lab-text);background:var(--lab-bg)}.shell{width:min(1500px,calc(100% - 64px));padding:42px 0 60px}.masthead{display:block;margin-bottom:28px;padding-bottom:26px;border-bottom:1px solid var(--lab-border)}.masthead h1{color:var(--lab-text);font-size:clamp(38px,5.5vw,58px);font-weight:650;line-height:1.09;letter-spacing:-.045em}.lede{max-width:900px;color:var(--lab-muted);font-size:clamp(14px,1.5vw,17px);line-height:1.65;margin-top:12px}.workspace{background:var(--lab-surface);border:1px solid var(--lab-border);border-radius:20px;box-shadow:none}.drop-zone{min-height:240px;padding:36px 22px;transition:background-color .18s,box-shadow .18s}.drop-zone:hover,.drop-zone:focus,.drop-zone.dragging{background:#eeeef1;box-shadow:inset 0 0 0 2px #b2b2b7}.drop-zone:focus-visible{outline:2px solid var(--lab-accent);outline-offset:3px}.drop-zone h2{color:var(--lab-text);font-size:clamp(20px,2.5vw,25px);font-weight:600}.drop-zone p,.meta,.label{color:var(--lab-muted)}.privacy-pill{color:#424245;background:#fff;border:1px solid #d2d2d7;font-size:12px}.job,.job h2{color:var(--lab-text)}.quiet-button,.primary-button{border-radius:11px;padding:10px 16px;box-shadow:none}.quiet-button{background:#fff;color:var(--lab-text);border:1px solid #d2d2d7}.quiet-button:hover{background:#e8e8ed}.primary-button{background:var(--lab-text);color:#fff;border:1px solid var(--lab-text)}.primary-button:hover{background:#424245}.quiet-button:focus-visible,.primary-button:focus-visible,.info-nav a:focus-visible{outline:2px solid var(--lab-accent);outline-offset:3px}.meter{height:6px;background:#e2e2e7}.meter div{background:#1d1d1f;box-shadow:none}.status-line{color:var(--lab-muted)}.status-line strong{color:var(--lab-text)}.error{color:#b42318;background:#fff7f6;border:1px solid #ffd5d1}.facts article{background:#fff;border:1px solid var(--lab-border);box-shadow:none}.facts span{color:var(--lab-text)}.facts p{color:var(--lab-muted)}.brand-mark{background:var(--lab-surface);border-color:var(--lab-border);box-shadow:none}.brand-mark i{background:var(--lab-text);box-shadow:none}.eyebrow{color:var(--lab-muted)}.result{background:#fff;border:1px solid var(--lab-border)}.result-copy .check{background:var(--lab-text);color:#fff}.result-copy small{color:var(--lab-muted)}.howto{border-top:1px solid var(--lab-border);color:#424245}.howto summary,.howto code{color:var(--lab-text)}.project-info{background:#fff;color:#424245;border:0;border-top:1px solid var(--lab-border);border-radius:0;padding:32px 0;line-height:1.85}.project-info h2,.project-info h3{color:var(--lab-text)}.project-info .project-byline{color:var(--lab-muted)}.project-info section{border-top:1px solid var(--lab-border)}.project-info a{color:var(--lab-accent)}.project-info a:hover{color:#004a99}.project-info a:focus-visible{outline-color:var(--lab-accent)}.info-nav a{color:var(--lab-text);background:var(--lab-surface);border:1px solid var(--lab-border);border-radius:999px}.info-nav a:hover{background:#e8e8ed}.analysis-specs>div{border-bottom:1px solid var(--lab-border)}.analysis-specs dt{color:var(--lab-text)}.project-info blockquote{background:var(--lab-surface);border-left:3px solid #a1a1aa}footer{color:var(--lab-muted)}#viewer-host iframe{background:#fff;border:1px solid var(--lab-border);border-radius:16px;box-shadow:none}@media(max-width:720px){.shell{width:calc(100% - 28px);padding:26px 0 34px}.masthead{margin-bottom:20px;padding-bottom:19px}.drop-zone{min-height:206px;padding:28px 14px}.project-info{padding:24px 0}#viewer-host{margin:16px 0}#viewer-host iframe{border-radius:10px}}@media(prefers-reduced-motion:reduce){.drop-zone,.meter div{transition:none}}
