:root{--gold:#d6b866;--gold-soft:#f0d794;--ink:#080808;--panel:#12110e;--line:#5f502e;--ivory:#f2ead8;--muted:#bdb29a}*{box-sizing:border-box}html{background:var(--ink);color-scheme:dark}body{margin:0;background:radial-gradient(circle at 50% 18%,#21180f,#080808 56%);color:var(--ivory);font-family:Arial,sans-serif}.home-bar{display:block;min-height:48px;padding:14px 18px;border-bottom:1px solid #4b4027;background:#11100d;color:var(--gold-soft);font-size:13px;font-weight:800;letter-spacing:.12em;text-align:center;text-decoration:none;text-transform:uppercase}.game-shell{width:min(100%,540px);min-height:calc(100svh - 48px);margin:auto;padding:10px 12px calc(15px + env(safe-area-inset-bottom))}.scorebar{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:6px;border-block:1px solid #443920}.scorebar.is-timer-hidden{grid-template-columns:repeat(3,1fr)}.scorebar>div{padding:6px 2px;text-align:center;border-right:1px solid #3c321d}.scorebar>div:last-child,.scorebar.is-timer-hidden>div:nth-last-child(2){border-right:0}.scorebar span{display:block;color:#aaa086;font-size:8px;letter-spacing:.12em}.scorebar strong{display:block;margin-top:2px;color:var(--gold-soft);font:normal 18px Georgia,serif}.message{min-height:17px;margin:3px 0 5px;color:#ddd2ba;font-size:12px;line-height:1.35;text-align:center}.board{display:grid;grid-template-columns:repeat(var(--columns,5),minmax(0,1fr));align-content:center;gap:15px 7px;width:100%;min-height:380px;margin:auto;padding:17px 5px 8px;border:1px solid #4d4026;border-radius:22px;background:radial-gradient(circle at 50% 25%,#252016,#0b0a08 70%);box-shadow:inset 0 1px #f0d79419,0 18px 45px #0008;touch-action:manipulation}.tube{position:relative;display:flex;height:152px;min-width:0;align-items:center;justify-content:flex-end;border:0;padding:10px 5px 13px;background:none;cursor:pointer}.tube-glass{position:absolute;inset:4px 8px 7px;border:2px solid #eee9ddcc;border-top:0;border-radius:5px 5px 21px 21px;background:linear-gradient(90deg,#fff2 0 13%,transparent 15% 68%,#fff2 72% 80%,transparent 83%),linear-gradient(#bfe8ef10,#effcff0b);box-shadow:inset 0 -9px 11px #c8f7ff0c,0 8px 13px #0007}.tube-glass:before{content:"";position:absolute;z-index:3;top:-5px;left:-3px;width:calc(100% + 6px);height:10px;border:2px solid #f8f3e7;border-radius:50%;background:#12110eaa;box-shadow:inset 0 2px 3px #fff4}.balls{position:relative;z-index:2;display:flex;width:100%;height:100%;flex-direction:column-reverse;align-items:center;justify-content:flex-start;gap:1px;pointer-events:none}.ball{position:relative;width:min(52px,calc(100% - 10px));aspect-ratio:1;flex:0 0 auto;border:1px solid #fff9;border-radius:50%;background:radial-gradient(circle at 32% 23%,#fff 0 7%,var(--light) 9%,var(--colour) 48%,var(--dark) 100%);box-shadow:inset -5px -8px 10px #0003,inset 5px 4px 8px #fff3,0 4px 6px #0008;transition:transform .22s cubic-bezier(.2,.9,.3,1.2),filter .2s}.ball:after{content:"";position:absolute;top:17%;left:23%;width:18%;height:11%;border-radius:50%;background:#fff9;transform:rotate(35deg)}.ball-symbol{position:absolute;inset:0;display:grid;place-items:center;color:#16120dcc;font-size:16px;font-weight:900;text-shadow:0 1px #fff6}.tube.is-selected .ball:last-child{transform:translateY(-15px) scale(1.05);filter:drop-shadow(0 0 8px #ffe49a)}.tube.is-selected .tube-glass{border-color:var(--gold-soft);box-shadow:0 0 15px #d6b86644}.tube.can-receive .tube-glass{border-color:#fff}.tube:focus-visible{outline:3px solid var(--gold-soft);outline-offset:2px;border-radius:18px}.tube-label{position:absolute;right:0;bottom:-7px;left:0;color:#92866e;font-size:8px}.colour-0{--colour:#f04e5b;--light:#ff9b9c;--dark:#86131f}.colour-1{--colour:#47aaf0;--light:#a3d9ff;--dark:#12588f}.colour-2{--colour:#f1c93f;--light:#fff1a0;--dark:#9a6810}.colour-3{--colour:#63cf74;--light:#b6f69c;--dark:#23713a}.colour-4{--colour:#a867e6;--light:#dfb4ff;--dark:#53218b}.colour-5{--colour:#f07d32;--light:#ffc28d;--dark:#963c12}.colour-6{--colour:#eb6fc2;--light:#ffc2eb;--dark:#8d276b}.colour-7{--colour:#39c8c0;--light:#a4fff2;--dark:#14736f}.colour-8{--colour:#eee9db;--light:#fff;--dark:#918976}.colour-9{--colour:#7185f0;--light:#c4ceff;--dark:#293b98}.game-actions{display:flex;justify-content:center;margin-top:8px}.undo-button{width:auto;min-width:130px;min-height:39px;padding:7px 18px}.ad-reservation{display:grid;min-height:30px;margin-top:9px;place-items:center;border:1px dashed #3c3322;border-radius:9px;color:#665d4d;font-size:8px;letter-spacing:.14em;text-transform:uppercase}.preview-capture .home-bar{display:none}.preview-capture .game-shell{min-height:100svh}button:disabled{cursor:not-allowed;opacity:.42}dialog{width:min(440px,calc(100% - 26px));max-height:calc(100dvh - 28px);margin:auto;border:1px solid #806b3c;border-radius:20px;padding:22px;background:#11100d;color:var(--ivory);box-shadow:0 25px 100px #000d}dialog::backdrop{background:#000c;backdrop-filter:blur(5px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}dialog h2{margin:0;color:var(--gold-soft);font:normal 28px Georgia,serif}dialog h3{margin:20px 0 7px;color:var(--gold-soft);font-size:15px}dialog p{font-size:13px;line-height:1.55}.dialog-top>.icon-button{display:grid;width:39px;height:39px;place-items:center;border:1px solid #65552e;border-radius:50%;background:#15130e;color:var(--gold-soft);font-size:18px}.select-field,.switch-row{display:flex;min-height:54px;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid #3b321f}.select-field span{display:block}.select-field small{display:block;max-width:225px;margin-top:3px;color:#9e927b;font-size:11px}.select-field select{min-width:92px;border:1px solid #796439;border-radius:9px;padding:9px;background:#080808;color:var(--ivory)}.switch-row input{width:22px;height:22px;accent-color:var(--gold)}.primary-button,.secondary-button{display:flex;width:100%;min-height:46px;align-items:center;justify-content:center;border:1px solid var(--gold);border-radius:10px;padding:10px 15px;font-weight:800;cursor:pointer}.primary-button{margin-top:17px;background:var(--gold);color:#0b0905}.secondary-button{background:#12100d;color:var(--gold-soft)}.dialog-buttons{display:grid;grid-template-columns:1fr 1fr;gap:9px}.dialog-buttons .primary-button{margin-top:0}.eyebrow{color:#a99159;font-size:9px!important;font-weight:800;letter-spacing:.16em}.record-panel{border:1px solid #554724;border-radius:13px;padding:13px;background:#0b0a08}.record-grid{display:grid;grid-template-columns:1fr auto;gap:8px 14px;font-size:12px}.record-grid span{color:#a99d86}.record-grid strong{color:var(--gold-soft);text-align:right}.dialog-note{margin-bottom:0;color:#958a75}.control-rule{display:grid;grid-template-columns:36px 1fr;align-items:center;gap:9px}.control-rule p{margin:5px 0}.control-symbol{display:grid;width:32px;height:32px;place-items:center;border:1px solid #65552e;border-radius:50%;color:var(--gold-soft);font-size:18px}.info-control{font:italic bold 16px Georgia,serif}.result-dialog{text-align:center}.result-mark{display:grid;width:58px;height:58px;margin:10px auto;place-items:center;border:1px solid var(--gold);border-radius:50%;color:var(--gold-soft);font-size:30px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:17px 0;border-block:1px solid #493d25}.result-stats div{padding:11px 3px;border-right:1px solid #493d25}.result-stats div:last-child{border-right:0}.result-stats strong,.result-stats span{display:block}.result-stats strong{color:var(--gold-soft);font:23px Georgia,serif}.result-stats span{margin-top:4px;color:#9f947e;font-size:8px;letter-spacing:.12em}.result-best{color:var(--gold-soft)}.result-close{margin-top:9px}
@media(max-width:380px){.game-shell{padding-inline:8px}.board{gap:12px 3px;padding-inline:2px}.tube{height:139px;padding-inline:2px}.tube-glass{inset-inline:5px}.ball{width:min(48px,calc(100% - 6px))}.scorebar strong{font-size:16px}}
@media(min-width:700px) and (orientation:portrait){.game-shell{width:min(88vw,740px);padding-top:16px}.board{min-height:650px;gap:25px 14px;padding:28px 20px}.tube{height:230px}.tube-glass{inset-inline:12px;border-width:3px}.ball{width:min(78px,calc(100% - 14px))}.message{margin-block:8px;font-size:15px}.scorebar>div{padding:10px}.scorebar strong{font-size:24px}.undo-button{min-height:48px}}
@media(orientation:landscape) and (max-height:800px){.game-shell{width:min(900px,100%);padding-top:7px}.board{min-height:360px;grid-template-columns:repeat(var(--tube-count),minmax(0,1fr));gap:6px}.tube{height:145px}.message{margin-block:1px}.ad-reservation{display:none}}
@media(prefers-reduced-motion:reduce){.ball{transition:none}}
.tube{height:calc(var(--capacity) * 41px + 26px)}.ball{width:min(40px,calc(100% - 10px))}
@media(min-width:700px) and (orientation:portrait){.tube{height:calc(var(--capacity) * 67px + 30px)}.ball{width:min(66px,calc(100% - 14px))}}
.home-bar{position:sticky;top:0;z-index:30;display:flex;width:100%;min-height:calc(52px + env(safe-area-inset-top));align-items:center;justify-content:center;gap:10px;border-bottom:1px solid #f4dfa5;padding:env(safe-area-inset-top) 18px 0;background:linear-gradient(110deg,#b18a38,#f0d98e 48%,#b18a38);box-shadow:0 8px 28px #0009,inset 0 1px #fff8;color:#090806;font-size:.88rem;font-weight:850;letter-spacing:.16em;text-decoration:none;text-transform:uppercase}.game-shell{min-height:calc(100svh - 52px)}.preview-capture .home-bar{display:none}.scorebar{grid-template-columns:repeat(3,1fr)}.scorebar.is-timer-hidden{grid-template-columns:repeat(2,1fr)}.result-stats{grid-template-columns:repeat(2,1fr)}