:root{color-scheme:dark;--ink:#071922;--deep:#0a252e;--fog:#bbd0ce;--ivory:#fff5dc;--gold:#f8be60;--coral:#f56853;--jade:#48e1cb;--lilac:#ba8dec;--stroke:rgba(181,234,215,.16);font-family:Inter,'Noto Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--ivory);overflow:hidden}button,input,summary{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--jade);outline-offset:4px}a{color:inherit}::selection{background:#f6a86f;color:#051b22}.app{position:relative;height:100dvh;min-height:650px;overflow:hidden;background:radial-gradient(ellipse at 65% 43%,#134650 0,#07212a 46%,#07151d 83%)}
.world{position:absolute;inset:0 0 0 300px;overflow:hidden;isolation:isolate}.world canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline:0}.world canvas:active{cursor:grabbing}.scene-glow{position:absolute;pointer-events:none;inset:0;background:radial-gradient(ellipse at 49% 43%,transparent 28%,rgba(4,18,22,.17) 68%,rgba(4,16,23,.64) 100%);mix-blend-mode:multiply}.world:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(7,25,34,.20),transparent 16%,transparent 84%,rgba(7,20,30,.23));opacity:.6}
.masthead{z-index:30;position:absolute;top:0;left:0;right:0;height:100px;display:flex;align-items:flex-start;justify-content:space-between;padding:26px 38px;pointer-events:none}.mark,.header-right{pointer-events:auto}.mark{display:flex;gap:12px;text-decoration:none;font-size:14px;line-height:1.1;letter-spacing:.13em;font-weight:470}.mark b{font-weight:900;color:#f9c36d}.mark small{display:block;font-size:8px;line-height:2.5;letter-spacing:.21em;color:#98b5b1}.mark-symbol{font-size:38px;line-height:.9;color:var(--coral);text-shadow:0 0 19px #e77a5880}.header-right{display:flex;align-items:center;gap:28px}.edition{display:flex;gap:12px;font-size:9px;letter-spacing:.14em;color:#a8c5c0}.edition b{color:#fbbe73}.lang-switch{background:#e2f5e9;color:#10252b;border:0;border-radius:100px;padding:10px 16px;font-size:11px;letter-spacing:.18em;font-weight:800}.lang-switch span{opacity:.6;margin-left:10px}
.intro{position:absolute;left:0;bottom:0;top:104px;width:330px;z-index:20;padding:29px 29px 36px 38px;display:flex;flex-direction:column;gap:0;background:linear-gradient(90deg,rgba(7,23,32,.99) 0%,rgba(7,23,32,.96) 75%,rgba(7,23,32,.71));box-shadow:22px 0 60px rgba(6,20,30,.12)}
.eyebrow{font-size:9px;font-weight:760;letter-spacing:.20em;color:var(--jade);display:flex;align-items:center;gap:10px}.color-dot{width:7px;height:7px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 4px #f7655230}
.intro-title{margin:28px 0 0}.intro h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(62px,6vw,85px);letter-spacing:-.085em;font-weight:400;line-height:.88;margin:0 0 14px -5px}.period{color:var(--coral)}.vertical-sub{font-size:10px;letter-spacing:.23em;font-weight:800;color:#faab6e;margin-left:0}.intro-lead{font-size:13px;line-height:1.87;color:#bbd0c9;margin:30px 0 25px;max-width:248px}.chroma-line{height:4px;display:flex;gap:3px;width:214px}.chroma-line i{display:block;flex:1;background:#ef5c55}.chroma-line i:nth-child(2){background:#ec9e4c}.chroma-line i:nth-child(3){background:#3ed6c6}.chroma-line i:nth-child(4){background:#ad8cd7}.chroma-line i:nth-child(5){background:#f8e5bd}
.meta{display:flex;flex-direction:column;gap:18px;padding:28px 0 25px;border-bottom:1px solid var(--stroke)}.meta div{display:flex;flex-direction:column;gap:4px}.meta small,.context summary{font-size:9px;letter-spacing:.18em;font-weight:750;color:#72a49e}.meta strong{font-size:13px;font-weight:630}.context{padding:17px 0 12px;border-bottom:1px solid var(--stroke)}.context summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;color:#e6e9dc}.context summary::-webkit-details-marker{display:none}.context .plus{color:var(--jade);font-size:19px;font-weight:300;line-height:1}.context[open] .plus{transform:rotate(45deg)}.context p{font-size:11px;color:#a4c3bc;line-height:1.75;margin:13px 0 8px}.source{font-size:10px;color:#fdbd70;text-decoration:none}.source:hover{text-decoration:underline}.intro-footer{display:flex;justify-content:space-between;margin-top:auto;padding-top:20px;font-size:9px;letter-spacing:.14em;color:#73948c}.intro-footer i{color:var(--coral);font-style:normal}
.toolbox{z-index:18;position:absolute;right:34px;top:clamp(112px,16vh,170px);width:246px;background:rgba(8,26,36,.78);border:1px solid rgba(124,183,175,.18);border-radius:6px;box-shadow:0 22px 75px #03131c44;backdrop-filter:blur(18px);padding:20px 17px}.toolbox:before{content:'';position:absolute;inset:0 auto auto 0;height:2px;width:38%;background:linear-gradient(90deg,var(--jade),var(--gold),transparent)}.little-number{font-size:9px;letter-spacing:.13em;color:#7ea9a2}.toolbox h2{font-size:12px;letter-spacing:.16em;margin:6px 0 5px}.toolbox-head>small{font-size:10px;color:#799f9a}.tool-list{margin:18px 0 16px;border-block:1px solid rgba(181,234,215,.13)}.tool{display:flex;align-items:center;gap:10px;width:100%;background:transparent;border:0;border-bottom:1px solid rgba(181,234,215,.10);padding:13px 0;text-align:left;color:#eaf5e9;transition:transform .18s,color .18s}.tool:last-child{border-bottom:0}.tool:hover{transform:translateX(3px);color:var(--jade)}.tool.is-active .tool-icon{color:#051f28;background:#9de7d2;border-color:#9de7d2}.tool.is-active .tool-state{color:var(--jade)}.tool-icon{width:31px;height:31px;min-width:31px;display:grid;place-items:center;border-radius:50%;border:1px solid #618e8c5d;color:#f1bc7c;font-size:17px;transition:background .2s}.tool-copy{display:flex;flex-direction:column;gap:4px;flex:1}.tool-copy b{font-size:11px;font-weight:680}.tool-copy small{font-size:9px;color:#78a09e}.tool-state{color:#6b9995;font-size:14px}.tool.ritual .tool-icon{border-color:#e9ad6e66;color:#f6ad61}.tool.ritual .tool-state{color:#f6ad61}.range-label{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:.12em;font-weight:800;color:#a8c5b8}.range-label output{font-size:11px;font-variant-numeric:tabular-nums;color:#f9c476}input[type=range]{display:block;width:100%;margin:15px 0 14px;accent-color:#f4b56f;cursor:ew-resize;height:4px}.home-btn{width:100%;background:rgba(151,211,201,.07);border:1px solid rgba(126,184,174,.20);color:#d4e9e5;padding:11px 13px;display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:.12em;font-weight:800;text-align:left}.home-btn:hover{background:rgba(151,211,201,.15)}.home-btn>span:first-child{font-size:19px;color:var(--jade);line-height:1}.home-btn>span:nth-child(2){flex:1}.home-btn kbd{font-size:9px;border:1px solid #647f7a;padding:3px 5px;border-radius:2px;color:#91b0a7}
.inspector{position:absolute;z-index:22;left:calc(50% - 10px);bottom:71px;width:min(340px,35vw);min-height:97px;display:flex;align-items:flex-start;gap:12px;background:rgba(6,29,36,.78);padding:16px 20px 15px 15px;border:1px solid rgba(125,206,181,.23);border-left:3px solid #f8af65;box-shadow:0 19px 40px #00121945;backdrop-filter:blur(15px);transition:opacity .25s,transform .25s}.inspector.is-hidden{opacity:0;transform:translateY(12px);pointer-events:none}.inspector-sign{color:#f2b25e;font-size:23px;line-height:1.2}.inspector>div{flex:1;min-width:0}.inspector small{color:#a3b9b0;font-size:8px;letter-spacing:.18em;font-weight:750}.inspector h2{font-size:13px;margin:7px 0 3px;color:#fff1d2}.inspector p{font-size:10px;line-height:1.6;color:#a6c9c0;margin:0}.inspector-close{border:0;background:transparent;color:#91afa9;font-size:18px;line-height:1;padding:0}
.hotspots{position:absolute;inset:0;pointer-events:none;z-index:10}.hotspot{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:7px;background:transparent;border:0;color:#fff0cc;font-size:9px;letter-spacing:.08em;pointer-events:auto;filter:drop-shadow(0 3px 10px #07212c);white-space:nowrap}.hotspot-ring{display:grid;place-items:center;width:24px;height:24px;border:1px solid #fedcb999;background:#092d3499;border-radius:50%;box-shadow:inset 0 0 0 3px #091e2773}.hotspot-ring:before{content:'+';font-size:14px;color:#ffc57d;line-height:1}.hotspot-text{display:none;background:#08212bda;padding:6px 9px;border:1px solid #e9bf8055;border-radius:2px}.hotspot:hover .hotspot-text,.hotspot:focus-visible .hotspot-text{display:block}.hotspot:hover .hotspot-ring{background:#eab66b;transform:scale(1.14)}.hotspot:hover .hotspot-ring:before{color:#09222b}
.statusbar{position:absolute;z-index:25;bottom:0;left:0;right:0;height:43px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:rgba(4,19,26,.81);border-top:1px solid rgba(181,234,215,.13);font-size:9px;letter-spacing:.145em;font-weight:700;color:#9eb8af}.status-left,.status-right{display:flex;align-items:center;gap:15px}.status-pulse{height:6px;width:6px;border-radius:50%;background:#5bd3b7;box-shadow:0 0 0 4px #5bd3b51e;animation:pulse 2s ease-in-out infinite}.divider-dot{opacity:.35}.status-right b{color:#f8b76e}.status-right span:last-child{color:#65928f}
.loading{position:absolute;inset:0;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#175050,#081c29 63%);transition:opacity .55s,visibility .55s}.loading.fade{opacity:0;visibility:hidden}.loading-orb{height:80px;width:80px;border:1px solid #e9bf7b55;border-radius:50%;position:relative;animation:spin 3s linear infinite}.loading-orb:before{content:'✳';position:absolute;inset:0;display:grid;place-items:center;font-size:46px;color:#f5a96e}.loading-orb:after{content:'';position:absolute;inset:13px;border:1px solid #4ce2cb55;border-radius:50%}.loading p{font-size:11px;letter-spacing:.24em;margin:27px 0 9px}.loading span{font-size:11px;color:#83a69d}.webgl-error{position:absolute;z-index:41;inset:20%;padding:26px;background:#0a212e;color:#fff;border:1px solid #ecb270}.webgl-error p{font-size:12px;line-height:1.7}.hidden{display:none!important}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{box-shadow:0 0 0 7px #5bd3b503}}
@media(max-height:790px) and (min-width:921px){.intro{padding-top:8px}.intro-title{margin-top:16px}.intro-lead{margin:19px 0}.meta{padding:16px 0;gap:8px}.context{padding:11px 0}.context p{line-height:1.48}.toolbox{top:105px}.tool{padding:9px 0}.toolbox{padding:12px 14px}.inspector{bottom:53px}}
@media(max-width:1250px){.world{left:265px}.intro{width:300px;padding-left:30px;padding-right:30px}.intro h1{font-size:66px}.toolbox{right:20px;width:225px}.inspector{left:42%;width:300px}.edition{display:none}}
@media(max-width:920px){body{overflow:auto}.app{min-height:760px}.world{left:0}.masthead{padding:20px 22px}.intro{top:86px;bottom:auto;min-height:0;width:min(355px,59vw);padding:24px 20px 23px 24px;background:linear-gradient(90deg,rgba(4,20,29,.91),rgba(4,20,29,.50));box-shadow:none}.intro-title{margin-top:22px}.intro h1{font-size:68px}.intro-lead{font-size:12px;line-height:1.65;margin:20px 0}.chroma-line{width:175px}.meta{gap:12px;padding:18px 0}.context{padding:13px 0}.context p{font-size:10px}.intro-footer{padding-top:12px}.toolbox{right:18px;top:112px;width:208px;padding:14px 13px}.tool-icon{width:27px;height:27px;min-width:27px}.tool{padding:10px 0}.tool-copy b{font-size:10px}.tool-copy small{font-size:8px}.inspector{left:40%;bottom:57px;width:min(335px,52vw)}.statusbar{padding:0 20px}.status-right span:first-child{display:none}}
@media(max-width:600px){.app{height:100dvh;min-height:680px}.masthead{height:65px;padding:15px 15px}.mark{font-size:10px;gap:8px}.mark small{font-size:6.7px}.mark-symbol{font-size:30px}.lang-switch{padding:8px 10px;font-size:9px}.lang-switch span{margin-left:5px}.intro{top:66px;left:0;width:100%;bottom:auto;padding:10px 22px 10px;background:linear-gradient(180deg,rgba(5,22,31,.92),rgba(5,22,31,.42) 85%,transparent);pointer-events:none}.intro .eyebrow,.intro-title,.intro-lead,.chroma-line{pointer-events:auto}.eyebrow{font-size:8px}.intro-title{margin:13px 0 0}.intro h1{font-size:58px;margin:0 0 6px}.vertical-sub{font-size:8px}.intro-lead{font-size:10px;line-height:1.55;max-width:250px;margin:10px 0 11px}.chroma-line{width:140px;height:3px}.meta,.context,.intro-footer{display:none}.world{inset:0}.world:after{background:linear-gradient(180deg,rgba(4,17,25,.40),transparent 36%,transparent 54%,rgba(4,17,25,.45) 100%)}.toolbox{top:auto;bottom:124px;right:10px;left:10px;width:auto;display:block;padding:9px 10px;background:rgba(7,27,35,.81)}.toolbox-head{display:none}.tool-list{margin:0 0 8px;display:grid;grid-template-columns:repeat(5,1fr);border:0;gap:2px}.tool{display:flex;flex-direction:column;gap:4px;align-items:center;text-align:center;justify-content:center;padding:5px 1px;border:0;min-width:0}.tool:hover{transform:none}.tool-icon{width:29px;height:29px;min-width:29px}.tool-copy b{font-size:7px;line-height:1.25;font-weight:650;min-height:17px}.tool-copy small,.tool-state{display:none}.light-control{display:flex;align-items:center;gap:8px;padding:0 4px}.range-label{flex:0 0 130px;font-size:7px}.range-label output{font-size:9px}.light-control input{flex:1;min-width:0;margin:9px 0}.home-btn{position:absolute;right:10px;top:-39px;width:36px;height:32px;justify-content:center;padding:0}.home-btn span:nth-child(2),.home-btn kbd{display:none}.inspector{left:10px;bottom:238px;width:calc(100% - 20px);max-height:110px;overflow:auto;padding:9px 13px}.inspector h2{font-size:11px;margin:3px 0}.inspector p{font-size:9px}.inspector small{font-size:7px}.inspector-sign{font-size:20px}.statusbar{height:33px;padding:0 11px;font-size:7px}.status-left{gap:8px}.status-left span:nth-child(4),.status-right span:first-child{display:none}.status-right{gap:8px}.hotspot-ring{width:22px;height:22px}.hotspot-text{font-size:9px}}
@media(max-width:370px){.tool-copy b{font-size:6.5px}.intro h1{font-size:53px}.range-label{flex-basis:125px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
