@font-face{font-family:Cormorant Garamond;src:url(/tower-of-hanoi/fonts/CormorantGaramond-Bold.woff2) format("woff2");font-weight:700;font-display:swap}@font-face{font-family:Figtree;src:url(/tower-of-hanoi/fonts/Figtree.woff2) format("woff2");font-weight:300 900;font-display:swap}:root{--ground: #0e0b12;--velvet: radial-gradient(120% 70% at 50% 28%, #2c2433 0%, #17121c 55%, #0e0b12 100%);--velvet-hi: #2c2433;--ink: #f3e7c9;--muted: #c4b493;--gold: #e9c46a;--gold-deep: #b88624;--walnut: linear-gradient(180deg, #5b3a22, #3a2414);--yellow-mid: #d39a32;--rose-mid: #b8723f;--yellow: linear-gradient(180deg, #fff1c2 0%, #f1c862 18%, var(--yellow-mid) 50%, #a76d17 82%, #7c4f0f 100%);--rose: linear-gradient(180deg, #ffd8b4 0%, #e59f66 18%, var(--rose-mid) 50%, #8c4822 82%, #5c2b10 100%);--yellow-num: #3f2604;--rose-num: #1f0d02;--tag: #f4ecd8;--tag-ink: #2a2118;--tag-edge: #8b6b2e;--f-voice: "Cormorant Garamond", Georgia, serif;--f-ui: "Figtree", system-ui, sans-serif;color-scheme:dark}*{box-sizing:border-box}html{background:var(--ground)}body{margin:0;min-height:100%;background:var(--velvet);background-attachment:fixed;color:var(--ink);font:16px/1.4 var(--f-ui);-webkit-tap-highlight-color:transparent}#root{min-height:100%}button{font:inherit;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.room{min-height:100dvh;display:flex;flex-direction:column;max-width:560px;margin:0 auto;position:relative}.room.game:not(.solved){height:100dvh}hub-bar{display:block}.play{flex:1;min-height:0;display:flex;flex-direction:column;padding-bottom:14px}.gamehead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px;padding:14px 16px 6px}.gamehead h1{margin:0;font:700 30px/1 var(--f-voice);font-variant-numeric:lining-nums;white-space:nowrap}.count{margin:0;font:600 15px/1 var(--f-ui);color:var(--muted)}.count b{color:var(--ink);font-weight:800}.stage{flex:1;min-height:0;display:flex;flex-direction:column}.board{flex:1;min-height:190px;container-type:size;padding:0 16px}.solved .board{flex:none;height:min(44vh,340px)}.tray{--chrome: 44px;--lift: 1.5;--tw: min(100cqw, 640px);--dh: min(46px, calc(var(--tw) / 3 * .3), calc((100cqh - var(--chrome)) / (var(--n) + var(--lift))));--wmax: calc(var(--tw) / 3 - 8px);--wmin: max(30px, calc(var(--wmax) * .3));width:var(--tw);height:100cqh;margin:0 auto;display:grid;grid-template-rows:1fr 14px auto}.pegs{display:grid;grid-template-columns:repeat(3,1fr);min-height:0;background:radial-gradient(60% 50% at 50% 100%,rgba(255,214,140,.16),transparent 70%)}.peg{all:unset;position:relative;display:flex;flex-direction:column-reverse;align-items:center;cursor:pointer;padding-top:calc(var(--dh) + 12px)}.peg:disabled{cursor:default}.peg:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;border-radius:6px}.needle{position:absolute;bottom:0;left:50%;width:9px;height:calc(100% - var(--dh) - 8px);transform:translate(-50%);border-radius:5px 5px 0 0;background:linear-gradient(90deg,#ffffff14,#dcebffa6 35%,#fffffff2 48%,#aabedc59 60%,#ffffff1f);box-shadow:0 0 10px #c8e1ff59;overflow:visible}.needle:after{content:"";position:absolute;top:-5px;left:50%;width:14px;height:14px;transform:translate(-50%) rotate(45deg);background:radial-gradient(circle,#fff 0 20%,rgba(200,230,255,.6) 40%,transparent 70%)}.peg.takes .needle{box-shadow:0 0 18px #ffe196bf}.peg.no .needle{opacity:.35}.disc{position:relative;z-index:2;flex:none;height:var(--dh);margin-top:-1px;border-radius:calc(var(--dh) * .26);width:calc(var(--wmin) + (var(--wmax) - var(--wmin)) * var(--d) / (var(--n) - 1));display:grid;place-items:center;box-shadow:inset 0 1px #ffffffb3,inset 0 -2px 3px #3c1e0073,0 3px 6px #00000073}.disc.yellow{background:var(--yellow)}.disc.rose{background:var(--rose)}.disc .num{font:700 clamp(11px,calc(var(--dh) * .66),24px)/1 var(--f-voice);font-variant-numeric:lining-nums;text-shadow:0 1px 0 rgba(255,236,180,.6)}.disc.yellow .num{color:var(--yellow-num)}.disc.rose .num{color:var(--rose-num)}.up{position:absolute;top:2px;left:0;right:0;display:flex;justify-content:center}.up .disc{box-shadow:inset 0 1px #fffc,inset 0 -2px 3px #3c1e0066,0 0 16px #ffd26e8c}.lit .disc{box-shadow:inset 0 1px #fffc,inset 0 -2px 3px #3c1e0066,0 0 18px #ffd26e80}.rail{position:relative;z-index:3;border-radius:4px;background:var(--walnut);box-shadow:inset 0 1px #ffdcaa40,0 6px 14px #00000080}.pegnums{list-style:none;margin:0;padding:6px 0 0;display:grid;grid-template-columns:repeat(3,1fr);text-align:center;font:700 22px/1 var(--f-voice);font-variant-numeric:lining-nums;color:#d8bf86}.side{flex:none;padding:0 16px;display:flex;flex-direction:column;gap:12px}.owlpanel{margin-top:12px;display:flex;gap:12px;align-items:flex-start;min-height:82px;padding:12px 16px 12px 12px;background:var(--tag);color:var(--tag-ink);border-radius:4px 22px 22px 4px;box-shadow:0 0 0 1px #c8b48a,0 10px 30px #00000073}.owlpanel.quiet{background:#f4ecd81a;box-shadow:inset 0 0 0 1px #c8b48a59}.owlpanel p{margin:0;font:500 16px/1.4 var(--f-ui)}.owl{flex:none;width:52px;height:52px}.owl .tag{fill:#efe2c2;stroke:var(--tag-edge);stroke-width:1.5}.owl .eyelet{fill:none;stroke:var(--tag-edge);stroke-width:1.4}.owl .engraving{fill:none;stroke:#3a2a14;stroke-width:1.6}.owlpanel.quiet .owl{opacity:.55}.keys{display:none;margin:0;color:var(--muted);font-size:14px}@media(max-height:640px){.gamehead{padding:10px 16px 4px}.gamehead h1{font-size:26px}.owlpanel{margin-top:8px;min-height:0;gap:10px;padding:8px 12px 8px 8px}.owlpanel p{font-size:14px;line-height:1.32}.owl{width:38px;height:38px}}.stave{margin:12px 0 0}.stave svg{width:100%;height:auto;display:block}.stave .staff{stroke:var(--gold);stroke-opacity:.45;stroke-width:.6}.stave .pitch{fill:var(--muted);font:700 9px var(--f-ui)}.stave .note{fill:var(--gold)}.stave .note.small{fill:#fff1c2}.stave .ring{fill:none;stroke:#f0a58f;stroke-width:1}.livestave{display:none}.endbtns{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:10px}.endcard hub-end-card{display:block}.bigbtn,.ghostbtn{all:unset;box-sizing:border-box;cursor:pointer;height:50px;display:grid;place-items:center;border-radius:3px;font:700 16px/1 var(--f-ui);text-align:center;padding:0 12px}.bigbtn{background:linear-gradient(180deg,#f2cf74,#c8922f);color:#2a1c08}.ghostbtn{background:#fff0d20f;box-shadow:inset 0 0 0 1px #e8c88280}.bigbtn:focus-visible,.ghostbtn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.homebody{padding:22px 16px 26px;display:flex;flex-direction:column;gap:14px}.titlerow{display:flex;justify-content:space-between;align-items:center;gap:12px}.title{font:700 50px/.9 var(--f-voice);font-variant-numeric:lining-nums;margin:0}.mark{flex:none;width:150px;height:86px;container-type:size}.tray.mini{--chrome: 8px;--lift: .6;grid-template-rows:1fr 7px}.tray.mini .peg{padding-top:calc(var(--dh) * .6);cursor:default}.tray.mini .needle{width:4px;height:calc(100% - 4px)}.tray.mini .needle:after{width:7px;height:7px;top:-3px}.tray.mini .disc .num{display:none}.tray.mini .disc{--wmin: 14px;border-radius:3px}.cont{all:unset;box-sizing:border-box;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;background:linear-gradient(180deg,#f2cf74,#c8922f);color:#2a1c08;border-radius:3px}.conttext{display:grid;gap:5px}.cont b{font:700 24px/1 var(--f-voice);font-variant-numeric:lining-nums}.conttext span{font-size:14px;font-weight:600}.chev{width:10px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.cont:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.lbl{margin:8px 0 0;font:700 13px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.ladder{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.ladder button{all:unset;box-sizing:border-box;cursor:pointer;height:70px;display:grid;justify-items:center;align-content:center;gap:6px;border-radius:3px;background:#fff0d20d;box-shadow:inset 0 0 0 1px #e8c88259;font:700 24px/1 var(--f-voice);font-variant-numeric:lining-nums}.ladder button[aria-checked=true]{background:#e9c46a1f;box-shadow:inset 0 0 0 2px var(--gold)}.ladder button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.rung rect{fill:none;stroke:#c4b49399;stroke-width:1.2}.rung.solved rect{fill:#e0b44f;stroke:var(--gold-deep)}.rung .spark{fill:#f6dc8e}.line{margin:0;font:500 16px/1.4 var(--f-ui)}.room.home.first{height:100dvh}.first .homebody{flex:1;min-height:0}.first .title{font-size:40px}.startboard{flex:1;min-height:190px;container-type:size}.dim{position:fixed;inset:0;background:#07050acc;z-index:60}.sheet{position:fixed;left:50%;transform:translate(-50%);width:min(560px,100%);bottom:0;z-index:61;background:#1d1723;color:var(--ink);padding:22px 22px calc(26px + env(safe-area-inset-bottom,0px));display:grid;gap:12px;border-top:1px solid var(--tag-edge);box-shadow:0 -12px 30px #00000080}.sheet h2{margin:0;font:700 30px var(--f-voice);font-variant-numeric:lining-nums}.sheet .row{all:unset;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid rgba(233,196,106,.2)}.sheet .row em{font-style:normal;font-weight:700;color:var(--gold)}.sheet .row:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.sheet .links{display:flex;gap:18px;font-size:14px;padding-top:14px;border-top:1px solid rgba(233,196,106,.2)}.sheet .lbl{margin:2px 0 -2px}.sheet .links a{color:inherit}.sheet .done{justify-content:center;font-weight:700}.seg{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.seg button{all:unset;cursor:pointer;text-align:center;padding:10px 0;font:700 20px/1 var(--f-voice);font-variant-numeric:lining-nums;border-radius:3px;box-shadow:inset 0 0 0 1px #e8c88259}.seg button.on{background:#e9c46a1f;box-shadow:inset 0 0 0 2px var(--gold)}.seg button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}@media(min-width:960px){.room{max-width:1120px}.room.game:not(.solved){height:auto}.stage{flex-direction:row;align-items:flex-start;justify-content:center;gap:40px;padding:10px 24px 0}.board{flex:0 0 600px;height:max(300px,min(480px,calc(100dvh - 260px)));padding:0}.solved .board{flex:0 0 600px;height:max(300px,min(480px,calc(100dvh - 260px)))}.side{width:360px;padding:0}.owlpanel{margin-top:0}.livestave,.keys{display:block}}.lit .peg:nth-child(3) .needle:before{content:"";position:absolute;left:-3px;right:-3px;top:0;height:28%;border-radius:6px;background:linear-gradient(180deg,transparent,rgba(255,244,210,.95) 50%,transparent);filter:blur(1px)}@media(prefers-reduced-motion:no-preference){.lit .peg:nth-child(3) .needle:before{animation:run 1.8s ease-in-out .2s 3 both}}@keyframes run{0%{top:-10%;opacity:0}20%{opacity:1}to{top:82%;opacity:0}}.below{max-width:560px;margin:0 auto;padding:34px 22px calc(110px + env(safe-area-inset-bottom));color:var(--ink);font:16px/1.5 var(--f-ui)}.below h2{margin:0 0 12px;font:600 26px/1.15 var(--f-voice);font-variant-numeric:lining-nums;color:var(--gold);letter-spacing:.01em}.below section+section{margin-top:30px;padding-top:26px;border-top:1px solid rgba(233,196,106,.28)}.below ol{margin:0;padding:0 0 0 22px}.below li{margin:0 0 8px;padding-left:4px}.below h3{margin:16px 0 4px;font:600 19px/1.2 var(--f-voice);font-variant-numeric:lining-nums;color:var(--ink)}.below p{margin:0;color:#f3e7c9db}.below .more{margin-top:24px;display:flex;flex-wrap:wrap;gap:10px 22px}.below .more a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;font-weight:600}@media(min-width:900px){.below{max-width:880px;display:grid;grid-template-columns:1fr 1.3fr;gap:0 48px}.below section+section{margin:0;padding:0;border:0}.below .more{grid-column:1 / -1}}