:root{font-family:'DM Sans',sans-serif;color:#24304a;background:#f7f9fc;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;background:white;border:1px solid #dce1eb;border-radius:10px;padding:11px 16px;font-weight:600}button:hover{background:#edf1fa}button:focus-visible,a:focus-visible{outline:3px solid #315bdf;outline-offset:4px}button:disabled{opacity:.4;cursor:default}header{height:92px;border-bottom:1px solid #e1e6ef;display:flex;align-items:center;justify-content:space-between;padding:0 max(5vw,20px);background:white}.brand{display:flex;align-items:center;gap:10px;font:800 29px Manrope,sans-serif;letter-spacing:-1px;text-decoration:none;color:#24304a}.brandmark{background:#263a69;color:#fff;border-radius:9px;padding:1px 9px;font-size:28px}.edition{font:600 11px 'DM Sans',sans-serif;letter-spacing:2px;margin:5px 0 0 15px}#help{border:0}#help span{border:1px solid #9aa4b8;border-radius:50%;padding:0 6px;margin-left:8px}main{max-width:1100px;margin:0 auto;padding:40px 30px 20px}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px;color:#69768e;margin:0 0 10px}h1{font:800 clamp(25px,3vw,37px) Manrope,sans-serif;letter-spacing:-1.3px;margin:0}.outline{background:transparent}.game{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(290px,1fr);gap:26px}.play{background:white;border:1px solid #e0e5ef;border-radius:22px;padding:24px;box-shadow:0 8px 35px #24304a05}.playbar{display:flex;align-items:center;justify-content:space-between;gap:10px}.levels{display:flex;background:#f1f3f7;padding:4px;border-radius:10px}.levels button{background:transparent;border:0;font-size:14px;padding:8px 13px}.levels .active{background:white;box-shadow:0 2px 6px #20305016}#timer{font-size:14px;font-variant-numeric:tabular-nums;color:#69768e}.boardwrap{min-height:320px;display:flex;align-items:center;justify-content:center;padding:35px 0 30px}#board{display:grid;gap:5px;position:relative;width:min(100%,360px);aspect-ratio:var(--ratio);grid-template-columns:repeat(var(--cols),1fr)}.cell{position:relative;min-width:0;width:100%;height:100%;padding:6px;border:2px solid var(--edge);border-radius:9px;background:var(--color);display:grid;place-items:center}.cell:hover{filter:brightness(.96);background:var(--color)}.cell .pips{width:80%;height:80%}.cell.filled{border:2px solid #33476b;background:var(--color);box-shadow:inset 0 0 0 3px #ffffff90}.cell.joinRight{border-right:0;border-radius:8px 0 0 8px}.cell.joinLeft{border-left:0;border-radius:0 8px 8px 0}.cell.joinDown{border-bottom:0;border-radius:8px 8px 0 0}.cell.joinUp{border-top:0;border-radius:0 0 8px 8px}.badge{position:absolute;bottom:-4px;right:-3px;background:#fff;border:1px solid var(--edge);font-size:11px;font-weight:700;min-width:21px;height:20px;border-radius:5px;z-index:2;padding:1px 4px}.underboard{display:flex;justify-content:space-between;font-size:12px;color:#69768e}#message{font-size:14px;line-height:1.5;text-align:center;min-height:63px;padding:21px 0 12px}.actions{display:flex;gap:8px;justify-content:center;border-top:1px solid #e8edf4;padding-top:16px}.actions button{border:0;background:transparent;font-size:14px}.trayhead,.ruleshead{display:flex;align-items:center;justify-content:space-between}h2{font:800 18px Manrope,sans-serif;margin:0}.trayhead span,.ruleshead span{font-size:11px;color:#69768e;letter-spacing:1px}.muted{color:#7a869a;font-size:14px;margin:7px 0 18px}aside{padding:14px 3px}#tray{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;min-height:108px}.domino{display:flex;height:48px;padding:5px;background:white;border:1px solid #cbd3e1;box-shadow:0 3px 0 #dce3ef;border-radius:8px;min-width:0}.domino.selected{outline:2px solid #3a5ac8;outline-offset:3px;background:#edf2ff}.domino .pips{flex:1}.domino .pips+ .pips{border-left:1px solid #d5dbe7}.pips{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:3px;gap:2px;min-width:0;aspect-ratio:1}.dot{align-self:center;justify-self:center;width:6px;height:6px;border-radius:50%;background:#283d64}.cell .dot{width:clamp(4px,1vw,8px);height:clamp(4px,1vw,8px)}.selection{display:flex;align-items:center;gap:13px;margin-top:23px;min-height:59px}.selection strong{font-size:14px}.selection p{font-size:12px;color:#77849a;margin:4px 0}#selectedPreview{width:78px;flex:none}#selectedPreview .domino{height:40px}.transform{display:flex;gap:10px;margin-top:12px}.transform button{flex:1;font-size:14px;padding:9px}kbd{font:11px inherit;color:#8b95a8;margin-left:6px}.ruleshead{border-top:1px solid #dce2ec;padding-top:24px;margin-top:24px;margin-bottom:13px}.ruleshead h2{font-size:16px}.rule{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:14px}.swatch{height:30px;min-width:36px;display:grid;place-items:center;border:1px solid var(--edge);background:var(--color);border-radius:7px;font-weight:700}.rule .state{margin-left:auto;font-size:12px;color:#78869b}.rule.good .state{color:#087257}.rule.bad .state{color:#b04148}footer{display:flex;justify-content:space-between;gap:24px;margin-top:24px;color:#7f8ba0;font-size:11px;line-height:1.6}footer span:last-child{max-width:330px;text-align:right}dialog{border:0;border-radius:22px;padding:35px;max-width:480px;width:calc(100% - 32px);color:#24304a;box-shadow:0 25px 100px #101b4750}dialog::backdrop{background:#17274970;backdrop-filter:blur(4px)}dialog h2{font-size:25px}dialog p,dialog li{font-size:15px;line-height:1.7}dialog ol{padding-left:22px}.close{float:right;border:0;padding:0 5px;font-size:24px}.primary{background:#263e79;color:#fff;width:100%}.win{color:#087257;font-weight:700}@media(max-width:720px){header{height:72px;padding:0 20px}.edition{display:none}main{padding:26px 16px}.heading{align-items:flex-start;gap:12px}.heading .outline{font-size:12px;padding:10px;white-space:nowrap}.eyebrow{font-size:9px}h1{font-size:25px}.game{grid-template-columns:1fr;gap:20px}.play{padding:17px}.boardwrap{min-height:260px;padding:28px 0}#board{max-width:320px}aside{padding:0 5px}#tray{grid-template-columns:repeat(4,1fr);min-height:0;gap:10px}.domino{height:45px}.selection{margin-top:20px}.cell .dot{width:7px;height:7px}footer{flex-direction:column;gap:5px}footer span:last-child{max-width:none;text-align:left}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s,outline .15s}.win{animation:celebrate .5s ease}@keyframes celebrate{50%{transform:scale(1.04)}}}

#board{grid-template-rows:repeat(var(--rows),minmax(0,1fr))}.cell{min-height:0}.cell .pips{aspect-ratio:auto}

.next-puzzle{margin:0 0 18px}.next-puzzle[hidden]{display:none}.primary:hover{background:#345398}

.board-gap{pointer-events:none;min-width:0;min-height:0}

.control-label{display:block;font-size:11px;letter-spacing:1.4px;font-weight:700;color:#69768e;margin-bottom:7px}.difficulty-control{margin-top:16px}.difficulty-control .levels{display:inline-flex}.difficulty-note{font-size:13px;line-height:1.5;color:#69768e;margin:10px 0 0}.boardwrap{padding-top:24px}

.brand-name{white-space:nowrap}@media(max-width:480px){.brand{font-size:21px;gap:7px;letter-spacing:-.7px}.brandmark{font-size:22px;padding:1px 7px}header{padding:0 12px;gap:8px}#help{font-size:12px;padding:8px 0}#help span{display:none}}

.install-footer{display:flex;align-items:center;gap:14px;margin-top:22px}.install-footer span{font-size:13px;color:#69768e;line-height:1.5}button[hidden]{display:none}@media(max-width:480px){.install-footer{align-items:flex-start;flex-direction:column;gap:8px}}

.brand-logo{display:block;width:64px;height:64px;object-fit:contain;flex:none}@media(max-width:480px){.brand-logo{width:44px;height:44px}.brand{font-size:19px;gap:5px}}

/* Stable tray slots leave room for a full clockwise turn. */
.domino-slot{height:84px;display:flex;align-items:center;justify-content:center;min-width:0}
#tray .domino{width:76px;height:38px;padding:4px;touch-action:none;user-select:none;cursor:grab;flex:none}
#tray .domino.vertical,.domino.vertical{flex-direction:column;width:38px;height:76px}
.domino.vertical .pips+.pips{border-left:0;border-top:1px solid #d5dbe7}
#selectedPreview{height:80px;display:flex;align-items:center;justify-content:center}
#selectedPreview .domino{width:76px;height:38px}
#selectedPreview .domino.vertical{width:38px;height:76px}
.drag-ghost{position:fixed;z-index:1000;pointer-events:none;opacity:.88;outline:2px solid #3a5ac8;box-shadow:0 8px 22px #24304a40}
.cell.drop-ok{outline:3px solid #087257;outline-offset:1px}
.cell.drop-no{outline:3px solid #b04148;outline-offset:1px}
@media(max-width:380px){#tray .domino{width:64px;height:32px}#tray .domino.vertical{width:32px;height:64px}}

@media(max-width:420px){.levels button{padding:8px 10px}.cell .dot{width:5px;height:5px}.cell{padding:3px}}

footer{font-size:14px}.footer-credit{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px}.app-version{white-space:nowrap}