@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap');
.actions{display:flex;justify-content:flex-end;gap:12px;margin-top:16px}.actions .primary{min-width:0;font-size:14px;padding:12px 20px}.secondary{background:white;border:1px solid #d9ddef;border-radius:10px;padding:11px 18px;font-size:14px;color:#58628b}button:disabled{cursor:default}.actions button:disabled{opacity:.4;box-shadow:none}.tile.linked{border-color:#aeb8f0;background:#eef0ff;color:#3d4ba5}.tile.linked::after{border-color:#6878ef;background:#6878ef}
:root{font-family:'DM Sans',sans-serif;color:#202648;background:#f0f2fc;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ea9e21;outline-offset:5px}main{max-width:1020px;margin:auto;padding:28px 40px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.brand{display:flex;align-items:center;font:700 27px 'Outfit',sans-serif;text-decoration:none;color:#202648;letter-spacing:-1px}.logo{background:#4255e7;color:white;border-radius:12px;padding:3px 10px;margin-right:10px;font-size:30px}.brand-dot{color:#4255e7}.header-note,.eyebrow,.mini-label,.column-labels{font-size:12px;letter-spacing:1.7px;font-weight:700}.header-note{color:#737991}.game{background:white;border-radius:28px;padding:32px 42px 20px;box-shadow:0 12px 60px #24357009}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.eyebrow{color:#5360b8;margin:0 0 10px}h1{font:600 clamp(28px,4.8vw,43px)/1.07 'Outfit',sans-serif;letter-spacing:-1.5px;margin:0 0 25px}.clock{flex-shrink:0;display:flex;flex-direction:column;justify-content:center;align-items:center;border:7px solid #e4e8ff;border-top-color:#5666ed;border-radius:50%;width:108px;height:108px;margin-bottom:20px}.clock strong{font:600 40px/1 'Outfit',sans-serif;font-variant-numeric:tabular-nums}.clock span{font-size:10px;letter-spacing:1px;margin-top:5px}.clock.urgent{border-color:#ffe0dc;border-top-color:#e65347;color:#c74336}.levelbar{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px}.levelbar>div{display:flex;align-items:center;gap:12px}.level-pill{background:#eceeff;color:#4755d1;font-size:12px;font-weight:800;letter-spacing:.8px;padding:8px 10px;border-radius:7px}#progress{color:#74798e;white-space:nowrap}.timer-track{height:4px;border-radius:3px;background:#eef0fa;margin-top:14px;overflow:hidden}#timerFill{height:100%;width:100%;background:#5364e9;transition:width .1s linear}.instruction{font-size:14px;color:#72778d;margin:18px 0}.board-wrap{position:relative}.column-labels{display:flex;justify-content:space-between;color:#9397a8;font-size:11px;margin-bottom:12px}.board{position:relative;display:flex;justify-content:space-between;padding:0 0 8px;user-select:none}.column{width:42%;display:flex;flex-direction:column;gap:12px;z-index:1}.answers{width:27%}.tile{position:relative;min-height:58px;border:2px solid #e5e8f5;background:#f9faff;border-radius:12px;color:#29335b;font:500 clamp(17px,2.9vw,24px) 'Outfit',sans-serif;touch-action:none;transition:background .15s,border-color .15s}.tile:hover{border-color:#b0b8f6}.tile::after{content:'';position:absolute;top:calc(50% - 5px);right:-6px;width:10px;height:10px;border-radius:50%;border:2px solid #bdc5e7;background:white}.answers .tile::after{right:auto;left:-6px}.tile.selected{border-color:#5364e9;background:#eef0ff}.tile.matched{border-color:#a5d6ce;background:#eaf7f2;color:#287b6a}.tile.matched::after{border-color:#48a28c;background:#48a28c}.tile.wrong{border-color:#e5736c;background:#fff0ee}#lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}.bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-top:16px;font-size:13px;color:#84899c}.text-button{border:0;background:none;color:#5d668a;font-size:13px;padding:8px}.overlay{position:absolute;inset:-4px -8px;background:#ffffffdc;backdrop-filter:blur(5px);z-index:3;display:flex;align-items:center;justify-content:center;border-radius:15px}.overlay[hidden]{display:none}.overlay-card{text-align:center;max-width:350px;padding:24px}.mini-label{color:#5663d5;font-size:11px}h2{font:600 30px/1.1 'Outfit',sans-serif;letter-spacing:-.8px;margin:13px 0}.overlay p{font-size:15px;line-height:1.6;color:#737a94}.primary{background:#4457e8;color:white;border:0;border-radius:11px;padding:14px 22px;font-weight:600;min-width:190px;box-shadow:0 5px 15px #4457e832}.primary span{margin-left:25px}.primary:hover{background:#3244d2}footer{display:flex;justify-content:space-between;padding:22px 5px;font-size:12px;color:#8187a0}footer span:last-child{letter-spacing:1px;font-size:10px}@media(max-width:600px){main{padding:18px 14px}.header-note{display:none}header{margin-bottom:20px}.brand{font-size:24px}.game{padding:25px 18px 15px;border-radius:22px}.eyebrow{font-size:10px;letter-spacing:1px}.clock{width:82px;height:82px;border-width:5px}.clock strong{font-size:31px}.clock span{font-size:8px}h1{letter-spacing:-1px}.levelbar>div{gap:7px}.levelbar strong{font-size:12px}.level-pill{font-size:10px;padding:7px}.levelbar{font-size:12px}.instruction{font-size:12px;line-height:1.5}.column{width:48%;gap:12px}.answers{width:25%}.tile{min-height:57px;font-size:18px}.bottom{font-size:11px;gap:5px}.text-button{font-size:11px;white-space:nowrap}footer span:last-child{display:none}.overlay-card{padding:20px}h2{font-size:27px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.tile{padding:8px 10px;overflow-wrap:normal}.levelbar>div{min-width:0}.levelbar strong{overflow-wrap:anywhere}@media(max-width:380px){main{padding:12px 8px}.game{padding:22px 14px 14px}.levelbar{flex-wrap:wrap}.heading{gap:10px}h1{font-size:28px}.clock{width:70px;height:70px}.column{width:50%}.answers{width:25%}.tile{font-size:17px;padding:8px 6px}.actions{justify-content:stretch}.actions button{flex:1}.bottom{align-items:flex-start}}

.column .tile{height:70px;line-height:1.25}.answers .tile{height:70px}.tile{font-size:clamp(16px,2.3vw,23px)}@media(max-width:600px){.tile{font-size:17px}.column .tile{height:76px}.answers .tile{height:76px}}

/* Compact play surface; keep the timer visible even when zooming or scrolling. */
@media(max-width:760px),(max-height:650px){
 main{padding:8px max(10px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));padding-top:max(8px,env(safe-area-inset-top))}
 header{height:44px;margin:0 0 6px;padding-right:82px}.brand{font-size:22px;white-space:nowrap}.logo{font-size:24px;padding:2px 8px;border-radius:9px}.header-note,footer{display:none}
 .game{padding:10px 12px 8px;border-radius:16px}.heading{display:contents}.heading>div:first-child{display:none}
 .clock{position:fixed;z-index:10;top:max(8px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));margin:0;width:72px;height:44px;border-radius:12px;border-width:3px;flex-direction:row;gap:4px;background:white;box-shadow:0 2px 8px #20264812}.clock strong{font-size:26px}.clock span{font-size:9px;letter-spacing:0;margin:0}
 .levelbar{font-size:12px;flex-wrap:nowrap;gap:6px}.levelbar>div{gap:7px;flex:1}.levelbar strong{font-size:12px;line-height:1.2}.level-pill{font-size:10px;padding:6px;white-space:nowrap}
 .timer-track{margin-top:7px}.instruction{font-size:12px;line-height:1.3;margin:8px 0}.column-labels{margin-bottom:6px;font-size:10px}
 .board{padding-bottom:0}.column{width:60%;gap:6px}.answers{width:21%}.column .tile,.answers .tile{height:clamp(48px,calc((100svh - 254px)/5),76px);min-height:48px;padding:4px 6px;font-size:17px;line-height:1.2;border-radius:9px}
 .actions{margin-top:9px;gap:8px}.actions button{min-height:44px;flex:1}.actions .primary,.secondary{padding:10px 12px;font-size:14px}
 .bottom{padding-top:5px;gap:8px;align-items:center;font-size:11px;line-height:1.2}.text-button{font-size:11px;min-height:32px;padding:5px;white-space:nowrap}
 .overlay-card{padding:16px}.overlay p{margin:10px 0;font-size:14px}.overlay h2{font-size:26px}
}
@media(max-width:360px){.brand{font-size:20px}.column .tile{font-size:16px}.levelbar strong{font-size:11px}.levelbar{font-size:11px}}

/* Countdown effects */
.bomb-icon{display:none!important}.clock.bomb-active .bomb-icon{display:block!important;font-size:25px;line-height:1;animation:bomb-tick .65s ease-in-out infinite alternate}.clock.bomb-active{border-color:#ffbd67;background:#fff4df}.clock.bomb-active>span:last-child{display:none}.clock.bomb-active{gap:1px}.round-options{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:5px;color:#69728f;font-size:12px}.round-options .text-button{min-height:32px}.blast{display:none;position:absolute;inset:0;z-index:5;pointer-events:none;align-items:center;justify-content:center;overflow:hidden;border-radius:16px}.blast.burst{display:flex}.blast strong{font:800 48px 'Outfit',sans-serif;color:#dc6c16;text-shadow:0 2px white;animation:boom-word .85s ease-out both}.blast-ring{position:absolute;width:70px;height:70px;border:12px solid #ffb234;border-radius:50%;animation:blast-ring .8s ease-out both}.blast i{position:absolute;width:8px;height:16px;background:#ef9340;border-radius:4px;transform:rotate(var(--angle));animation:blast-spark .8s ease-out both}.blast i:nth-child(even){background:#5967ef}@keyframes bomb-tick{from{transform:rotate(-9deg) scale(.95)}to{transform:rotate(9deg) scale(1.1)}}@keyframes blast-ring{to{transform:scale(7);opacity:0}}@keyframes blast-spark{from{transform:rotate(var(--angle)) translateY(-20px);opacity:1}to{transform:rotate(var(--angle)) translateY(-170px) scale(.4);opacity:0}}@keyframes boom-word{0%{transform:scale(.4);opacity:0}20%{transform:scale(1.08);opacity:1}65%{opacity:1}100%{transform:scale(1.3);opacity:0}}@media(max-width:760px),(max-height:650px){.clock.bomb-active{flex-direction:row;gap:4px}.clock.bomb-active .bomb-icon{font-size:22px}.column .tile,.answers .tile{height:clamp(48px,calc((100svh - 287px)/5),76px)}.round-options{margin:0;font-size:11px}}@media(prefers-reduced-motion:reduce){.bomb-icon,.blast *{animation:none!important}.blast.burst{display:none}}
