.ogb-game{--ogb-ink:#fff;--ogb-deep:#06306e;--ogb-aqua:#1bd6dc;--ogb-gold:#ffe65a;box-sizing:border-box;position:relative;width:100%;max-width:510px;margin:18px auto;border:4px solid rgba(183,253,255,.9);border-radius:30px;background:#063478;box-shadow:0 13px 30px rgba(1,33,88,.3);overflow:hidden;font-family:"Trebuchet MS",Arial,sans-serif;color:#fff}.ogb-game *{box-sizing:border-box}.ogb-shell{position:relative;z-index:1;min-height:760px;padding:13px 12px 14px;background:linear-gradient(rgba(1,27,92,.2),rgba(0,43,114,.24)),var(--ogb-bg) center top/cover no-repeat}.ogb-shell:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,87,169,.24),rgba(0,18,82,.28));pointer-events:none}.ogb-top,.ogb-scorebar,.ogb-help,.ogb-board-wrap,.ogb-status,.ogb-tray-title,.ogb-tray{position:relative;z-index:1}.ogb-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.ogb-brand{font-size:clamp(20px,5.7vw,28px);font-weight:900;line-height:1.05;letter-spacing:.01em;text-shadow:0 2px 0 #093782,0 5px 13px rgba(0,25,83,.5)}.ogb-new{flex:0 0 auto;border:2px solid #fff;border-radius:15px;padding:8px 10px;background:#f355a8;color:#fff;font:800 12px "Trebuchet MS",Arial,sans-serif;box-shadow:0 3px 0 #a31d62;cursor:pointer}.ogb-new:active{transform:translateY(2px);box-shadow:0 1px 0 #a31d62}.ogb-scorebar{display:flex;justify-content:center;gap:13px;margin:9px 0}.ogb-scorebar span{min-width:105px;padding:6px 11px;border:2px solid #82f8ff;border-radius:14px;background:rgba(3,37,105,.78);font-weight:800;font-size:13px;text-align:center;box-shadow:inset 0 1px rgba(255,255,255,.3)}.ogb-scorebar strong{color:var(--ogb-gold);font-size:17px}.ogb-help{max-width:400px;margin:5px auto 10px;font-weight:800;font-size:13px;line-height:1.25;text-align:center;text-shadow:0 2px 0 rgba(0,38,107,.8)}.ogb-board-wrap{width:min(100%,440px);margin:0 auto;padding:7px;border:4px solid #21d8e7;border-radius:21px;background:linear-gradient(145deg,#0d83b4,#063471);box-shadow:inset 0 2px 4px rgba(255,255,255,.5),0 6px 0 rgba(1,43,106,.54),0 14px 20px rgba(0,15,78,.26)}.ogb-board{display:grid;grid-template-columns:repeat(9,1fr);gap:3px;aspect-ratio:1;border-radius:12px;padding:5px;background:rgba(2,27,81,.72)}.ogb-cell{appearance:none;min-width:0;border:0;border-radius:5px;background:linear-gradient(145deg,rgba(30,181,208,.8),rgba(8,105,160,.87));box-shadow:inset 0 1px 1px rgba(255,255,255,.4),inset 0 -2px 2px rgba(0,41,97,.32);cursor:pointer;transition:transform .12s,filter .12s}.ogb-cell.is-filled{background:var(--piece-color);box-shadow:inset 0 2px 2px rgba(255,255,255,.72),inset 0 -4px 3px rgba(0,0,0,.15),0 2px 0 rgba(0,40,90,.2)}.ogb-cell.is-preview{filter:brightness(1.45);outline:2px solid rgba(255,241,112,.92)}.ogb-cell.is-bad{animation:ogb-shake .25s linear}.ogb-cell.is-clear{animation:ogb-pop .32s ease-in forwards}.ogb-status{min-height:26px;padding-top:10px;color:#fff797;text-align:center;font-size:14px;font-weight:900;text-shadow:0 2px 0 #063a89}.ogb-tray-title{margin:3px 0 5px;text-align:center;font-size:15px;font-weight:900;text-shadow:0 2px 0 #063a89}.ogb-tray{display:flex;align-items:center;justify-content:space-evenly;gap:8px;min-height:108px;padding:9px 7px;border:3px solid #37e0ea;border-radius:21px;background:linear-gradient(145deg,rgba(1,34,91,.94),rgba(9,78,144,.9));box-shadow:inset 0 2px rgba(255,255,255,.21),0 5px 0 rgba(0,36,99,.42)}.ogb-piece{display:grid;grid-template-columns:repeat(var(--w),22px);grid-template-rows:repeat(var(--h),22px);gap:2px;align-content:center;justify-content:center;min-width:88px;min-height:80px;padding:8px;border:3px solid transparent;border-radius:17px;background:transparent;cursor:grab;touch-action:none;transition:transform .15s,background .15s,border-color .15s}.ogb-piece:hover,.ogb-piece.is-selected{transform:translateY(-5px) scale(1.05);border-color:#fff46f;background:rgba(255,255,255,.12);box-shadow:0 4px 11px rgba(0,13,72,.35)}.ogb-piece:active{cursor:grabbing}.ogb-mini{width:22px;height:22px;border-radius:6px;background:var(--piece-color);box-shadow:inset 0 2px 2px rgba(255,255,255,.78),inset 0 -3px 2px rgba(0,0,0,.17),0 2px 0 rgba(0,28,86,.38)}.ogb-modal{position:absolute;z-index:5;inset:0;display:grid;place-items:center;padding:18px;background:rgba(0,13,76,.71);backdrop-filter:blur(3px)}.ogb-modal-card{width:min(100%,340px);padding:25px 20px;border:4px solid #bafaff;border-radius:27px;background:linear-gradient(160deg,#23cbd9,#296bd8);box-shadow:0 12px 0 #073477,0 22px 35px rgba(0,13,76,.55);text-align:center}.ogb-modal-icon{display:block;font-size:55px;animation:ogb-float 1.8s ease-in-out infinite}.ogb-modal h2{margin:5px 0;font-size:27px;text-shadow:0 3px 0 #0e3d91}.ogb-modal p{margin:6px auto;font-weight:700}.ogb-final-score{display:block;margin:13px 0;color:#fff36b;font-size:22px;text-shadow:0 2px 0 #0a3b88}.ogb-play-again{border:3px solid #fff;border-radius:18px;padding:11px 18px;background:#f65a9f;color:#fff;font:900 16px "Trebuchet MS",Arial,sans-serif;box-shadow:0 4px 0 #a92867;cursor:pointer}@keyframes ogb-pop{0%{transform:scale(1)}50%{transform:scale(1.2);filter:brightness(1.7)}100%{transform:scale(0);opacity:0}}@keyframes ogb-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes ogb-float{50%{transform:translateY(-7px)}}@media(max-width:520px){.ogb-game{margin:8px auto;border-width:3px;border-radius:22px;max-width:none}.ogb-shell{min-height:0;padding:10px 8px 11px}.ogb-brand{font-size:20px}.ogb-new{padding:6px 8px;font-size:11px}.ogb-scorebar{margin:7px 0;gap:7px}.ogb-scorebar span{min-width:94px;padding:4px 8px;font-size:12px}.ogb-scorebar strong{font-size:15px}.ogb-help{margin:4px auto 8px;font-size:12px}.ogb-board-wrap{padding:5px;border-width:3px;border-radius:16px}.ogb-board{gap:2px;padding:4px}.ogb-cell{border-radius:3px}.ogb-tray{min-height:89px;padding:5px 3px;border-radius:16px}.ogb-piece{grid-template-columns:repeat(var(--w),18px);grid-template-rows:repeat(var(--h),18px);min-width:70px;min-height:67px;padding:5px;border-radius:12px}.ogb-mini{width:18px;height:18px;border-radius:5px}.ogb-status{padding-top:7px;font-size:12px}.ogb-tray-title{font-size:13px}}