:root{color-scheme:dark;font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;background:#03151f;color:#f5e6c1}*{box-sizing:border-box}body{margin:0;overflow:hidden;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer;color:inherit;user-select:none;-webkit-user-select:none;border:0}button:active{filter:brightness(.8)}button:focus-visible{outline:2px solid #8ef8ff;outline-offset:3px}button:disabled{opacity:.45;cursor:default}#viewport{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#game{width:390px;height:844px;position:absolute;overflow:hidden;transform-origin:center center;background:#05202e url('../assets/background.webp') center top/cover no-repeat;box-shadow:0 0 120px #23728940}#game.free{box-shadow:0 0 120px #eab84266}#game.free .ambient{background:linear-gradient(180deg,#7c430415,#46380830 36%,#071d29aa 71%,#051621)}.ambient{position:absolute;inset:0;background:linear-gradient(180deg,#071a2c00 12%,#05232c15 26%,#04151fc7 74%,#051621);pointer-events:none}#game>[id]{position:absolute;margin:0}.icon-button,.round-button{background:linear-gradient(150deg,#183e4e,#071b25);border:1px solid #af965b88;box-shadow:inset 0 1px #c9bc8a33,0 3px 9px #0007;border-radius:14px;color:#ebd9ad}.icon-button{font-size:28px}.round-button{font-size:25px}#auto{font-size:14px}#auto.active{border-color:#ffe8a0;background:#755522}#profile{display:flex;gap:8px;align-items:center}#avatar{border:1px solid #c8ad65;border-radius:50%;display:grid;place-items:center;width:36px;height:36px;font-size:17px;background:#173848;color:#c4fbff;overflow:hidden}#avatar img{width:100%;height:100%;object-fit:cover}#nickname{font-size:13px;display:block;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#modeLabel{font-size:10px;display:block;color:#86c5d1;margin-top:2px}#title{text-align:center;font-family:"Songti SC","STSong",serif;font-size:46px;letter-spacing:4px;color:#fff0b6;text-shadow:0 2px 0 #8f5923,0 4px 8px #000,0 0 18px #19ceec88;font-weight:900;line-height:1.1}#subtitle{text-align:center;font-size:12px;letter-spacing:6px;color:#aee6e9;text-shadow:0 2px 5px #000}#tide{padding:8px 13px;background:linear-gradient(90deg,#071c2fef,#0b3541dc,#071c2fef);border:1px solid #9f894c88;border-radius:12px;box-shadow:inset 0 1px #eee2a329,0 4px 14px #001019}.tide-head{display:flex;align-items:center;gap:10px;font-size:12px}.tide-head strong{color:#87f6ff;font-size:13px}.tide-head #freeLabel{margin-left:auto;font-size:10px;color:#a7c4c7}#pearlMeter{display:flex;gap:8px;padding-top:9px}#pearlMeter i{height:8px;flex:1;border-radius:6px;border:1px solid #61797b;background:#173a44}#pearlMeter i.filled{background:linear-gradient(#dbffff,#27becf);border-color:#c5ffff;box-shadow:0 0 8px #58dbec80}#boardCaption{display:flex;justify-content:space-between;align-items:center;padding:0 4px;font-size:12px;letter-spacing:1px;color:#dfc789}#roundLabel{font-size:10px;color:#9db9be;letter-spacing:0}#reels{border-radius:8px;outline:3px solid #b68c42;outline-offset:5px;box-shadow:0 0 0 6px #061923,0 0 0 8px #6d593b,0 8px 25px #0009}.net{background:linear-gradient(#183d4c,#092b3a);border:1px solid #608084;border-radius:9px;color:#9bbec7;font-size:12px;letter-spacing:2px}.net.selected{color:#defaff;border-color:#80f5fa;background:linear-gradient(#246976,#0b3647);box-shadow:0 0 12px #41c6e32c}.free .net.selected{color:#ffe7a1;border-color:#ffdd78}#result{display:flex;align-items:center;justify-content:center;text-align:center;color:#b3d1d3;font-size:12px;line-height:1.4;border-top:1px solid #ccb47c38;border-bottom:1px solid #ccb47c38}#result.won{color:#ffe1a0;font-size:22px;font-weight:700;text-shadow:0 0 15px #eab45266}.metric{border-radius:10px;background:linear-gradient(110deg,#0d3444,#0a202d);border:1px solid #8f815652;text-align:center;display:flex;flex-direction:column;justify-content:center}.metric span{font-size:10px;letter-spacing:2px;color:#8bbac5}.metric strong{font-size:19px;font-variant-numeric:tabular-nums;color:#ffe8ae;line-height:1.3}#spin{background:radial-gradient(ellipse at 40% 25%,#fff1ac,#e3b755 48%,#9b5b20 84%);border-radius:26px;border:2px solid #fff0ad;color:#473017;box-shadow:inset 0 0 0 4px #bb8f4180,0 4px 0 #614015,0 0 24px #f6c15630;font-weight:800}#spin span{display:block;font-size:24px;letter-spacing:3px;padding-left:3px}#spin small{display:block;font-size:10px;letter-spacing:4px;padding-left:4px;margin-top:1px}#spin.busy{background:radial-gradient(ellipse at 40% 25%,#bfefff,#43bfd2 48%,#187f9b 84%);color:#063344;border-color:#bdffff;box-shadow:inset 0 0 0 4px #5ebfce80,0 4px 0 #165266}.text-button{background:none;color:#96b6c0;font-size:11px;letter-spacing:3px;border:0}.loading{position:fixed;z-index:100;inset:0;background:radial-gradient(ellipse at 50% 35%,#154359,#03131d 70%);display:flex;flex-direction:column;align-items:center;justify-content:center}.loading img{width:142px;height:142px;border-radius:24px;box-shadow:0 0 50px #b8924038}.loading h2{font-size:30px;letter-spacing:7px;color:#ffe2a3;margin:24px 0 8px}.loading p{font-size:12px;color:#a1c4d0}.progress{margin:20px;width:min(70vw,280px);height:5px;border:1px solid #497f8c;border-radius:8px;overflow:hidden}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#37a9c4,#b5ffff)}#loadPercent{font-size:12px;color:#a2dbe4}#loadRetry{padding:12px 30px;margin-top:20px;border-radius:9px;background:#b5914d}#network{position:fixed;z-index:90;bottom:calc(env(safe-area-inset-bottom) + 14px);left:50%;transform:translateX(-50%);width:min(94vw,450px);padding:18px;background:#152d3ff5;border:1px solid #b79359;border-radius:16px;box-shadow:0 4px 40px #000;text-align:center}#network strong{display:block;font-size:13px;margin-bottom:12px}#network button{padding:10px 14px;background:#d7b967;color:#23323a;border-radius:8px;margin:3px}#network button:last-child{background:#244e5a;color:#d3e4e4}dialog{color:#e5eedf;background:linear-gradient(155deg,#103d4c,#071b2a);border:1px solid #a78c56;border-radius:18px;width:min(94vw,460px);max-height:82dvh;padding:0;box-shadow:0 12px 80px #000c}dialog::backdrop{background:#00121be3;backdrop-filter:blur(6px)}dialog header{display:flex;justify-content:space-between;align-items:center;padding:18px 20px 10px;border-bottom:1px solid #96845044;position:sticky;top:0;background:#10303f;z-index:2}dialog h2{font-size:20px;color:#ffe4a5;margin:0}#closeDialog{font-size:27px;line-height:1;background:none;color:#b2d1d7;width:36px;height:36px}#dialogBody{padding:18px 20px 24px;font-size:13px;line-height:1.8;overflow-wrap:anywhere}#dialogBody h3{font-size:15px;color:#f1d69d;margin:20px 0 8px}#dialogBody h3:first-child{margin-top:0}#dialogBody p{margin:7px 0}#dialogBody .muted{color:#93b7c1;font-size:11px}.tabs{display:flex;gap:7px;margin-bottom:18px}.tabs button{background:#113e50;border:1px solid #627878;border-radius:8px;padding:7px 12px;font-size:12px}.tabs button.active{background:#a38243;color:#fff0ca}.pay-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}.pay-table th{color:#a8c9d0;font-size:12px}.pay-table td,.pay-table th{text-align:center;border-bottom:1px solid #64909b33;padding:7px 0}.symbol{display:inline-block;width:55px;height:55px;background-image:var(--symbol-atlas,url('../assets/symbols.webp'));background-size:300% 300%;vertical-align:middle}.special{display:flex;gap:12px;align-items:center;margin:14px 0}.special .symbol{flex-shrink:0}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:15px 0}.setting-row input[type=range]{width:60%;accent-color:#e5c772}.setting-row input[type=checkbox]{width:23px;height:23px;accent-color:#e5c772}.action{padding:11px 18px;background:#d0ab5c;color:#15313e;border-radius:9px;margin:6px}.history-row{padding:12px 0;border-bottom:1px solid #68889644}.history-row small{color:#93b1b8;font-size:10px}.ways-drawing{width:100%;height:146px;background:#061f2c;border:1px solid #687763;border-radius:10px}.history-empty{text-align:center;padding:24px}#viewport:fullscreen{background:#03151f}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){dialog::backdrop{backdrop-filter:none}}

/* 用户指定：主游戏几何锁定；按钮底板30%不透明度，内容保持清晰。 */
#game [data-geometry-locked="true"]{position:absolute!important;left:var(--geometry-x)!important;top:var(--geometry-y)!important;width:var(--geometry-width)!important;height:var(--geometry-height)!important;transform:var(--geometry-transform)!important;transform-origin:0 0}
#game :is(.round-button,.net,.text-button,.metric,#spin){isolation:isolate;background:transparent;box-shadow:none;border-color:transparent;--panel-background:linear-gradient(150deg,#183e4e,#071b25);--panel-border:#af965b;--panel-shadow:inset 0 1px #c9bc8a66,0 3px 9px #0007}
#game :is(.round-button,.net,.text-button,.metric,#spin)::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--panel-background);border:1px solid var(--panel-border);box-shadow:var(--panel-shadow);opacity:var(--control-panel-opacity,.30);pointer-events:none}
#game .text-button{border-radius:8px;--panel-background:linear-gradient(150deg,#183e4e,#071b25);--panel-border:#af965b}
#game .metric{--panel-background:linear-gradient(110deg,#0d3444,#0a202d);--panel-border:#8f8156}
#game .net{--panel-background:linear-gradient(#183d4c,#092b3a);--panel-border:#608084}
#game .net.selected{--panel-background:linear-gradient(#246976,#0b3647);--panel-border:#80f5fa;--panel-shadow:0 0 12px #41c6e366}
#game.free .net.selected{--panel-border:#ffdd78}
#game #auto.active{--panel-background:#755522;--panel-border:#ffe8a0}
#game #spin{--panel-background:radial-gradient(ellipse at 40% 25%,#fff1ac,#e3b755 48%,#9b5b20 84%);--panel-border:#fff0ad;--panel-shadow:inset 0 0 0 4px #bb8f4180,0 4px 0 #614015,0 0 24px #f6c15630}
#game #spin.busy{--panel-background:radial-gradient(ellipse at 40% 25%,#bfefff,#43bfd2 48%,#187f9b 84%);--panel-border:#bdffff;--panel-shadow:inset 0 0 0 4px #5ebfce80,0 4px 0 #165266}

/* 玩法册使用与盘面相同的独立透明图标，图像本身不依赖背景定位。 */
.rule-icon{display:inline-block;width:64px;height:64px;object-fit:contain;vertical-align:middle;flex:0 0 64px;filter:drop-shadow(0 3px 8px #0005)}
.treasure-icons{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;padding:10px 0;border-bottom:1px solid #967d4944}
.treasure-icons .rule-icon{width:100%;height:auto;aspect-ratio:1}
.pay-table .rule-icon{width:58px;height:58px}.pay-table td{font-size:12px;white-space:nowrap}
.pay-formula{padding:10px 12px;border:1px solid #b89b5555;border-radius:8px;background:#8a72321c;color:#ffe3a3;font-weight:600}
.pay-example,.lore-icons{display:flex;align-items:center;justify-content:center;gap:10px}.pay-example span{color:#6fcfda}
#dialogBody .lore{margin-top:26px;padding-top:18px;border-top:1px solid #c8a86266}
#dialogBody .lore h3{text-align:center;letter-spacing:2px;margin:8px 0 16px}
#dialogBody .lore p{line-height:2;margin:12px 0;color:#bed1d6}
#dialogBody .lore .lore-end{text-align:center;color:#f4d79a;letter-spacing:1px;margin-top:18px}

/* 资料区子元素独立定位，头像不继承昵称的几何锁定。 */
#profile #avatar{position:absolute;margin:0}#profile #nickname,#profile #modeLabel{margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.2}
#profile #nickname{line-height:18px}
/* 标题下移后压紧进度条留白，保留盘面与操作区位置。 */
#tide{padding:4px 13px}#tide .tide-head{line-height:18px}#pearlMeter{padding-top:5px}

/* 固定页面根层；游戏手势不触发整页平移或边界回弹。弹窗独立纵向滚动。 */
html{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
#viewport,#loading,#network{touch-action:none;overscroll-behavior:none}
#viewport img,#loading img{-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
#dialog{overflow-x:hidden;overflow-y:auto;overscroll-behavior:none;touch-action:pan-y}
#dialog input[type="range"]{touch-action:none}

/* 背景覆盖整个视口，游戏内容按可见边界统一等比放大。 */
#viewport,#viewport:fullscreen{overflow:hidden;background:#05202e url('../assets/background.webp') center top/cover no-repeat}
#game,#game.free{left:0;top:0;background:none;box-shadow:none;overflow:visible;transform-origin:0 0}
#viewport>.ambient{background:linear-gradient(180deg,#071a2c00 12%,#05232c15 26%,#04151f40 74%,#0516214d)}
#viewport.free .ambient{background:linear-gradient(180deg,#7c430415,#46380830 36%,#071d2940 71%,#0516214d)}
#game #spin{--control-panel-opacity:1;opacity:1!important}