/* TIFE Core — Twenty Thousand Leagues Under the Sea
   Terminal styling, deep-water palette. */
:root{--primary:#3fd2f2;--bright:#c2f4ff;--dim:#4f92a8;--line:#0a4d66;--bg:#00060b;--panel:#02121a;--panel2:#041b26;--warn:#ffd98a;--danger:#ff9a9a;--font:Consolas,"Courier New",monospace;--scale:1;--glow:1}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:#00060b;color:var(--primary);font-family:var(--font);font-size:calc(14px * var(--scale))}button,input{font:inherit}
.shell{height:100vh;min-width:1120px;display:grid;grid-template-rows:62px 1fr 48px;background:radial-gradient(circle at 50% 20%,#062a3b 0,#02121b 45%,#00060b 100%)}

.topbar{display:grid;grid-template-columns:auto auto minmax(260px,1fr) repeat(3,88px) auto auto;gap:12px;align-items:center;padding:7px 13px;border:1px solid var(--line);background:#010f16}
.logo{font-size:30px;font-weight:900;letter-spacing:.12em;color:var(--bright);text-shadow:0 0 calc(10px * var(--glow)) var(--primary)}
.product{font-size:10px;white-space:nowrap}.product span{display:block;color:var(--dim)}
.game-title{text-align:center;border-left:1px solid var(--line);border-right:1px solid var(--line);padding:0 14px}
.game-title strong{display:block;letter-spacing:.2em}.game-title small{color:var(--dim)}
.metric{text-align:center}.metric small{display:block;color:var(--dim)}
.topbar button,.footerbar button,.command-entry button,.button-row button,dialog button{color:var(--primary);background:#04202c;border:1px solid var(--line);padding:8px 11px;cursor:pointer}
.topbar button:hover,.footerbar button:hover,.button-row button:hover{background:#0a4459;color:var(--bright)}

.workspace{min-height:0;display:grid;grid-template-columns:250px minmax(580px,1fr) 450px;gap:9px;padding:9px;border-left:1px solid var(--line);border-right:1px solid var(--line)}
.stack{min-height:0;display:flex;flex-direction:column;gap:8px;overflow:hidden}
.panel{min-height:80px;flex:1;border:1px solid var(--line);background:linear-gradient(180deg,rgba(4,27,38,.96),rgba(0,10,16,.96));padding:9px;overflow:auto;box-shadow:inset 0 0 22px rgba(63,210,242,.03)}
.panel[data-panel="map"]{flex:1.35}
.panel h2{font-size:13px;margin:0 0 7px;padding-bottom:6px;border-bottom:1px solid #0d5f7d;letter-spacing:.05em}
.panel p{color:#9fd2e4;font-size:11px;line-height:1.35;margin:5px 0}
.panel .row{padding:5px 0;border-bottom:1px solid #0a4054;font-size:11px}
.panel button.link{border:0;background:none;color:var(--bright);padding:0;cursor:pointer;text-align:left}
.complete{color:var(--bright)}.locked{color:#6c8b98}
.progress{height:5px;background:#0a2531;margin:5px 0}.progress i{display:block;height:100%;background:var(--primary)}

.center{min-height:0;display:grid;grid-template-rows:minmax(290px,1fr) 50px 260px;border:1px solid var(--line);background:#00060b}
.terminal{padding:22px;overflow:auto;white-space:pre-wrap;line-height:1.5;text-shadow:0 0 calc(6px * var(--glow)) rgba(63,210,242,.42);background:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) 1px,transparent 1px,transparent 4px),#00060b}
.output{margin:0 0 14px}.output.title{font-weight:bold;color:var(--bright)}.output.command{color:#d2f7ff}.output.system{color:#5fb9d4}.output.warning{color:var(--warn)}.output.error{color:var(--danger)}

.command-entry{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:7px 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#03151d}
.command-entry span{font-size:22px}
.command-entry input{width:100%;color:var(--primary);background:#000a10;border:1px solid #0d6482;padding:8px;outline:none}
.palette{padding:9px 13px;overflow:auto;background:linear-gradient(180deg,#02121a,#00060b)}
.palette-label{font-size:9px;letter-spacing:.12em;color:var(--dim);margin:3px 0}
.button-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:7px}
.button-row button{min-width:86px;padding:7px 9px}
.button-row button.selected{background:#0d5670;color:var(--bright)}
.context{min-height:32px}.context .hint{font-size:11px;color:var(--dim);align-self:center}

.map{margin:0;height:calc(100% - 26px);display:grid;place-items:center;text-align:left;white-space:pre;font-size:11px;line-height:1.35;color:#8fdcf0}
.footerbar{display:flex;justify-content:center;align-items:center;gap:15px;border:1px solid var(--line);background:#010f16}
.footerbar button{min-width:150px;color:#9fd2e4}

dialog{width:min(850px,94vw);max-height:84vh;color:var(--primary);background:#00090f;border:1px solid var(--primary);padding:0}
dialog header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line)}
dialog h2{font-size:16px;margin:0}
#dialog-body{padding:16px;max-height:68vh;overflow:auto;white-space:pre-wrap}
.save-row{padding:9px 0;border-bottom:1px solid var(--line)}

body.reduced-motion *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
body.high-contrast{--primary:#fff;--bright:#fff;--dim:#ddd;--line:#fff;--panel:#000;--panel2:#000;--glow:0}
@media(max-width:1280px){.workspace{grid-template-columns:220px minmax(520px,1fr) 390px}.footerbar{gap:5px}.footerbar button{min-width:125px}}

.caption-region{position:fixed;left:50%;bottom:64px;transform:translateX(-50%);z-index:20;max-width:70vw;padding:12px 18px;background:#000;border:2px solid var(--bright);color:var(--bright);font-weight:bold;text-align:center}
.accessibility-grid{display:grid;gap:12px}
.accessibility-grid label{display:grid;gap:6px}
.accessibility-grid select,.accessibility-grid input[type="range"]{width:100%;padding:8px;background:#04202c;color:var(--primary);border:1px solid var(--line)}
.accessibility-grid .check{display:block}.access-note{color:var(--dim)}
body.large-controls button,body.large-controls input,body.large-controls select{min-height:44px;padding:11px 14px}
body.simplified-ui .left .panel[data-panel="stats"],body.simplified-ui .left .panel[data-panel="achievements"],body.simplified-ui .right .panel[data-panel="conversation"]{display:none}
body.simplified-ui .workspace{grid-template-columns:220px minmax(600px,1fr) 320px}
body.screen-reader-mode .terminal{text-shadow:none;background:#00060b}

/* ---------- cover screen ---------- */
.story-cover{position:fixed;inset:0;z-index:1000;display:grid;grid-template-columns:minmax(380px,1.25fr) minmax(360px,.75fr);background:#00090f;color:var(--primary);transition:opacity .4s ease,transform .4s ease}
.story-cover.closing{opacity:0;transform:scale(1.015);pointer-events:none}
.cover-art{position:relative;overflow:hidden;background:linear-gradient(180deg,#0d5f80 0%,#06384f 26%,#02202e 58%,#00090f 100%);border-right:1px solid var(--line)}
.cover-art:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.02) 0,rgba(255,255,255,.02) 1px,transparent 1px,transparent 4px)}
.cover-surface{position:absolute;left:0;right:0;top:0;height:16%;background:linear-gradient(180deg,rgba(190,246,255,.55),rgba(13,95,128,0));filter:blur(1px)}
.cover-shaft{position:absolute;top:-6%;width:16%;height:92%;background:linear-gradient(180deg,rgba(190,246,255,.30),rgba(190,246,255,0) 78%);transform-origin:top center;filter:blur(3px)}
.shaft-one{left:14%;transform:rotate(9deg)}
.shaft-two{left:44%;transform:rotate(-6deg);opacity:.75}
.shaft-three{left:72%;transform:rotate(13deg);opacity:.55}
.cover-nautilus{position:absolute;left:16%;top:44%;width:66%;height:15%;border-radius:50% 46% 50% 46%;background:linear-gradient(180deg,#0b3a4e,#01141d 70%);box-shadow:0 0 60px rgba(63,210,242,.22),inset 0 -6px 18px rgba(0,0,0,.6)}
.cover-nautilus:before{content:"";position:absolute;left:12%;top:34%;width:60%;height:16%;background:linear-gradient(90deg,rgba(194,244,255,.85),rgba(194,244,255,.05));border-radius:6px;box-shadow:0 0 22px rgba(194,244,255,.55)}
.cover-nautilus:after{content:"";position:absolute;right:-9%;top:22%;width:22%;height:56%;background:#02202c;clip-path:polygon(0 0,100% 28%,100% 72%,0 100%)}
.cover-beam{position:absolute;left:74%;top:47%;width:34%;height:9%;background:linear-gradient(90deg,rgba(194,244,255,.55),rgba(194,244,255,0));filter:blur(4px)}
.cover-bed{position:absolute;left:-10%;width:120%;height:34%;bottom:0;background:#01151d;clip-path:polygon(0 68%,9% 52%,19% 63%,31% 38%,44% 60%,57% 34%,69% 58%,81% 30%,92% 56%,100% 44%,100% 100%,0 100%)}
.cover-bed:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(63,210,242,.10),transparent 40%)}

.cover-content{display:flex;flex-direction:column;justify-content:center;padding:clamp(30px,5vw,80px);background:linear-gradient(135deg,rgba(4,32,44,.98),#00090f)}
.cover-kicker{letter-spacing:.26em;color:var(--dim);font-size:.8rem;margin-bottom:20px}
.cover-content h1{margin:0 0 22px;font-size:clamp(2.1rem,4.2vw,4.6rem);line-height:.92;letter-spacing:.06em;color:var(--bright);text-shadow:0 0 24px rgba(63,210,242,.28)}
.cover-content p{max-width:620px;line-height:1.7;color:#a9dcec}
.cover-credit{font-size:.8rem;color:var(--dim)!important;border-top:1px solid var(--line);padding-top:16px}
.cover-option{display:block;margin:8px 0;color:var(--bright)}
.start-story{margin-top:22px;max-width:340px;padding:16px 24px;background:#08475c;border:1px solid var(--bright);color:var(--bright);font-weight:900;letter-spacing:.12em;cursor:pointer;box-shadow:0 0 18px rgba(63,210,242,.14)}
.start-story:hover,.start-story:focus{background:#0c6483;outline:2px solid var(--bright)}
.cover-content small{margin-top:12px;color:var(--dim)}
@media(max-width:850px){.story-cover{grid-template-columns:1fr}.cover-art{min-height:34vh;border-right:0;border-bottom:1px solid var(--line)}.cover-content{padding:28px}.cover-content h1{font-size:2.4rem}}
