:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:dark;color:#e5eaf0;background:#252e39;font-synthesis:none;--muted:#afbecb;--accent:#c5b6ff;--line:#4b5b6b}
*{box-sizing:border-box}body{margin:0;background:#252e39}button,input{font:inherit}button{cursor:pointer;color:inherit;touch-action:manipulation}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #c9b7ff;outline-offset:4px}[hidden]{display:none!important}
.shariki-shell{height:100vh;height:100dvh;min-height:470px;display:flex;flex-direction:column;padding:0 clamp(14px,3vw,64px);max-width:1600px;margin:auto}
.wp-topbar{position:relative;border-color:#455362}.wp-topbar .wp-brand{color:#e6edf1}.wp-topbar .wp-brand .brand-icon{background:#436f70}.wp-language button{color:#b4c0cd}.wp-language button[aria-pressed=true]{color:#fff}.wp-language{margin-right:16px}.wp-topbar .wp-icon,#fullscreen-exit{background:#414f5c;color:#dfeded;border-color:#586977}.header-game-title{position:absolute;left:50%;transform:translateX(-50%);margin:0;display:flex;align-items:center;gap:11px;font-size:24px;font-weight:800;letter-spacing:-.8px;color:#e6edf1}.title-spheres{width:17px;height:17px;display:block;border-radius:50%;background:radial-gradient(circle at 32% 25%,#fff4df,#ffce46 25%,#e49a13 65%,#916009);box-shadow:11px 5px 0 -1px #e95c86,-8px 6px 0 -2px #43c9b2;margin-right:5px}.wp-save-note,.wp-footer,.wp-footer button{color:#b0bec8}.wp-save-note{margin-top:auto;font-size:10px}.wp-footer{border-color:#455362;min-height:40px}.wp-footer button:hover{color:#fff}
.play-layout{flex:1;min-height:0;display:flex;justify-content:center;align-items:center;padding:22px 0 12px}.game-card{display:grid;grid-template-columns:minmax(0,1fr) 210px;grid-template-rows:minmax(0,1fr) 32px;gap:0 28px;width:min(1050px,100%);height:100%;max-height:850px;padding:24px;background:linear-gradient(140deg,#35414f,#303b48);border:1px solid #465667;border-radius:28px;box-shadow:0 18px 60px #0b15232b;overflow:hidden}.board-stage{min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;padding:8px}.score-panel{padding:14px 0;display:flex;flex-direction:column;min-height:0;justify-content:center}.stats{display:flex;flex-direction:column;gap:22px}.stat>span{display:block;font-size:10px;font-weight:700;color:#aebfce;letter-spacing:1.8px;margin-bottom:6px}.stat strong{display:block;font-size:29px;line-height:1.1;letter-spacing:-1px;font-weight:600;font-variant-numeric:tabular-nums}.main-stat strong{font-size:clamp(38px,4vw,56px);color:#f4ebff;letter-spacing:-2px}.main-stat span{color:#d4c8ff}.rule-preview{display:flex;align-items:center;gap:5px;margin:30px 0 12px}.demo-ball{height:22px;width:22px;border-radius:50%;background:radial-gradient(circle at 33% 25%,var(--shine),var(--light) 24%,var(--color) 49%,var(--dark) 92%);box-shadow:0 3px 4px #101b2c88}.rule-preview span{font-size:14px;color:#f0cc82;margin-left:8px}.rule-copy{font-size:12px;line-height:1.7;color:#b7c6d3;margin:0 0 24px;max-width:190px}.game-actions{display:flex;flex-direction:column;gap:10px}.primary-button,.secondary-button{min-height:44px;border-radius:12px;padding:12px 16px;display:flex;align-items:center;justify-content:center;gap:9px;font-size:12px;font-weight:650;border:1px solid transparent}.primary-button{background:#b9a5ef;color:#241c3c;box-shadow:inset 0 1px 0 #fff5,0 4px 14px #0c142228}.primary-button:hover{background:#c9b8fa}.secondary-button{background:#425060;border-color:#596a7b;color:#e0e9f2}.secondary-button:hover{background:#4d5d70}.rules-button{border:0;background:transparent;font-size:11px;color:#b7c6d3;padding:8px;min-height:35px}.rules-button:hover{color:#fff}.restart-symbol{font-size:21px;line-height:1}#game-status{margin:6px 0 0;grid-column:1/-1;text-align:center;font-size:11px;line-height:1.5;color:#bdc9d6;min-height:20px;align-self:center}#game-status.error{color:#ffb4c3}
#board-frame{position:relative;aspect-ratio:1;width:100%;max-width:100%;border-radius:24px;padding:15px;background:linear-gradient(135deg,#7894a7,#344a5f 35%,#192a3b 70%,#5a748c);box-shadow:inset 0 2px 2px #b6d3e480,inset 0 -4px 4px #091625,0 16px 30px #0a13274d;isolation:isolate}#board{width:100%;height:100%;position:relative;overflow:hidden;border-radius:12px;background-color:#273b4d;background-image:linear-gradient(90deg,#10253755 1px,transparent 1px),linear-gradient(#10253755 1px,transparent 1px);background-size:12.5% 12.5%;box-shadow:inset 0 5px 14px #071623a6,inset 0 -1px 2px #a4c6df30;touch-action:none;user-select:none}#board[aria-busy=true]{cursor:wait}.tile{position:absolute;width:12.5%;height:12.5%;display:grid;place-items:center;border:0;padding:0;background:transparent;transition:top .28s cubic-bezier(.32,.01,.71,.99),left .24s ease;z-index:1;outline:none;touch-action:none}.tile:before{content:"";position:absolute;inset:6%;border:2px solid transparent;border-radius:18%;transition:border-color .15s,background .15s}.tile.selected:before{border-color:#eadbff;background:#c0aaff19;box-shadow:0 0 10px #c7adff33}.tile:focus-visible{outline:none;z-index:2}.tile:focus-visible:before{border-color:#ffe5b0}.tile .sphere{position:relative;display:block;width:83%;height:83%;border-radius:50%;pointer-events:none;background:radial-gradient(ellipse at 29% 22%,var(--shine) 0%,var(--light) 18%,var(--color) 47%,var(--dark) 86%,var(--color) 100%);box-shadow:inset -2px -4px 5px #02091448,inset 1px 1px 2px #ffffff55,2px 5px 5px #07132180;transition:transform .15s,filter .15s;transform:translateY(-2%)}.sphere:before{content:"";position:absolute;left:19%;top:12%;width:43%;height:24%;border-radius:50%;background:linear-gradient(155deg,#fff9,#ffffff06);transform:rotate(-34deg);filter:blur(.25px)}.sphere:after{content:"";position:absolute;right:11%;bottom:16%;width:27%;height:8%;border-radius:50%;background:var(--light);filter:blur(2px);opacity:.3;transform:rotate(-35deg)}.tile.selected .sphere{transform:translateY(-3%) scale(1.045);filter:brightness(1.1)}@media(hover:hover){.tile:hover .sphere{filter:brightness(1.12);transform:translateY(-4%) scale(1.035)}}.tile.removing{z-index:2}.tile.removing .sphere{animation:pop .23s ease-in forwards}.tile.invalid:before{border-color:#ff9eb1}.tile.invalid .sphere{animation:shake .25s ease-in-out}.tile.fresh{transition:none}.color-0{--shine:#ffc6d2;--light:#ff809c;--color:#ea3b66;--dark:#840b34}.color-1{--shine:#abc7ff;--light:#4c81ff;--color:#2952dc;--dark:#13266e}.color-2{--shine:#c5ffb7;--light:#68e877;--color:#20b54b;--dark:#075b2b}.color-3{--shine:#ffffd1;--light:#fff172;--color:#ffd02e;--dark:#af6508}.color-4{--shine:#c1fff2;--light:#68f4d2;--color:#1cc2ae;--dark:#076d70}.color-5{--shine:#f7c2ff;--light:#d982f2;--color:#b644d6;--dark:#5b207d}.color-6{--shine:#fff;--light:#fff;--color:#dbe5f2;--dark:#718fa9}.color-7{--shine:#c4d3e1;--light:#8c9bae;--color:#516378;--dark:#202e41}.color-8{--shine:#d3f2ff;--light:#8cdbff;--color:#4aa2f2;--dark:#185694}
#score-pop{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);font-size:clamp(28px,5vw,45px);font-weight:800;color:#fff1c5;text-shadow:0 3px 2px #2d243b,0 0 20px #100c1b;pointer-events:none;opacity:0;z-index:5}#score-pop.show{animation:points .7s ease-out forwards}@keyframes points{0%{opacity:0;translate:0 15px;scale:.8}20%,65%{opacity:1;scale:1}100%{opacity:0;translate:0 -35px}}@keyframes pop{35%{transform:scale(1.13);filter:brightness(1.5)}100%{transform:scale(.05);opacity:0}}@keyframes shake{25%,75%{translate:3px 0}50%{translate:-3px 0}}
dialog{max-width:min(470px,calc(100vw - 28px));width:100%;max-height:85dvh;overflow:auto;background:#35414f;color:#edf0f5;border:1px solid #5c6e80;border-radius:23px;padding:26px;box-shadow:0 25px 100px #0b132a70}dialog::backdrop{background:#101b2b99;backdrop-filter:blur(6px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:10px}dialog h2{font-size:25px;letter-spacing:-.7px;margin:4px 0 12px}.close-dialog{width:40px;height:40px;flex-shrink:0;border:1px solid #607080;background:#415161;border-radius:50%;font-size:26px;line-height:1}.dialog-copy,.rules-list{font-size:13px;color:#bfccd7;line-height:1.75}.rules-list{padding-left:20px}.rules-list li{padding-left:5px;margin:12px 0}.wide{width:100%;margin-top:20px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.eyebrow{font-size:9px;color:#c0afd9;letter-spacing:1.6px}.name-row{display:flex;gap:8px;margin:8px 0 18px}#record-form label{font-size:11px;color:#c6d3de}input{min-width:0;flex:1;border:1px solid #6c7b91;border-radius:10px;background:#273441;color:#fff;padding:11px 12px;font-size:14px}#final-score{font-size:65px;line-height:1.2;color:#e1ceff;font-weight:650;letter-spacing:-2px;margin:20px 0}#records-list{padding:0;list-style:none;counter-reset:place}#records-list li{counter-increment:place;display:flex;gap:12px;padding:12px 2px;border-bottom:1px solid #526170;font-size:13px}#records-list li:before{content:counter(place,decimal-leading-zero);color:#93a8bb;font-size:11px;min-width:22px}#records-list strong{margin-left:auto;color:#dec8ff;font-variant-numeric:tabular-nums}#record-saved{font-size:12px;color:#a5e6c9}#fullscreen-exit{position:fixed;right:16px;top:16px;z-index:10;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;border:1px solid #70849a}.game-focused .shariki-shell{height:100dvh;min-height:0;padding:8px}.game-focused .wp-topbar,.game-focused .wp-save-note,.game-focused .wp-footer{display:none}.game-focused .play-layout{padding:0}.game-focused .game-card{max-height:none;padding:16px}
@media(max-width:900px){.game-card{gap:0 15px;padding:16px;grid-template-columns:minmax(0,1fr) 170px}.rule-copy{font-size:11px}.wp-topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;height:auto;min-height:0;padding:3px 0;margin-bottom:6px}.header-game-title{position:static;transform:none;grid-column:1/-1;grid-row:2;justify-content:center;padding:5px 0 9px;font-size:21px}.wp-topbar .wp-brand{font-size:16px;letter-spacing:-.5px}.wp-tools{grid-column:2;grid-row:1}.wp-language{margin-right:16px}.wp-topbar .wp-brand .brand-icon{width:25px;height:25px;font-size:20px;margin-right:5px}}
@media(max-width:650px) and (orientation:portrait){.shariki-shell{padding:env(safe-area-inset-top) max(9px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(9px,env(safe-area-inset-left));min-height:490px}.play-layout{padding:0 0 5px}.game-card{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto 25px;padding:13px 10px 9px;border-radius:21px;gap:0}.score-panel{display:contents}.stats{grid-column:1;grid-row:1;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px;align-items:center;padding:1px 8px 10px;border-bottom:1px solid #53637455}.stat>span{font-size:8px;letter-spacing:1px;margin-bottom:4px}.stat strong{font-size:24px}.main-stat strong{font-size:33px;letter-spacing:-1px}.board-stage{grid-column:1;grid-row:2;padding:12px 0;min-height:0}#board-frame{padding:10px;border-radius:19px}.game-actions{grid-row:3;grid-column:1;display:grid;grid-template-columns:1.35fr 1fr auto;gap:7px;align-items:center}.primary-button,.secondary-button{font-size:11px;padding:11px 9px}.rules-button{font-size:10px;padding:8px 4px;max-width:62px}.rule-preview,.rule-copy{display:none}#game-status{grid-row:4;font-size:10px;margin:5px 0 0}.wp-save-note{font-size:9px;line-height:1.2;margin-bottom:5px}.wp-footer{font-size:9px;min-height:28px;padding:0}.wp-footer button{min-height:28px;padding:4px 0}.game-focused .game-card{padding:10px}.game-focused .stats{padding-right:45px}}
@media(orientation:landscape) and (max-height:550px){.shariki-shell{padding:0 12px;min-height:290px}.wp-topbar{display:flex;height:48px;min-height:48px;padding:0;margin:0}.header-game-title{position:static;transform:none;padding:0;width:auto;font-size:19px}.wp-topbar .wp-brand{font-size:14px}.wp-language{margin-right:12px}.play-layout{padding:7px 0}.game-card{grid-template-columns:minmax(0,1fr) 235px;grid-template-rows:minmax(0,1fr) 20px;padding:8px 15px;gap:0 16px;border-radius:19px}.score-panel{padding:5px 0}.stats{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:10px}.stat>span{font-size:8px;letter-spacing:.5px}.stat strong,.main-stat strong{font-size:25px;letter-spacing:-.5px}.rule-preview,.rule-copy{display:none}.game-actions{gap:6px;margin-top:16px;display:grid;grid-template-columns:1fr 1fr}.rules-button{grid-column:1/-1;min-height:28px;padding:4px}.primary-button,.secondary-button{padding:8px;font-size:10px;min-height:38px}.board-stage{padding:0}#board-frame{padding:10px;border-radius:18px}#game-status{font-size:9px;margin:0}.wp-save-note{display:none}.wp-footer{font-size:9px;min-height:24px;padding:0}.wp-footer button{min-height:24px;padding:0}}
.score-panel{padding:6px 0}.stats{gap:16px}.rule-preview{margin-top:20px}.rule-copy{margin-bottom:16px;line-height:1.6}
@media(max-width:650px) and (orientation:portrait){.stats{gap:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition:none!important}.wp-topbar .wp-brand .brand-icon{animation:none}}