:root{color-scheme:dark;--ink:#130e23;--panel:#1d1735;--gold:#d8b56b;--pale:#f9edce;--lavender:#bcb0db;--line:#6c567e;--chapter:#9a74cb;font-family:Georgia,'Times New Roman',serif}*{box-sizing:border-box}body{margin:0;min-height:100svh;color:var(--pale);background:#0e0b19 url(ForestBackdrop.png) center/cover fixed;overflow-x:hidden}body:before{content:'';position:fixed;inset:0;background:linear-gradient(180deg,#100b2540,#0a08194d 40%,#090616b3);pointer-events:none}button{font:inherit;cursor:pointer;color:var(--pale);touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #fff1bd;outline-offset:4px}button:disabled{cursor:default;opacity:.46}button,.pill{border:1px solid #b49352;border-radius:12px;background:linear-gradient(180deg,#312344e6,#171023f5);box-shadow:inset 0 0 0 3px #1a1029,inset 0 0 0 4px #b28f4133,0 6px 20px #03000a60}.button{min-height:48px;padding:13px 20px;font-size:17px;letter-spacing:.02em;transition:transform .15s,filter .15s}.button:hover:not(:disabled){filter:brightness(1.18);transform:translateY(-1px)}.primary{background:linear-gradient(180deg,#684483,#3a2653);border-color:#e1bc71;color:#fff0ca}.quiet{border-color:#80673f;background:#150f24c9}.eyebrow{font:600 11px/1.5 system-ui,sans-serif;letter-spacing:.23em;text-transform:uppercase;color:var(--gold)}h1,h2,p{margin:0}h1{font-size:clamp(40px,8vw,72px);font-weight:normal;line-height:1.08;text-shadow:0 3px 20px #080211}h2{font-size:clamp(25px,5vw,40px);font-weight:normal}#app{position:relative;min-height:100svh;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:center}.home,.settings,.win{width:min(100%,520px);text-align:center;padding:24px 8px}.home .eyebrow{margin-bottom:16px}.home h1 span{display:block;color:#dcc6ef}.ornament{color:var(--gold);letter-spacing:.35em;font-size:18px;margin:20px 0}.portrait{width:110px;height:110px;object-fit:cover;border-radius:50%;border:2px solid var(--gold);box-shadow:0 0 0 6px #201233ba,0 0 35px #b187dc40;margin:24px 0 18px}.sub{font-size:16px;line-height:1.6;color:#d6cbe5}.stack{display:grid;gap:12px;width:min(100%,340px);margin:24px auto}.foot{font:12px/1.7 system-ui,sans-serif;color:#cbb889;letter-spacing:.06em}.homefooter{display:flex;justify-content:center;gap:15px;margin-top:12px}.homefooter button{border:0;background:none;box-shadow:none;padding:10px;font:13px system-ui,sans-serif;color:var(--lavender)}.map{width:min(100%,740px);text-align:center}.map .eyebrow{margin:10px 0}.map h2{margin-bottom:10px}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:22px 0}.level-button{min-height:70px;padding:11px 3px;font-size:22px;position:relative}.level-button .stars{display:block;font-size:12px;letter-spacing:2px;color:var(--gold);margin-top:5px}.level-button .locked{font:10px system-ui,sans-serif;display:block;margin-top:6px;color:#bcb0cc}.level-button.current{border-color:#f2d190;box-shadow:0 0 20px #d8b56b38,inset 0 0 0 3px #1a1029}.chapterlabels{display:flex;gap:10px;justify-content:center;font:11px/1.6 system-ui,sans-serif;color:var(--lavender)}.game{width:min(100%,560px);display:grid;gap:14px}.topbar{display:flex;justify-content:space-between;align-items:center}.topbar button{border:0;background:#17102290;box-shadow:none;font:12px system-ui,sans-serif;min-height:40px;padding:8px 12px}.brand{font:10px system-ui,sans-serif;color:var(--gold);letter-spacing:.12em}.game-heading{text-align:center}.game-heading h2{font-size:clamp(26px,5vw,34px);margin:5px 0}.stats{display:flex;gap:10px;justify-content:center;margin-top:14px}.pill{font:12px system-ui,sans-serif;padding:9px 13px;border-radius:25px;background:#130e22d9;border-color:#78623d;color:#e2d7ec;box-shadow:none}.sequence{text-align:center;font:12px/1.5 system-ui,sans-serif;letter-spacing:.045em;color:#cbbbdd}.sequence b{color:#f6d88b}.board-wrap{position:relative;padding:9px;border:1px solid #c19d58;border-radius:18px;background:linear-gradient(135deg,#42304cd9,#131020e6);box-shadow:0 12px 50px #02000890,inset 0 0 0 3px #150e26,inset 0 0 0 4px #aa87534d}.board-wrap:before,.board-wrap:after{content:'✦';position:absolute;color:var(--gold);font-size:17px;background:#231631;padding:0 7px;left:50%;transform:translateX(-50%);line-height:16px}.board-wrap:before{top:-8px}.board-wrap:after{bottom:-8px}.board{display:grid;gap:5px;aspect-ratio:1}.tile{position:relative;width:100%;aspect-ratio:1;padding:0;min-height:0;border:1px solid #786039;border-radius:9px;background:linear-gradient(145deg,#31243f,#191429);box-shadow:inset 0 0 0 2px #120d22,0 2px 3px #07051180;opacity:1!important}.tile.fixed{background:linear-gradient(145deg,#292632,#151522);border-color:#5a5260;cursor:default}.tile svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none}.tile .pipe{stroke:#7f7195;stroke-width:7;stroke-linecap:round;fill:none;transition:stroke .2s}.tile.lit .pipe{stroke:#ffd68a;filter:drop-shadow(0 0 3px #ffa632)}.tile.hint{border-color:#fff5ae;box-shadow:0 0 0 2px #ffee9b,0 0 25px #ffdc7870}.badge{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}.badge span{display:grid;place-items:center;min-width:25px;height:25px;border-radius:50%;background:#2c193c;border:1px solid #907549;color:#ead3a3;font:bold 14px system-ui,sans-serif;box-shadow:0 2px 5px #0008}.tile.lit .badge span{background:#654025;color:#fff0ae;border-color:#edc779}.badge.endpoint span{font-size:9px;min-width:29px;border-radius:6px}.fixed-dot{position:absolute;right:9%;bottom:9%;width:4px;height:4px;background:#bdac84;border-radius:50%;pointer-events:none}.journey-light{position:absolute;z-index:3;width:38px;height:38px;object-fit:cover;border:2px solid #ffd980;border-radius:50%;box-shadow:0 0 24px #f9d475;pointer-events:none;transform:translate(-50%,-50%);transition:left .1s linear,top .1s linear}.game-footer{display:grid;gap:12px}.status{min-height:39px;text-align:center;font:13px/1.55 system-ui,sans-serif;color:#d7cde4;max-width:95%;margin:auto}.actions{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.actions .button{font-size:14px;padding:12px 5px}.guide{width:100%;font-size:20px}.help{font:11px/1.6 system-ui,sans-serif;text-align:center;color:#ac9cbd}.settings h2{margin-bottom:14px}.settings .stack{width:min(100%,380px)}.settings .sub{font:13px/1.8 system-ui,sans-serif}.win .stars{font-size:55px;color:#efd08a;letter-spacing:8px;margin:22px 0}.win h1{font-size:48px;margin:16px 0}.win .reward{color:var(--gold);margin-top:15px}.fireflies{position:fixed;inset:0;pointer-events:none;overflow:hidden}.fireflies i{position:absolute;left:12%;top:20%;width:3px;height:3px;border-radius:50%;background:#f4da91;box-shadow:0 0 10px #ffc650;animation:drift 10s ease-in-out infinite}.fireflies i:nth-child(2){left:83%;top:37%;animation-delay:-2s}.fireflies i:nth-child(3){left:21%;top:76%;animation-delay:-4s}.fireflies i:nth-child(4){left:91%;top:81%;animation-delay:-6s}.fireflies i:nth-child(5){left:64%;top:12%;animation-delay:-8s}.fireflies i:nth-child(6){left:44%;top:87%;animation-delay:-5s}@keyframes drift{0%,100%{transform:translate(0,0);opacity:.15}50%{transform:translate(20px,-30px);opacity:1}}body.reduced-motion *{animation:none!important;transition:none!important}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(min-width:760px) and (orientation:portrait){.game{width:min(100%,680px);gap:22px}.game-heading h2{font-size:40px}.stats .pill,.sequence{font-size:15px}.tile .badge span{width:36px;height:36px;font-size:20px}.badge.endpoint span{font-size:12px!important}.status{font-size:16px}.button{font-size:19px;min-height:58px}.actions .button{font-size:17px}}@media(orientation:landscape) and (min-width:640px){#app{padding:14px max(20px,env(safe-area-inset-right)) 14px max(20px,env(safe-area-inset-left))}.game{width:min(100%,1100px);grid-template-columns:minmax(220px,1fr) minmax(260px,1.5fr);grid-template-rows:auto 1fr;column-gap:30px;gap:10px 30px}.topbar{grid-column:1;grid-row:1}.game-heading{grid-column:1;grid-row:2;align-self:start;padding-top:15px}.game-heading h2{font-size:28px}.sequence{grid-column:1;grid-row:2;margin-top:130px;align-self:start}.board-wrap{grid-column:2;grid-row:1 / 4;width:min(100%,calc(100svh - 46px));justify-self:center;align-self:center}.game-footer{grid-column:1;grid-row:2;align-self:end;padding-top:175px;gap:8px}.status{font-size:12px}.actions .button{padding:8px 3px;min-height:42px}.guide{min-height:44px;padding:8px}.help{display:none}.home{padding:0}.home h1{font-size:44px}.home .eyebrow{margin-bottom:8px}.portrait{width:72px;height:72px;margin:12px 0}.home .stack{gap:8px;margin:15px auto}.home .button{min-height:42px;padding:9px}.home .ornament{display:none}.home .sub{font-size:14px}.homefooter{margin-top:4px}.map{width:min(100%,1050px)}.map h2{font-size:25px}.level-grid{grid-template-columns:repeat(10,1fr);gap:8px;margin:12px 0}.level-button{min-height:58px;font-size:19px;padding:6px}.settings{padding:5px}.settings .stack{gap:8px;margin:14px auto}.settings .button{min-height:43px;padding:9px}.win{padding:5px}.win h1{font-size:34px;margin:8px 0}.win .stars{margin:10px 0;font-size:42px}.win .stack{margin:14px auto;gap:8px}.win .button{min-height:42px;padding:9px}}@media(max-width:360px){#app{padding:12px}.game{gap:10px}.board{gap:3px}.board-wrap{padding:6px}.game-heading h2{font-size:24px}.tile{border-radius:6px}.badge span{min-width:22px;height:22px;font-size:12px}.badge.endpoint span{min-width:23px;font-size:8px}.level-grid{gap:6px}.level-button{min-height:61px}.brand{font-size:8px}}

.pagination{display:flex;justify-content:center;align-items:center;gap:18px;margin:14px 0}.pagination .button{min-width:110px;min-height:44px;padding:10px 15px;font-size:14px}.chapterlabels{flex-wrap:wrap}
@media(max-width:360px){body:has(.board[data-size="7"]) #app{padding-left:4px;padding-right:4px}body:has(.board[data-size="7"]) .board-wrap{padding:4px;border-radius:12px}body:has(.board[data-size="7"]) .board{gap:2px}body:has(.board[data-size="7"]) .tile{border-radius:5px}body:has(.board[data-size="7"]) .badge span{min-width:19px;height:19px;font-size:11px}body:has(.board[data-size="7"]) .badge.endpoint span{min-width:22px;font-size:8px}}
@media(orientation:landscape) and (min-width:640px){.pagination{margin:8px 0}.pagination .button{min-height:38px;padding:7px 12px}.map .stack{margin:12px auto}.game:has(.board[data-size="7"]) .board-wrap{width:min(100%,calc(100svh - 30px))}}

/* Widescreen main-game preview: bounded controls beside a large square board. */
@media(min-width:1100px) and (min-height:650px) and (orientation:landscape){
 .game{width:min(100%,1400px);grid-template-columns:minmax(300px,400px) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;gap:24px 48px;align-items:center}
 .topbar{grid-column:1;grid-row:1}
 .game-heading{grid-column:1;grid-row:2;padding-top:0}
 .game-heading h2{font-size:38px;margin:14px 0}
 .stats{flex-wrap:wrap}.pill{font-size:15px;padding:12px 16px}
 .sequence{grid-column:1;grid-row:3;margin-top:0;font-size:16px;line-height:1.8}
 .board-wrap,.game:has(.board[data-size="7"]) .board-wrap{grid-column:2;grid-row:1 / 5;width:min(100%,calc(100svh - 100px))}
 .game-footer{grid-column:1;grid-row:4;padding-top:0;gap:18px;align-self:center}
 .status{font-size:16px;min-height:70px}
 .actions .button{min-height:54px;font-size:17px}
 .guide{min-height:62px;font-size:24px}
 .help{display:block;font-size:13px}
 .topbar button{font-size:15px;min-height:48px}
 .badge span{min-width:34px;height:34px;font-size:20px}
 .badge.endpoint span{min-width:38px;font-size:11px}
 .home h1{font-size:64px}.home .portrait{width:110px;height:110px;margin:24px 0}
 .home .button,.settings .button,.win .button{min-height:54px;font-size:19px}
 .home .stack,.settings .stack,.win .stack{gap:14px;margin:24px auto}
 .map{width:min(100%,1200px)}.map h2{font-size:38px}
 .level-grid{gap:14px;margin:24px 0}.level-button{min-height:100px;font-size:26px}
 .settings h2{font-size:40px}.win h1{font-size:48px}
}