@font-face{font-family:LightSerif;src:url('/fonts/cormorant-garamond-latin-400-normal.woff2') format('woff2');font-display:swap;font-weight:400}
@font-face{font-family:LightSans;src:url('/fonts/inter-latin-400-normal.woff2') format('woff2');font-display:swap;font-weight:400}
:root{color-scheme:dark;font-family:LightSans,system-ui,sans-serif;color:#e8f2ef;background:#06171b;--accent:#8ffff0;--muted:#a2b7b7;--panel:rgba(7,23,29,.88)}
*{box-sizing:border-box}body{margin:0;min-height:100dvh;overflow:hidden;isolation:isolate}body[data-game=mago]{--panel:rgba(29,19,8,.92);background:#211509}body[data-game=camino]{--panel:rgba(12,17,36,.92);background:#101831}
button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;border:1px solid #ffffff25;background:#ffffff08;transition:background .18s,border-color .18s,transform .18s}button:hover{background:#ffffff18;border-color:var(--accent)}button:active{transform:scale(.97)}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}[hidden]{display:none!important}a{color:inherit;text-decoration:none}.skip{position:fixed;left:8px;top:-80px;z-index:50;background:#081d22;padding:12px}.skip:focus{top:8px}
.backdrop{position:fixed;inset:-2%;background-image:var(--art);background-size:cover;background-position:center;filter:brightness(.66) saturate(.95);transform:scale(1.02);transition:filter 1.4s;z-index:-3}.intro .backdrop{filter:brightness(.72) saturate(.9)}.vignette{position:fixed;inset:0;pointer-events:none;background:linear-gradient(0deg,#031016e8 0%,transparent 48%,#04121b65 100%),radial-gradient(ellipse at 50% 40%,transparent 15%,#02091170 100%);z-index:-2}body[data-game=mago] .vignette{background:linear-gradient(0deg,#160d02e8,transparent 65%,#1e10004d),radial-gradient(ellipse at 50% 35%,transparent,#140b0060)}
.game-header{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;gap:20px;border-bottom:1px solid #ffffff14;background:linear-gradient(180deg,#041217c4,transparent);position:relative;z-index:5}.back{font-size:12px;letter-spacing:.04em}.brand{font-family:LightSerif,Georgia,serif;font-size:26px;white-space:nowrap}.brand em{color:var(--accent);font-style:normal}.game-header nav{display:flex;gap:6px}.game-header button{border:0;background:transparent;border-radius:4px;padding:10px;font-size:15px}.game-header button span{font-size:11px;margin-left:4px;color:#d0dfdf}.game-header #quality{display:none}
.experience{position:relative;height:calc(100dvh - 70px);min-height:420px}.stage{position:absolute;inset:0 310px 0 0;overflow:hidden}.intro .stage{inset:0;opacity:.22;pointer-events:none}.stage canvas{display:block;width:100%;height:100%;touch-action:none;outline:none}.welcome{position:absolute;inset:0;z-index:2;display:flex;align-items:center;flex-direction:column;justify-content:center;text-align:center;padding:22px 30px 40px;background:radial-gradient(ellipse at center,#06171b55 0%,#04111a05 65%)}.eyebrow{font-size:9px;letter-spacing:.22em;font-weight:400;color:var(--accent);text-transform:uppercase;margin:0 0 13px}.welcome .eyebrow{color:#e7ecd7;font-size:10px;letter-spacing:.28em;margin-bottom:14px}.sigil{font-family:Georgia,serif;font-size:62px;line-height:1.1;color:var(--accent);text-shadow:0 0 26px var(--accent);animation:breath 5s ease-in-out infinite}.welcome h1{font-family:LightSerif,Georgia,serif;font-weight:400;letter-spacing:.035em;font-size:clamp(58px,7.5vw,108px);line-height:1;margin:16px 0 12px;text-shadow:0 4px 35px #0008}.welcome-subtitle{font-family:LightSerif,Georgia,serif;font-size:clamp(22px,2.5vw,30px);margin:0 0 18px;color:#e0f1e8}.welcome-story{max-width:560px;font-size:13px;line-height:1.8;color:#dce9e7;margin:0 0 26px;text-shadow:0 1px 12px #000}.primary{background:linear-gradient(135deg,#b8fff0,#77dcc9);border:1px solid #c8fff4;color:#09292b;box-shadow:0 0 32px #83f8dd33;font-size:12px;letter-spacing:.045em;padding:16px 27px;border-radius:3px;font-weight:600}.primary:hover{background:#c5fff4;color:#09292b}body[data-game=camino] .primary{background:linear-gradient(135deg,#d9e7ff,#9aaee9);color:#151d37}body[data-game=mago] .primary{background:linear-gradient(135deg,#fff0c4,#e2ba62);color:#302009}.start{min-width:240px}.start span{margin-left:22px}.continue{border:0;background:none;padding:12px;margin-top:5px;font-size:12px;color:#e4eeee;text-decoration:underline;text-underline-offset:4px}.welcome-meta{font-size:9px;letter-spacing:.17em;color:#d4dfd6;margin:27px 0 10px}.welcome-meta i{font-style:normal;margin:0 10px;color:var(--accent)}.welcome-hint{font-size:10px;color:#a3b6b6;margin:0}
.journal{position:absolute;right:0;top:0;bottom:0;width:310px;padding:24px 24px 150px;background:linear-gradient(90deg,#04161b80,var(--panel) 14%);border-left:1px solid #ffffff12;overflow-y:auto;scrollbar-width:thin}.chapter-label{display:flex;align-items:center;justify-content:space-between;gap:4px;font-size:9px;letter-spacing:.12em;color:var(--accent)}.chapter-label button{border:0;font-size:10px;padding:6px}.journal h2{font-family:LightSerif,Georgia,serif;font-weight:400;font-size:31px;line-height:1.07;margin:19px 0 16px}.objective{font-size:12px;line-height:1.65;color:#d1e0df;margin-bottom:22px}.progress-track{height:2px;background:#ffffff19}.progress-track span{display:block;background:var(--accent);height:100%;width:0;box-shadow:0 0 12px var(--accent);transition:width .5s}.progress-label{font-size:10px;color:var(--accent);margin:10px 0 25px}.wisdom-card{border-top:1px solid #ffffff15;border-bottom:1px solid #ffffff15;padding:20px 0}.wisdom-card h3{font-family:LightSerif,Georgia,serif;font-weight:400;font-size:23px;line-height:1.15;margin:0 0 11px}.wisdom-card p:not(.eyebrow){font-size:11px;line-height:1.7;color:#bed0d0}.text-button{font-size:10px;line-height:1.5;background:none;border:none;color:var(--accent);padding:8px 0;text-align:left}.next-objective{font-size:11px;line-height:1.6;color:#d1e0df;margin:20px 0 16px}.soft-button{width:100%;padding:11px;font-size:11px;border-color:#ffffff28;background:#ffffff06;border-radius:3px}.save-status{font-size:9px;line-height:1.6;color:var(--muted);margin-top:18px}
.controls{position:absolute;bottom:24px;left:30px;right:336px;display:flex;justify-content:space-between;align-items:flex-end;pointer-events:none;gap:12px;z-index:3}.controls button{pointer-events:auto}.control-label,.key-note{font-size:8px;color:#bcd3d0;letter-spacing:.1em;display:block;text-align:center}.control-label{margin-bottom:9px}.key-note{margin-top:8px}.dpad{display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:4px}.dpad button{border-radius:4px;background:#071b23d9;border-color:#b8ecea40;font-size:19px;box-shadow:0 4px 16px #0003}.dpad button[data-dir="0"]{grid-area:1/2}.dpad button[data-dir="3"]{grid-area:2/1}.dpad button[data-dir="1"]{grid-area:2/3}.dpad button[data-dir="2"]{grid-area:3/2}.dpad span{grid-area:2/2;display:grid;place-items:center;color:var(--accent);font-size:15px}.action-buttons{width:185px}.action{width:100%;min-height:52px;font-size:20px;color:var(--accent);background:#071b23e8;border-color:#a1e8e466;border-radius:4px;box-shadow:0 0 18px #69f3c615}.action span{font-size:11px;margin-left:5px;letter-spacing:.015em}.small-actions{display:flex;gap:6px;margin-top:18px}.small-actions button{font-size:9px;padding:8px;background:#061820df;border-radius:3px;flex:1}.scene-caption{position:absolute;top:26px;left:30px;pointer-events:none;opacity:.8}.scene-caption span{display:block;font-size:8px;letter-spacing:.2em;color:var(--accent);margin-bottom:7px}.scene-caption strong{font-family:LightSerif,Georgia,serif;font-size:24px;font-weight:400;text-shadow:0 2px 15px #000}.intro .scene-caption{display:none}.toast{position:absolute;left:50%;bottom:174px;transform:translateX(-50%) translateY(10px);padding:12px 22px;border:1px solid #acdbd544;background:#06161ded;font-size:11px;text-align:center;max-width:85%;width:max-content;color:#eefbf9;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;border-radius:3px}.toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}#motion-flash{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse,#acffdf55,transparent 75%)}#motion-flash.flash{animation:flash .65s ease-out}
dialog{color:#e6f2ef;background:linear-gradient(145deg,#0a232cfa,#06111cfb);border:1px solid #abddd43d;border-radius:8px;padding:38px;max-width:650px;width:calc(100% - 32px);max-height:86dvh;overflow:auto;box-shadow:0 30px 130px #0009}body[data-game=mago] dialog{background:linear-gradient(145deg,#332610fc,#171106fc);border-color:#e5ca8555}dialog::backdrop{background:#0009;backdrop-filter:blur(9px)}dialog h2{font-family:LightSerif,Georgia,serif;font-size:40px;font-weight:400;line-height:1.06;margin:0 0 22px}dialog h3{font-family:LightSerif,Georgia,serif;font-size:26px;font-weight:400;line-height:1.2;margin:22px 0 10px}dialog p,dialog li{font-size:13px;line-height:1.8;color:#c8dddd}dialog strong{color:#f6fff3}dialog .close{position:absolute;right:15px;top:12px;border:0;background:transparent;font-size:26px;padding:3px 9px;color:#c9d7d5}#modal-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}#modal-actions button:not(.primary){padding:12px 18px;font-size:11px;border-radius:3px}.level-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin-top:20px}.level-grid button{padding:13px 5px;font-size:14px}.level-grid button.completed{color:var(--accent);border-color:#80d2be66}.level-grid button.current{background:#b6f1d921}.reading{border-top:1px solid #ffffff20;margin-top:18px;padding-top:18px}.reading summary{font-size:13px;line-height:1.6;color:var(--accent);cursor:pointer}.reading p{white-space:pre-line}.practice{background:#ffffff08;border-left:2px solid var(--accent);padding:16px 19px}.badge{font-size:9px;letter-spacing:.1em;color:var(--accent)}.level-end-sigil{font-size:62px;color:var(--accent);text-align:center;text-shadow:0 0 25px var(--accent)}.modal-progress{font-size:10px;color:var(--accent)}.reference{font-size:10px!important;color:#96b7b7!important}.noscript,#loading-error{position:fixed;inset:30% 10%;padding:30px;z-index:30;background:#04121b;border:1px solid #a0d7c7;text-align:center}
body:not(.intro) .game-header #quality{display:block}
.journal{display:flex;flex-direction:column;overflow:hidden;padding-bottom:24px}
.journal>:not(.wisdom-card){flex-shrink:0}
.journal .wisdom-card{flex:1;min-height:100px;overflow:auto;scrollbar-width:thin}
.journal .next-objective{margin:14px 0 12px}
.journal .save-status{margin:10px 0 0}
@keyframes breath{50%{opacity:.7;transform:scale(.95)}}@keyframes flash{0%{opacity:0}20%{opacity:.65}100%{opacity:0}}
@media(min-width:1550px){.journal{width:360px;padding:36px 30px 150px}.stage{right:360px}.controls{right:386px}.welcome h1{font-size:124px}.welcome-story{font-size:15px}}
@media(max-height:700px) and (min-width:781px){.welcome{padding-top:0}.welcome .eyebrow{margin-bottom:7px}.sigil{font-size:38px}.welcome h1{font-size:67px;margin-top:9px}.welcome-subtitle{font-size:23px;margin-bottom:12px}.welcome-story{font-size:11px;max-width:540px;margin-bottom:17px}.welcome-meta{margin-top:17px}.journal{padding-top:17px}.journal h2{font-size:26px;margin:14px 0}.objective{font-size:11px;margin-bottom:16px}.progress-label{margin-bottom:15px}.wisdom-card{padding:16px 0}.wisdom-card h3{font-size:21px}.next-objective{margin:13px 0}.scene-caption strong{font-size:21px}}
@media(max-width:780px){.game-header{height:56px;padding:0 15px;gap:7px}.brand{font-size:21px}.back{font-size:11px}.game-header nav{gap:0}.game-header button{padding:8px;font-size:16px}.game-header button span{display:none}.game-header #fullscreen{display:none}.experience{height:calc(100dvh - 56px);min-height:450px}.stage{inset:0 0 164px}.welcome{padding:24px 24px 38px}.welcome h1{font-size:clamp(50px,11vw,83px)}.welcome-story{max-width:480px;font-size:12px;line-height:1.65}.welcome-meta{font-size:8px;line-height:1.8}.welcome-meta i{margin:0 5px}.journal{top:auto;bottom:0;width:100%;height:164px;padding:15px 20px;background:linear-gradient(180deg,#061920d9,var(--panel));border-left:0;border-top:1px solid #a3d9d226;overflow:auto;display:grid;grid-template-columns:1fr auto;gap:4px 15px}.chapter-label{grid-column:1/3}.chapter-label button{padding:0 4px}.journal h2{font-size:22px;margin:2px 0;grid-column:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.objective{font-size:10px;line-height:1.45;margin:0;grid-column:1;max-width:85%}.progress-track{display:none}.progress-label{margin:0;font-size:9px;grid-column:1}.wisdom-card,.next-objective,.save-status{display:none}.journal #hint{grid-area:2/2;padding:9px 12px;font-size:10px;width:auto;height:min-content}.journal #library{grid-area:3/2;font-size:9px;text-align:center;max-width:100px}.controls{left:17px;right:17px;bottom:184px}.dpad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:3px}.controls .key-note{display:none}.controls .control-label{font-size:7px}.action-buttons{width:147px}.action{min-height:48px;font-size:18px}.action span{font-size:10px}.small-actions{margin-top:8px;gap:4px}.small-actions button{font-size:8px;padding:8px 4px}.scene-caption{top:18px;left:18px}.scene-caption strong{font-size:19px}.scene-caption span{font-size:7px}.toast{bottom:150px;font-size:10px;padding:10px 16px}.level-grid{grid-template-columns:repeat(5,1fr)}dialog{padding:30px 24px}dialog h2{font-size:33px}dialog p,dialog li{font-size:12px}.intro .stage{inset:0}.sigil{font-size:46px}.welcome .eyebrow{font-size:8px;letter-spacing:.2em}}
@media(max-height:650px) and (max-width:780px){.welcome h1{font-size:48px}.sigil{display:none}.welcome-story{font-size:10px;margin-bottom:16px}.welcome-subtitle{font-size:21px;margin-bottom:12px}.welcome-meta{margin-top:16px}.welcome-hint{font-size:8px}.experience{min-height:390px}.scene-caption{top:10px}.stage{bottom:107px}.journal{height:107px;padding:11px 15px}.journal .objective{font-size:9px}.journal h2{font-size:20px}.controls{bottom:121px}.dpad{grid-template-rows:repeat(3,27px);grid-template-columns:repeat(3,31px)}.control-label{margin-bottom:5px}}
@media(max-height:470px) and (min-width:560px){.game-header{height:44px}.experience{height:calc(100dvh - 44px);min-height:0}.journal{top:0;bottom:0;right:0;width:230px;height:auto;display:block;padding:18px}.stage{right:230px;bottom:0}.controls{right:246px;bottom:15px}.journal h2{font-size:23px}.journal .objective{max-width:100%;font-size:10px;margin:12px 0}.progress-label{margin:13px 0}.scene-caption{display:none}.controls .movement{transform:scale(.8);transform-origin:bottom left}.action-buttons{width:125px}.journal #library{max-width:none}.welcome-story{max-width:500px}.welcome .eyebrow,.welcome-hint,.welcome-meta{display:none}.welcome h1{font-size:44px;margin-top:0}.welcome{padding:5px 25px}.welcome-subtitle{font-size:20px;margin-bottom:6px}.welcome-story{margin-bottom:10px;font-size:10px}.primary{padding:12px 21px}.intro .stage{inset:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.sigil{transform:none!important}#motion-flash{display:none}}
