:root{color-scheme:light;--bg:#e8e8e3;--surface:#f2f0e8;--card:#eeece5;--ink:#181715;--muted:#64625c;--line:#c4c1b6;--accent:#b69e26;--stage:#111e27;--stageText:#e9e6d6;--stageMuted:#9faeb0}
body.dark{color-scheme:dark;--bg:#181715;--surface:#23221f;--card:#262521;--ink:#e8e8e3;--muted:#aca99f;--line:#504d43;--accent:#d1b44b}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:400 clamp(16px,1.15vw,19px)/1.5 Archivo,Pretendard,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:disabled{opacity:.55;cursor:not-allowed}
.site-header{height:65px;display:flex;justify-content:space-between;align-items:center;padding:0 max(24px,5vw);border-bottom:1px solid var(--line);font-size:14px}.brand{font-weight:700;text-decoration:none;font-size:18px}.site-header nav{display:flex;gap:clamp(10px,2.2vw,26px);align-items:center}.site-header nav a{text-decoration:none}.site-header nav a:hover{text-decoration:underline}.toggle{border:0;background:transparent;color:var(--ink);min-height:44px;min-width:38px}
main{max-width:1560px;padding:62px clamp(18px,5vw,82px) 110px;margin:auto}.eyebrow{font-size:11px;font-weight:700;letter-spacing:.19em;color:var(--muted);margin-bottom:24px}.heading{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:55px;align-items:end;margin-bottom:45px}h1{font-size:clamp(45px,6.5vw,104px);font-weight:500;line-height:.96;letter-spacing:-.055em;margin:0}.opening{max-width:510px;padding-bottom:5px}.opening p{margin:0 0 18px}.opening .muted{font-size:14px;margin-bottom:0;color:var(--muted)}
.lab-layout{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(310px,.72fr);gap:14px;align-items:stretch}.card{background:var(--card);border:1px solid var(--line);min-width:0}.card-head{min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px;font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--muted);border-bottom:1px solid var(--line)}.card-head .stage-tag{color:var(--accent)}
.stage{display:flex;flex-direction:column}.canvas-wrap{height:clamp(385px,43vw,610px);position:relative;background:radial-gradient(ellipse at 42% 53%,#233644 0%,#0e1a23 70%);overflow:hidden;touch-action:pan-y}#scene-3d{width:100%;height:100%;display:block;touch-action:none;outline:none}#scene-fallback{position:absolute;inset:0;display:grid;place-items:center;padding:30px;color:var(--stageText);font-size:14px;text-align:center;line-height:1.7;max-width:460px;margin:auto;pointer-events:none}#scene-fallback a{pointer-events:auto}#scene-fallback[hidden]{display:none}
.scene-label{position:absolute;font-size:10px;letter-spacing:.13em;font-weight:700;color:var(--stageMuted);pointer-events:none;text-shadow:0 2px 8px #0f1823}.label-beam{left:5%;top:50%}.label-detector{right:5%;top:27%}.label-crystal{left:41%;bottom:18%}.scene-hint{position:absolute;left:22px;bottom:18px;color:#9ba8ae;font-size:10px;letter-spacing:.1em;pointer-events:none}.stage-foot{display:flex;gap:9px;align-items:flex-start;font-size:12px;line-height:1.6;padding:14px 20px;color:var(--muted);min-height:55px}.stage-foot .dot{width:7px;height:7px;margin-top:6px;flex:none;border-radius:50%;background:var(--accent)}
.controls{display:flex;flex-direction:column}.control-body{padding:28px 25px 16px;flex:1}.control-row{display:flex;justify-content:space-between;gap:10px;font-size:15px;font-weight:600;margin-bottom:18px}.control-row.second{margin-top:44px}output{font-variant-numeric:tabular-nums}input[type=range]{display:block;width:100%;height:26px;accent-color:var(--accent);cursor:pointer}.range-ends{display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.buttons{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:43px}.buttons button{min-height:50px;border:1px solid var(--ink);padding:9px 10px;font-size:12px;font-weight:700}.buttons .primary{background:var(--ink);color:var(--bg)}.buttons .secondary{background:transparent;color:var(--ink)}.buttons .secondary[aria-pressed=true]{background:var(--accent);color:#181715;border-color:var(--accent)}
.readout{display:grid;grid-template-columns:1fr 1fr;gap:14px;border-top:1px solid var(--line);padding:24px 25px 17px}.readout small{display:block;text-transform:uppercase;line-height:1.4;letter-spacing:.08em;color:var(--muted);font-size:10px;min-height:32px}.readout strong{display:block;font-size:clamp(25px,2.5vw,39px);font-weight:500;line-height:1.1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.readout-note{margin:0;padding:0 25px 26px;color:var(--muted);font-size:12px}
.analysis{margin-top:94px}.analysis-head{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:start;margin-bottom:29px}.analysis h2,.explain h2{font-size:clamp(28px,3.6vw,48px);font-weight:500;letter-spacing:-.04em;line-height:1.08;margin:0}.analysis-head p{max-width:590px;margin:0;color:var(--muted);font-size:16px}.analysis-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.analysis-panel{margin:0}.analysis-panel canvas{display:block;width:calc(100% - 40px);height:310px;margin:20px auto 14px;background:var(--stage);border:1px solid #33414a}.analysis-panel figcaption{font-size:13px;color:var(--muted);padding:0 20px 23px;min-height:60px}#detector-map{width:min(calc(100% - 40px),400px);height:auto;aspect-ratio:144 / 112}
.explain{display:grid;grid-template-columns:1fr 1.1fr;gap:80px;margin-top:105px;border-top:1px solid var(--line);padding-top:40px}.explain-title span{font-size:11px;letter-spacing:.15em;color:var(--muted);display:block;margin-bottom:18px}.explain-body{max-width:680px}.explain p{margin:0 0 21px;font-size:16px}.equation{padding:24px 20px;margin:26px 0 31px;border-left:3px solid var(--accent);background:var(--surface);font:500 clamp(17px,2.2vw,24px)/1.5 Georgia,serif;overflow-wrap:anywhere}.equation span{white-space:normal}.links{display:flex;flex-direction:column;gap:9px;margin-top:28px;font-weight:600;font-size:14px}.links a{text-underline-offset:4px}footer{border-top:1px solid var(--line);padding:26px clamp(18px,5vw,82px);display:flex;justify-content:space-between;gap:15px;font-size:12px;color:var(--muted)}
html[lang=ko]{word-break:keep-all;overflow-wrap:break-word}html[lang=ko] body{font-family:Pretendard,"Apple SD Gothic Neo","Malgun Gothic",sans-serif}html[lang=ko] h1{letter-spacing:-.055em;line-height:1.1}html[lang=ko] .scene-hint,html[lang=ko] .card-head{letter-spacing:0}
@media(max-width:1050px){.heading{grid-template-columns:1fr;gap:25px}.lab-layout{grid-template-columns:minmax(0,1fr)}.canvas-wrap{height:min(68vw,610px);min-height:350px}.analysis-grid{grid-template-columns:1fr 1fr}.explain{gap:30px}}
@media(max-width:660px){main{padding:38px 16px 75px}.site-header{height:56px;padding:0 12px;gap:8px}.brand{font-size:14px}.site-header nav{gap:8px;font-size:12px}.site-header nav a[href="../../#work"]{display:none}.site-header nav button{min-width:32px}h1{font-size:clamp(44px,11vw,66px)}.heading{margin-bottom:30px}.opening{font-size:16px}.canvas-wrap{height:390px;min-height:0}.scene-label{font-size:9px}.label-detector{right:4%;top:19%}.label-beam{left:4%;top:55%}.stage-foot{font-size:11px}.control-body{padding:25px 19px 17px}.control-row.second{margin-top:29px}.buttons{margin-top:30px}.analysis{margin-top:65px}.analysis-head,.analysis-grid,.explain{display:block}.analysis-head h2{margin-bottom:17px}.analysis-panel+.analysis-panel{margin-top:14px}.analysis-panel canvas{height:245px}.explain{margin-top:65px}.explain-title{margin-bottom:30px}.readout{padding:18px}.readout-note{padding:0 18px 20px}.eq-break{display:block;margin-top:4px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}