.back-top[data-v-cb70614e]{right:12px;bottom:calc(var(--nav-h) + env(safe-area-inset-bottom,0px) + 16px);z-index:45;width:40px;height:40px;color:var(--muted);border:1px solid var(--border);background:#fffffff5;border-radius:50%;place-items:center;display:grid;position:fixed;box-shadow:0 2px 10px #0000001f}.back-top svg[data-v-cb70614e]{width:20px;height:20px}.back-top[data-v-cb70614e]:active{background:#f2f3f5}@media (width>=1024px){.back-top[data-v-cb70614e]{width:46px;height:46px;transition:color .15s,border-color .15s;bottom:28px;right:28px}.back-top[data-v-cb70614e]:hover{color:var(--green);border-color:var(--green)}.back-top svg[data-v-cb70614e]{width:22px;height:22px}}.pc-header[data-v-5dd94aee]{z-index:50;border-bottom:1px solid var(--line);background:#fff;display:none;position:sticky;top:0;box-shadow:0 1px 4px #0000000a}.pc-header-inner[data-v-5dd94aee]{max-width:var(--app-w);height:var(--pc-head-h);align-items:center;gap:24px;margin:0 auto;padding:0 16px;display:flex}.pc-brand[data-v-5dd94aee]{flex:none;align-items:center;gap:9px;display:flex}.pc-logo[data-v-5dd94aee]{color:#fff;background:var(--green);border-radius:9px;flex:none;place-items:center;width:34px;height:34px;font-size:17px;font-weight:800;display:grid}.pc-brand-text b[data-v-5dd94aee]{color:var(--ink);letter-spacing:.04em;font-size:18px;font-weight:800;line-height:1.15;display:block}.pc-brand-text small[data-v-5dd94aee]{color:var(--muted);letter-spacing:.06em;margin-top:1px;font-size:11px;display:block}.pc-nav[data-v-5dd94aee]{flex:1;align-self:stretch;align-items:stretch;min-width:0;display:flex}.pc-nav-item[data-v-5dd94aee]{color:var(--ink);white-space:nowrap;align-items:center;padding:0 14px;font-size:15px;font-weight:600;transition:background .15s,color .15s;display:flex;position:relative}.pc-nav-item[data-v-5dd94aee]:hover{background:var(--green-soft);color:var(--green-dark)}.pc-nav-item.on[data-v-5dd94aee]{color:var(--green);font-weight:800}.pc-nav-item.on[data-v-5dd94aee]:after{content:"";background:var(--green);border-radius:3px 3px 0 0;height:3px;position:absolute;bottom:0;left:12px;right:12px}.pc-year[data-v-5dd94aee]{color:var(--green);background:var(--green-soft);border-radius:999px;flex:none;padding:5px 12px;font-size:13px;font-weight:700}.pc-subbar[data-v-5dd94aee]{border-top:1px solid var(--line);background:#fff}.pc-subbar-inner[data-v-5dd94aee]{max-width:var(--app-w);justify-content:space-between;align-items:center;margin:0 auto;padding:9px 16px;display:flex}.pc-subbar-inner b[data-v-5dd94aee]{color:var(--ink);font-size:15px}.pc-subbar-inner a[data-v-5dd94aee]{color:var(--green);cursor:pointer;font-size:13px;font-weight:700}@media (width>=1024px){.pc-header[data-v-5dd94aee]{display:block}}.share-overlay[data-v-bb9fe87c]{z-index:120;padding:16px 12px;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));padding-top:calc(16px + env(safe-area-inset-top,0px));background:#0009;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.share-sheet[data-v-bb9fe87c]{overscroll-behavior:contain;color:#202a22;background:#fff;border-radius:18px;width:100%;max-width:460px;max-height:100%;padding:20px;font-size:17px;line-height:1.6;overflow:auto}.share-heading[data-v-bb9fe87c]{justify-content:space-between;align-items:center;gap:10px;display:flex}.share-heading h2[data-v-bb9fe87c]{margin:0;font-size:21px}.share-heading button[data-v-bb9fe87c]{color:#303b32;background:#edf1ed;border-radius:8px;min-height:44px;padding:6px 14px;font-size:16px;font-weight:700}.share-title[data-v-bb9fe87c]{color:#5c655d;overflow-wrap:anywhere;margin:10px 0}.wechat-guide[data-v-bb9fe87c]{margin:12px 0 16px}.share-primary[data-v-bb9fe87c],.share-system[data-v-bb9fe87c]{border-radius:10px;width:100%;min-height:50px;padding:10px;font-size:18px;font-weight:700;display:block}.share-primary[data-v-bb9fe87c]{color:#fff;background:#087f42}.share-system[data-v-bb9fe87c]{color:#18532b;background:#edf5ee;margin-top:10px}.share-sheet button[data-v-bb9fe87c]:disabled{color:#56645a;background:#e6ebe7}.share-link-label[data-v-bb9fe87c]{color:#606b62;margin:16px 0 6px;font-size:15px;display:block}.share-sheet input[data-v-bb9fe87c]{color:#293c2c;background:#f6faf6;border:1px solid #bacbbb;border-radius:8px;width:100%;min-height:46px;padding:10px;font-size:16px}.share-status[data-v-bb9fe87c]{color:#246339;overflow-wrap:anywhere;min-height:28px;margin:10px 0 0;font-size:16px}@media (width>=768px){.share-overlay[data-v-bb9fe87c]{align-items:center}}:root{--bg:#f7f8fa;--card:#fff;--ink:#323233;--text:#333;--muted:#646566;--hint:#969799;--line:#ebedf0;--border:#dcdee0;--green:#07c160;--green-dark:#06ad56;--green-soft:#e8f8ef;--red:#ee0a24;--wave-red:#ee0a24;--wave-blue:#1989fa;--wave-green:#07c160;--radius:10px;--nav-h:56px;--bar-h:48px;--app-w:480px;--font:-apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font);color:var(--text);-webkit-tap-highlight-color:transparent;background:#ebedf0;font-size:16px;line-height:1.5}a{color:inherit;text-decoration:none}button{font-family:inherit;font-size:inherit;cursor:pointer;background:0 0;border:none}img{max-width:100%;display:block}ul{list-style:none}.app{max-width:var(--app-w);background:var(--bg);min-height:100vh;padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom,0px) + 12px);margin:0 auto;position:relative;box-shadow:0 0 24px #0000000f}.topbar{z-index:30;min-height:var(--bar-h);border-bottom:1px solid var(--line);background:#fff;justify-content:space-between;align-items:center;padding:8px 14px;display:flex;position:sticky;top:0}.topbar-title{letter-spacing:.06em;color:var(--ink);font-size:20px;font-weight:800;line-height:1.2}.topbar-title small{color:var(--muted);letter-spacing:.08em;margin-top:1px;font-size:12px;font-weight:500;display:block}.year-pill{color:var(--green);background:var(--green-soft);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:700}.page{padding:12px 12px 8px}.page.air{padding:14px 14px 8px}.page.tight{padding:8px 10px}.card{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);margin-bottom:12px;padding:14px 14px 12px}.card.draw{border:1px solid var(--green)}.card.draw.compact{margin-bottom:10px;padding:10px 12px 8px}.card-hd{justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:10px;display:flex}.card-hd h2{color:var(--green);font-size:17px;font-weight:800}.card-hd .sub{color:var(--muted);flex:none;font-size:13px}.pred-hd{align-items:center;gap:10px;margin-bottom:12px;display:flex}.pred-hd img{object-fit:cover;background:var(--green-soft);border-radius:50%;width:44px;height:44px}.pred-hd .seal{background:var(--green);color:#fff;border-radius:50%;flex:none;place-items:center;width:44px;height:44px;font-size:18px;font-weight:800;display:grid}.pred-hd h2{color:var(--ink);font-size:18px;font-weight:800;line-height:1.2}.pred-hd p{color:var(--muted);margin-top:2px;font-size:13px}.hint{color:var(--hint);text-align:center;margin-top:8px;font-size:12px}.lottery-tabs{gap:6px;margin-bottom:10px;display:flex}.lottery-tab{border:1px solid var(--border);border-radius:var(--radius);text-align:center;min-width:0;color:var(--ink);background:#fff;flex:1;padding:8px 4px 6px}.lottery-tab b{letter-spacing:.02em;overflow-wrap:anywhere;font-size:15px;display:block}.lottery-tab span{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:11px;display:block;overflow:hidden}.lottery-tab.on{background:var(--green);border-color:var(--green);color:#fff}.lottery-tab.on span{color:#fff}.balls{grid-template-columns:repeat(6,minmax(0,1fr)) .32fr minmax(0,1fr);gap:4px;max-width:620px;margin:0 auto;padding:6px 0 0;display:grid;container-type:inline-size}.balls.without-special{grid-template-columns:repeat(var(--normal-count), minmax(0, 1fr))}.ball-col{flex-direction:column;align-items:center;gap:8px;min-width:0;display:flex}.ball{--ball-wave:#c8c9cc;aspect-ratio:1;background:var(--ball-wave);color:#666;width:100%;max-width:80px;box-shadow:none;border-radius:50%;place-items:center;font-family:Arial,sans-serif;font-size:clamp(16px,4.8vw,40px);font-weight:800;line-height:1;display:grid;position:relative}.ball:before{content:"";pointer-events:none;background:#fff;border-radius:50%;width:82%;height:82%;position:absolute;top:6%;left:7%}.ball-code{place-items:center;display:grid;position:absolute;inset:6% 11% 12% 7%}.ball:after{content:"";pointer-events:none;background:#fff;border-radius:50%;width:19%;height:9%;position:absolute;bottom:14.5%;right:9.5%;transform:rotate(-48deg)}.ball.red{--ball-wave:#ff343b}.ball.blue{--ball-wave:#339aff}.ball.green{--ball-wave:#0bc843}.ball-attrs{color:#333;white-space:nowrap;font-size:clamp(12px,2.7vw,19px);font-weight:400;line-height:1.3}.plus-col{aspect-ratio:.32;color:#999;align-self:start;place-items:center;font-size:clamp(18px,3vw,26px);font-weight:400;display:grid}.draw.compact .balls{max-width:400px}.draw.compact .ball{max-width:48px;font-size:clamp(16px,4.8vw,24px)}.draw.compact .ball-attrs{font-size:13px}@supports (font-size:1cqi){.ball{font-size:clamp(16px,6.4cqi,40px)}.draw.compact .ball{font-size:clamp(16px,6.4cqi,24px)}}.countdown{border-top:1px solid var(--line);justify-content:space-between;align-items:center;margin-top:10px;padding-top:10px;font-size:14px;display:flex}.cd-num{color:var(--red);font-variant-numeric:tabular-nums;font-size:17px;font-weight:800}.hist-link{text-align:center;color:var(--green);border-top:1px solid var(--line);margin-top:8px;padding-top:8px;font-size:15px;font-weight:700;display:block}.sx-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.sx-tile{background:var(--green-soft);text-align:center;border-radius:8px;padding:8px 4px 6px}.sx-tile img{object-fit:cover;border-radius:8px;width:52px;height:52px;margin:0 auto 4px;display:block}.sx-tile b{color:var(--ink);font-size:13px;font-weight:700;line-height:1.2;display:block}.sx-tile span{display:none}.sx-row{gap:6px;display:flex}.sx-row .sx-tile{flex:1;padding:10px 2px 8px}.sx-row .sx-tile b{font-size:22px}.ma24{grid-template-columns:repeat(6,1fr);justify-items:center;gap:8px 6px;display:grid}.nball{background:#fff;border:2.5px solid #c8c9cc;border-radius:50%;place-items:center;width:36px;height:36px;font-size:13px;font-weight:800;display:grid}.nball.red{border-color:var(--wave-red)}.nball.blue{border-color:var(--wave-blue)}.nball.green{border-color:var(--wave-green)}.ma24.mini{gap:6px 4px}.ma24.mini .nball{border-width:2px;width:28px;height:28px;font-size:11px}.feat-grid{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);grid-template-columns:repeat(4,1fr);gap:12px 4px;margin-bottom:12px;padding:16px 6px 14px;display:grid}.feat{color:var(--ink);flex-direction:column;align-items:center;gap:6px;font-size:13px;font-weight:600;display:flex;position:relative}.feat-ico{color:#fff;letter-spacing:.02em;border-radius:50%;place-items:center;width:44px;height:44px;font-size:13px;font-weight:800;display:grid}.feat:first-child .feat-ico{background:#07c160}.feat:nth-child(2) .feat-ico{background:#1989fa}.feat:nth-child(3) .feat-ico{background:#ff976a}.feat:nth-child(4) .feat-ico{background:#ee0a24}.feat:nth-child(5) .feat-ico{background:#7232dd}.feat:nth-child(6) .feat-ico{background:#00c9c9}.feat:nth-child(7) .feat-ico{background:#ffb300}.feat:nth-child(8) .feat-ico{background:#07c160}.feat:nth-child(9) .feat-ico{background:#1989fa}.feat:nth-child(10) .feat-ico{background:#ee0a24}.feat:nth-child(11) .feat-ico{background:#ff976a}.feat:nth-child(12) .feat-ico{background:#646566}.feat.soon{color:var(--muted);font-weight:500}.feat.soon .feat-ico{opacity:.72}.badge-soon{color:var(--hint);border:1px solid var(--border);background:#fff;border-radius:4px;padding:2px 4px;font-size:9px;font-weight:700;line-height:1;position:absolute;top:-4px;right:2px}.sec-title{color:var(--ink);justify-content:space-between;align-items:center;margin:2px 2px 10px;font-size:17px;font-weight:800;display:flex}.sec-title a,.sec-title span{color:var(--green);font-size:13px;font-weight:600}.poster-grid{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px;display:grid}.poster{border-radius:var(--radius);background:var(--card);border:1px solid var(--line);overflow:hidden}.poster-art{background:#eef1f4;height:118px;overflow:hidden}.poster-art img{object-fit:cover;width:100%;height:100%}.poster-cap{padding:9px 10px 11px}.poster-cap .t{color:var(--ink);font-size:15px;font-weight:800}.poster-cap .s{color:var(--muted);margin-top:2px;font-size:12px}.poster-grid.big .poster-art{height:168px}.poster-grid.big .poster-cap .t{font-size:16px}.poster-grid.triple{grid-template-columns:1fr 1fr 1fr;gap:8px}.poster-grid.triple .poster-art{height:96px}.poster-grid.triple .poster-cap{padding:7px 6px 9px}.poster-grid.triple .t{font-size:13px}.year-chips{gap:8px;margin-bottom:10px;display:flex}.chip{border:1px solid var(--border);color:var(--ink);background:#fff;border-radius:999px;padding:7px 16px;font-size:14px;font-weight:600}.chip.on{background:var(--green);border-color:var(--green);color:#fff}.post-list{margin-bottom:8px}.post-item{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);margin-bottom:8px;padding:14px 14px 12px;display:block}.post-item h3{margin-bottom:4px;font-size:16px;font-weight:800}.post-item p{color:var(--muted);font-size:13px}.post-item .tag{background:var(--green-soft);color:var(--green-dark);border-radius:999px;margin-top:8px;padding:2px 8px;font-size:12px;font-weight:600;display:inline-block}.strip{grid-template-columns:1fr;gap:10px;margin-bottom:12px;display:grid}.strip .card{margin-bottom:0}.foot-note{text-align:center;color:var(--muted);padding:10px 12px 6px;font-size:13px;line-height:1.6}.bottom-nav{width:100%;max-width:var(--app-w);height:calc(var(--nav-h) + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);z-index:40;background:#fff;grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 -2px 8px #0000000f}.nav-item{color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:12px;display:flex}.nav-item svg{width:22px;height:22px}.nav-item.on{color:var(--green);font-weight:800}.home-live-entry{color:var(--ink);border-radius:var(--radius);background:#fff;border:1px solid #ffd6da;align-items:center;gap:10px;margin-bottom:10px;padding:10px 12px;display:flex}.home-live-icon{color:#fff;background:var(--red);border-radius:50%;flex:none;place-items:center;width:38px;height:38px;padding-left:2px;font-size:14px;display:grid}.home-live-entry>span:nth-child(2){flex:1;min-width:0}.home-live-entry b{font-size:15px;display:block}.home-live-entry small{color:var(--muted);margin-top:1px;font-size:11px;display:block}.home-live-entry em{color:var(--red);font-size:13px;font-style:normal;font-weight:700}.home-program-entry{border-color:#c9e6ff}.home-program-icon{background:#1677ff}.home-program-entry em{color:#1677ff}.search-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);align-items:center;gap:6px;margin-bottom:10px;padding:0 4px 0 10px;display:flex}.search-box>svg{width:18px;height:18px;color:var(--hint);flex:none}.search-box input{min-width:0;color:var(--ink);background:0 0;border:none;outline:none;flex:1;padding:10px 0;font-family:inherit;font-size:16px}.search-box input::-webkit-search-cancel-button{display:none}.search-clear{width:24px;height:24px;color:var(--hint);flex:none;font-size:18px;line-height:1}.search-go{color:#fff;background:var(--green);border-radius:7px;flex:none;margin:4px;padding:7px 14px;font-size:14px;font-weight:700}.load-error{text-align:center;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:12px;padding:32px 16px}.load-error p{color:var(--muted);margin-bottom:12px;font-size:14px}.load-error button{color:var(--green);border:1px solid var(--green);background:#fff;border-radius:999px;padding:9px 26px;font-size:14px;font-weight:700}.skeleton{background:#eef0f2;border-radius:6px;position:relative;overflow:hidden}.skeleton:after{content:"";background:linear-gradient(90deg,#0000,#ffffffbf,#0000);animation:1.3s ease-in-out infinite skeleton-sweep;position:absolute;inset:0;transform:translate(-100%)}.skeleton-line{height:12px;margin-bottom:7px}.skeleton-line:last-child{width:62%;margin-bottom:0}.skeleton-line.short{width:38%}.skeleton-line.tall{height:18px;margin-top:8px}.skeleton-balls{border-radius:8px;height:40px;margin-top:10px}.poster-art.skeleton{border-radius:0}@keyframes skeleton-sweep{to{transform:translate(100%)}}@media (prefers-reduced-motion:reduce){.skeleton:after{animation:none}}.toast{color:#fff;opacity:0;pointer-events:none;z-index:140;white-space:nowrap;background:#323233eb;border-radius:8px;padding:10px 16px;font-size:14px;transition:all .2s;position:fixed;bottom:88px;left:50%;transform:translate(-50%)translateY(12px)}.toast.show{opacity:1;transform:translate(-50%)translateY(0)}@media (width<=360px){.feat{font-size:12px}.sx-tile img{width:30px;height:30px}}.marquee{border-radius:var(--radius);border:1px solid var(--line);background:#fff;align-items:center;height:36px;margin-bottom:10px;font-size:13px;display:flex;overflow:hidden}.marquee-ico{text-align:center;width:32px;color:var(--green);flex:none;font-weight:800}.marquee-track{white-space:nowrap;flex:1;overflow:hidden}.marquee-track span{color:var(--muted);padding-right:64px;animation:16s linear infinite mq;display:inline-block}@keyframes mq{0%{transform:translate(0)}to{transform:translate(-50%)}}.draw-meta{justify-content:space-between;align-items:center;gap:6px;margin-bottom:10px;font-size:13px;display:flex}.draw-meta b{color:var(--green);font-size:15px;font-weight:800}.draw-meta .cd-wrap{color:var(--muted)}.draw-meta em{color:var(--red);font-variant-numeric:tabular-nums;font-style:normal;font-weight:800}.draw-meta a{color:var(--green);flex:none;font-weight:700}.next-line{color:var(--red);text-align:center;margin-top:8px;font-size:13px}.feat-grid.cols-5{grid-template-columns:repeat(5,1fr);gap:12px 0;padding:14px 2px 12px}.feat-grid.cols-5 .feat{font-size:11px;font-weight:600}.feat-grid.cols-5 .feat-ico{width:40px;height:40px;font-size:11px}html{scroll-behavior:smooth}#six,#code24,#gallery,#draw{scroll-margin-top:56px}.year-row{scrollbar-width:none;gap:4px;padding:2px 0 10px;display:flex;overflow-x:auto}.year-row::-webkit-scrollbar{display:none}.year-item{text-align:center;min-width:0;color:var(--muted);flex:1;font-size:11px;line-height:1.25}.year-item .dot{background:var(--green);border-radius:50%;width:42px;height:42px;margin:0 auto 6px}.year-item.bw .dot{background:#c8c9cc}.year-item.on{color:var(--ink);font-weight:700}.year-item.on .dot{box-shadow:0 0 0 2px #fff, 0 0 0 4px var(--green)}.series-row{scrollbar-width:none;gap:8px;padding-bottom:10px;display:flex;overflow-x:auto}.series-row::-webkit-scrollbar{display:none}.series-row .chip{flex:none;padding:6px 12px;font-size:13px}.waterfall{column-count:2;column-gap:10px;margin-bottom:12px}.waterfall .poster{break-inside:avoid;vertical-align:top;width:100%;margin-bottom:10px;display:inline-block}.waterfall .poster-art{height:auto}.waterfall .h-tall{aspect-ratio:3/4.15}.waterfall .h-mid{aspect-ratio:3/3.45}.waterfall .h-short{aspect-ratio:3/3.05}.waterfall.bw img{filter:grayscale()contrast(1.05)}.feat-grid.cols-5 .feat-ico{letter-spacing:0}.year-item .dot{display:block}.year-item{flex-direction:column;align-items:center;display:flex}.icon-btn{width:36px;height:36px;color:var(--ink);background:0 0;border:none;border-radius:50%;flex:none;place-items:center;display:grid}.icon-btn:active{background:#f2f3f5}.icon-btn svg{width:22px;height:22px}.lottery-tab.active{background:var(--green);border-color:var(--green);color:#fff}.lottery-tab.active span{color:#fff}.lottery-tab-name{font-size:17px;font-weight:700;display:block}.lottery-tab-date{color:var(--muted);margin-top:2px;font-size:12px;font-weight:400;display:block}.lottery-tab.on .lottery-tab-name,.lottery-tab.on .lottery-tab-date,.lottery-tab.active .lottery-tab-name,.lottery-tab.active .lottery-tab-date{color:#fff}.chip.active{background:var(--green);border-color:var(--green);color:#fff;font-weight:600}.chip-row{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.nav-item.active{color:var(--green);font-weight:800}.muted{color:var(--muted);font-size:14px}.hidden{display:none!important}.empty{text-align:center;color:var(--muted);padding:32px 12px;font-size:15px}.foot-note a{color:var(--green)}.ball.rolling{color:#969799;background:#f2f3f5;border-color:#dcdee0}.ball.special{box-shadow:0 1px 2px #00000014}.hist-card{padding:12px 14px}.hist-card .meta{color:var(--muted);justify-content:space-between;margin-bottom:10px;font-size:14px;display:flex}.hist-card .meta b{color:var(--green);font-size:16px}.tabs{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);margin-bottom:12px;padding:4px;display:flex}.tab{text-align:center;color:var(--muted);background:0 0;border:none;border-radius:6px;flex:1;padding:9px;font-size:15px}.tab.active,.tab.on{background:var(--green-soft);color:var(--green);font-weight:700}.date-row{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);justify-content:space-between;align-items:center;margin-bottom:8px;padding:14px 16px;display:flex}.date-row .d{font-size:16px;font-weight:700}.date-row .p{color:var(--muted);font-size:14px}.post-item .tags{gap:6px;margin-top:8px;display:flex}.article{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);padding:16px}.article h1{margin-bottom:8px;font-size:20px;font-weight:700;line-height:1.35}.article .by{color:var(--muted);margin-bottom:14px;font-size:14px}.article p{color:var(--text);margin-bottom:12px;font-size:16px}.table-wrap{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);margin-bottom:12px;overflow:hidden}table.stat{border-collapse:collapse;width:100%;font-size:14px}table.stat th{background:var(--bg);text-align:center;color:var(--ink);border-bottom:1px solid var(--line);padding:10px 4px;font-weight:700}table.stat td{text-align:center;border-top:1px solid var(--line);padding:9px 4px}table.stat tr:nth-child(2n) td{background:#fafafa}.wave-r{color:var(--wave-red);font-weight:700}.wave-b{color:var(--wave-blue);font-weight:700}.wave-g{color:var(--wave-green);font-weight:700}.hot{color:var(--red);font-weight:700}.cold{color:var(--wave-blue)}.admin-banner{background:var(--green-soft);color:var(--green-dark);border-radius:var(--radius);margin-bottom:12px;padding:10px 12px;font-size:14px}.form-row{margin-bottom:12px}.form-row label{color:var(--muted);margin-bottom:6px;font-size:14px;display:block}.form-row input[type=text],.form-row input[type=number],.form-row input[type=datetime-local],.form-row select,.form-row textarea{border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--ink);background:#fff;outline:none;padding:10px 12px;font-size:16px}.form-row input:focus,.form-row textarea:focus,.form-row select:focus{border-color:var(--green)}.nums-grid{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.nums-grid.cols-6{grid-template-columns:repeat(6,1fr)}.nums-grid .sp{grid-column:4}.xiao-grid{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.btn{border-radius:var(--radius);border:none;justify-content:center;align-items:center;width:100%;padding:13px;font-size:16px;font-weight:700;display:inline-flex}.btn-primary{background:var(--green);color:#fff}.btn-primary:active{background:var(--green-dark)}.btn-ghost{color:var(--ink);border:1px solid var(--border);background:#fff;margin-top:8px}.form-err{color:var(--red);min-height:18px;margin-bottom:8px;font-size:14px}.form-ok{color:var(--green);margin-bottom:8px;font-size:14px}label.chip{cursor:pointer;align-items:center;gap:4px;display:inline-flex}label.chip input{accent-color:var(--green)}label.chip:has(input:checked){background:var(--green);border-color:var(--green);color:#fff;font-weight:600}.nums-grid input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.nums-grid input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.nums-grid input[type=number]{-moz-appearance:textfield;text-align:center}.poster{cursor:pointer}.poster-art img{object-position:center 30%}.poster.tone-bw img{filter:grayscale()contrast(1.08)}#xuanji{scroll-margin-top:56px}@media (width>=481px){body{background:#ebedf0}}.switch-row{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}#xuanjiGrid .poster:nth-child(2) img{object-position:72% 38%}#xuanjiGrid .poster:nth-child(3) img{object-position:18% 62%}#xuanjiGrid .poster:nth-child(4) img{object-position:80% 18%}:root{--pc-head-h:60px}.pc-only{display:none}@media (width>=768px) and (width<=1023px){:root{--app-w:640px}.poster-grid{grid-template-columns:repeat(3,1fr)}.poster-art{height:150px}.waterfall{column-count:3}}@media (width>=1024px){:root{--app-w:1180px}body{background:#f0f2f5}.app{max-width:var(--app-w);min-height:0;box-shadow:none;background:0 0;padding:0 16px 48px}.topbar,.bottom-nav{display:none}.pc-only{display:block}.page,.page.air,.page.tight{padding:18px 0 0}#six,#code24,#gallery,#draw,#xuanji{scroll-margin-top:calc(var(--pc-head-h) + 16px)}.home-cols{grid-template-columns:minmax(0,1fr) 300px;align-items:start;gap:16px;display:grid}.home-main{order:1;min-width:0}.home-side{top:calc(var(--pc-head-h) + 16px);flex-direction:column;order:2;gap:10px;display:flex;position:sticky}.home-side .home-live-entry{margin-bottom:0}.card{padding:16px 18px 14px}.marquee{height:40px;font-size:14px}.sec-title{margin-bottom:12px;font-size:18px}.foot-note{padding:18px 12px 6px}.lottery-tabs{gap:10px;margin-bottom:14px}.lottery-tab{cursor:pointer;flex:0 190px;padding:10px 8px 8px;transition:border-color .15s,background .15s}.lottery-tab:hover:not(.on):not(.active){border-color:var(--green);color:var(--green-dark)}.lottery-tab b{font-size:16px}.chip{cursor:pointer;transition:border-color .15s,color .15s}.chip:hover:not(.on):not(.active){border-color:var(--green);color:var(--green-dark)}.btn-ghost{cursor:pointer;width:auto;min-width:220px;margin:16px auto 0;display:block}.btn-ghost:hover{border-color:var(--green);color:var(--green-dark)}.draw-meta{font-size:14px}.draw-meta b{font-size:18px}.draw-meta em{font-size:16px}.draw-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.draw-list .card{margin-bottom:0}.forecast-cols{grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:14px;margin-bottom:14px;display:grid}.forecast-cols .card{margin-bottom:0}.sx-tile{padding:12px 6px 10px}.sx-tile img{width:64px;height:64px}.sx-tile b{font-size:15px}.ma24{gap:10px 8px}.nball{width:42px;height:42px;font-size:15px}.poster-grid,.poster-grid.triple,.poster-grid.big{grid-template-columns:repeat(4,1fr);gap:14px}.poster-art,.poster-grid.triple .poster-art,.poster-grid.big .poster-art{height:220px}.poster-grid.triple .poster-cap{padding:9px 10px 11px}.poster-grid.triple .t{font-size:15px}.poster{transition:border-color .15s,box-shadow .15s,transform .15s}.poster:hover{border-color:var(--green);transform:translateY(-2px);box-shadow:0 6px 18px #00000014}.waterfall{column-count:4;column-gap:14px}.post-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.post-item{margin-bottom:0;transition:border-color .15s,box-shadow .15s}.post-item:hover{border-color:var(--green);box-shadow:0 4px 14px #0000000f}.search-box{max-width:460px}.search-box input{font-size:15px}.load-error{padding:48px 16px}.load-error button{cursor:pointer;transition:background .15s,color .15s}.load-error button:hover{color:#fff;background:var(--green)}.post-article{max-width:860px;margin:0 auto;padding:28px 32px}.post-article .post-para{font-size:16px;line-height:1.9}.table-wrap{max-width:900px;margin-left:auto;margin-right:auto}table.stat{font-size:15px}table.stat th{padding:12px 6px}table.stat td{padding:11px 6px}.toast{bottom:40px}}@media (width>=1400px){.poster-grid,.poster-grid.triple,.poster-grid.big{grid-template-columns:repeat(5,1fr)}.waterfall{column-count:5}}:where(button,a,input):focus-visible{outline-offset:3px;outline:3px solid #177943}.bottom-nav .nav-item{min-height:56px;font-size:14px}.lottery-tab{min-height:52px}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* === H5 LOCK === */
/* ============================================================
   ---------- 18. H5锁定层（PC 上也显示 H5 界面） ----------
   ============================================================
   用户要求：「将这个项目都设置为 h5 项目，pc 端打开也是 h5 界面」。

   【原站为桌面做了三件事，全部要压掉】
   1) @media (width>=1024px) 里有一个 3035 字节的大块，
      覆盖了 .app / .page / .home-cols / .home-side / .card /
      .lottery-tab / .draw-meta / .post-list / .draw-list 等几乎所有布局。
   2) 同断点里 :root{--app-w:1180px}，容器变成 1180px 宽。
   3) 桌面专属元素：.pc-header（顶部导航）、.pc-only（右侧栏）
      在 >=1024px 时display:block。

   【实现方式：全部用 !important】
   不用选择器权重去赌：原站规则在各自的@media 里，
   而本层不加媒体查询 → 本层条件更少特异性相同、
   又写在文件末尾。按 CSS 规范已经能赢，
   但 !important 是唯一可靠保证（Vue 的 scope 属性权重也不稳定）。

   【不用 meta viewport=width=device-width 之外的办法】
   桌面浏览器不会因为 viewport meta 而缩放，
   所以必须在 CSS 层面把容器压回移动宽度并居中。

   【--app-w 改480px 而不是固定 px】
   480 是原站 H5 的设计宽度（:root 默认值），
   用变量而不是硬编码 width，以后想调宽只改一处。
   ------------------------------------------------------------ */

/* ---- ① 根变量：容器宽度压回 H5 宽度 ---- */
:root {
  --app-w: 480px !important;
  /* 桌面锁定后不再需要桌面顶栏的占位高度 */
  --pc-head-h: 0px !important;
}

/* ---- ② 页面底色：H5 是纯白，桌面灰底会透出边框 ----
   【关键坑：不要在这里写 overflow-x: hidden】
   Safari 的实现里，overflow-x:hidden 会**连带把 overflow-y 也算成 auto**，
   于是<html> 变成滚动容器（Chrome 不会）。
   一旦 html 成为滚动容器，`position:fixed` 的定位参照物就从
   「视口」变成「这个滚动容器」——底部导航会跟着文档滚走，
   滚到哪儿它就在哪儿，等于「不固定」。

   症状：Chrome/Edge headless 一切正常（探针实测
   bottom-nav y=807 h=56 display=grid，五项全对），
   只有 Safari 响应式模式下看不到底部导航。
   ——浏览器差异，测不出来，只能靠知识排除。

   横向滚动本来也不会发生（.app 已 max-width 限定 + margin auto），
   所以这里去掉它没有任何损失。 */
html,
body {
  background: var(--bg) !important;
}

/* ---- ③ 主容器：居中 + 居顶，不吃桌面灰底 ---- */
.app {
  max-width: var(--app-w) !important;
  width: 100% !important;
  margin: 0 auto !important;
  /* 桌面端保留手机那样的圆角+ 投影，明确"这是手机界面" */
  border-radius: 0 !important;
  box-shadow: none !important;
  background: var(--bg) !important;
  min-height: 100vh !important;
  padding-bottom: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px) + 12px) !important;
}

/* ---- ④ 隐藏桌面专属元素 ---- */
/* 桌面顶部导航（H5 用底部导航） */
.pc-header,
.pc-subbar {
  display: none !important;
}
/* 桌面右侧栏（quick-card 等，H5 上不存在这个位置） */
.pc-only {
  display: none !important;
}
/* 桌面悬浮回到顶部按钮（H5 有底部导航，不需要） */
.back-top {
  display: none !important;
}
/* 顶部 tabbar：H5 下本来就是隐藏的，
   这里显式压住，防止桌面断点把它打开 */
.topbar {
  display: none !important;
}

/* ---- ④b 恢复被桌面断点误隐藏的 H5 底部导航 ----
   桌面断点里有 .topbar,.bottom-nav{display:none} —— 它以为
   PC 用顶部 pc-header，于是把 H5 的底部导航也一起藏了。
   PC 上要显示 H5 界面，就必须把它恢复成 grid。 */
.bottom-nav {
  display: grid !important;
}

/* ---- ⑤ 复位被宽屏断点改过的布局 ----
   下面每一条都对应 @media (width>=1024px) 里的一条规则，
   逐条压回H5 值。新增宽屏规则时这里也要同步补。 */

/* 容器 padding：桌面是 0 16px 48px，H5 改成「左右 0 + 底部留出导航高度」。
   【别把 padding-bottom 也归零】底部导航是 fixed，不占文档流，
   若不预留，页面最后一屏的内容会被导航压住 56px。
   原站就是 calc(--nav-h + safe-area + 12px)，这里照抄 H5 值。 */
.app {
  padding: 0 0 calc(var(--nav-h) + env(safe-area-inset-bottom, 0px) + 12px) !important;
}

/* 顶部 Tab 栏：桌面是固定 190px 不伸缩，H5 仍是三等分 */
.lottery-tabs {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  margin-bottom: 12px !important;
  padding: 2px 2px 6px !important;
  margin-inline: -2px !important;
}
.lottery-tab {
  flex: 1 1 0 !important;
  min-width: 92px !important;
  width: auto !important;
  padding: 9px 6px 8px !important;
  text-align: center !important;
}
.lottery-tab b {
  font-size: clamp(13px, 4.4vw, 16px) !important;
}

/* 首页两栏：桌面是 home-side 右侧栏并排，H5 必须单栏 */
.home-cols,
.home-main,
.home-side {
  display: block !important;
  min-width: 0 !important;
  width: 100% !important;
}
/* 侧栏在 H5 上不占位 */
.home-side {
  display: none !important;
}

/* 页面容器 */
.page,
.page.air,
.page.tight {
  max-width: 100% !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
}
/* 桌面给锚点预留了顶栏高度，H5 没有顶栏 */
#six,
#code24,
#gallery,
#draw,
#xuanji {
  scroll-margin-top: 12px !important;
}

/* 底部导航：桌面端变成横向一条，H5 恢复固定在底部。

   【Safari 加固：为什么不能只靠 position:fixed】
   Safari（尤其响应式设计模式）有两个已知行为会让fixed 导航失效：
     1) 祖先元素上的 overflow:hidden/auto 会让该祖先成为
        fixed 的**包含块**，导航就跟着文档滚走而非钉在视口。
        → 已在 ② 里去掉 html/body 的 overflow-x:hidden。
     2) 响应式模式下 100vh 不等于可见高度（地址栏/工具条占位），
        若导航高度或定位依赖 vh，就会算错位置。
        → 这里全部改用 bottom:0 + 实际像素，不掺 vh。

   底部再加一条 safe-area 内边距，保证在有小黑条的机型上
   图标不会被压住。 */
/* 【第五轮修正：不要用 left:50% + translateX(-50%)】
   实测数据（440 窄视口）：
     nav rect left=-8 right=488 w=480      ← 宽 480 超出可见宽度
     → 右侧「开奖」被裁掉，用户看到的就像「没有导航」
   而 633 宽时同一份 CSS 完全正常（480 < 633）。
   根因：left:50% + translateX(-50%) 靠「包含块宽度」算居中基点，
   而 position:fixed 的包含块会被祖先的 transform / filter /
   视口缩放等因素改变，窄屏下算出来就偏了。

   改用【左右贴合】：left:0 / right:0 + width:auto + margin:auto。
   这样宽度直接等于包含块的左右边之差 —— 视口窄就窄、宽就宽，
   超过 480 时由 margin:auto 居中。几何上与包含块宽度无关，
   任何视口都不会越界。 */
.bottom-nav {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  width: auto !important;
  max-width: var(--app-w) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  /* 不再需要 transform 参与居中 */
  transform: none !important;
  top: auto !important;
  bottom: 0 !important;
  z-index: 60 !important;
  /* 不设 height / min-height —— 由内容与 --nav-h 决定，
     避免响应式模式下 vh 参与计算 */
}

/* Safari：给导航本体也补 safe-area，
   这样有底部小黑条的机型上图标不会被压住。 */
.bottom-nav,
nav.bottom-nav {
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
}

/* 公告条 */
.marquee {
  height: auto !important;
  font-size: 13px !important;
}

/* 卡片圆角与阴影：H5 更轻 */
.card {
  border-radius: 14px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .05) !important;
}

/* 期号字号：桌面 18px 在 480 宽里会挤爆单行 */
.draw-meta b {
  font-size: clamp(14px, 3.8vw, 15.5px) !important;
}

/* 列表：桌面两列，H5 单列 */
.draw-list,
.post-list {
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  display: grid !important;
}
.forecast-cols {
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

/* 图库瀑布流：桌面多列，H5 双列 */
.waterfall {
  column-count: 2 !important;
}
.poster-grid {
  grid-template-columns: repeat(2, 1fr) !important;
}
.poster-art {
  height: 130px !important;
}

/* 文章与表格：桌面加宽，H5 恢复通栏 */
.post-article {
  max-width: 100% !important;
  padding: 14px 14px !important;
}
.table-wrap {
  max-width: 100% !important;
}

/* 号码球 */
.nball {
  width: 34px !important;
  height: 34px !important;
  font-size: 14px !important;
}

/* 悬浮提示位置 */
.toast {
  bottom: calc(var(--nav-h) + 16px) !important;
}

/* 减少动画偏好下，锁定层里的 transition 也一并关掉 */
@media (prefers-reduced-motion: reduce) {
  .app,
  .bottom-nav,
  .lottery-tabs,
  .lottery-tab {
    transition: none !important;
  }
}

/* ============================================================
   ---------- 18b. 页面级桌面规则复位 ----------
   ============================================================
   【为什么单独一段】上面的 ① ~ ⑤ 只覆盖了全局 CSS 里的
   @media (width>=1024px)。但各页面还有**自己独立的** CSS 文件
   （Home/Live/Mine/Programs/PostDetail/Gallery/stats...），
   里面也有桌面断点规则，且分属不同组件、选择器带各自的 scope。

   【关键：这里的选择器故意不带 [data-v-*]】
   原站规则是  .replay-grid[data-v-5ed5e48a] { grid-template-columns:repeat(4,1fr) }
   本层若写  .replay-grid { ... !important }，
   特异性虽低但**带 !important**，按CSS 规范一定赢。
   反过来若这里也加 scope，两边 scope 不同，永远匹配不到。

   【完整性】下面每条都对应某个页面 CSS 的 >=1024px 断点规则。
   由 _tools/scan_desktop_rules.py 扫出来，新增时同步补。
   ------------------------------------------------------------ */

/* ---- Live 开奖直播 ---- */
/* 桌面：.replay-grid 4 列、卡片 900px 宽、字号放大 */
.replay-grid {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
}
.live-card {
  max-width: 100% !important;
  margin: 0 0 12px !important;
}
.live-head {
  padding: 12px 14px !important;
}
.live-head h1 {
  font-size: 17px !important;
}
.live-meta {
  padding: 10px 12px !important;
  font-size: 13px !important;
}
.replay-item b {
  padding: 8px 9px 2px !important;
  font-size: 13px !important;
}
.replay-item small {
  padding: 0 9px 9px !important;
  font-size: 11px !important;
}
.replay-dialog-card {
  width: 100% !important;
}
.live-help {
  max-width: 100% !important;
  margin: 0 !important;
}
.replay-more {
  max-width: 100% !important;
}

/* ---- Programs 栏目 ---- */
/* 桌面：.program-grid 4 列 */
.program-grid {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
}
.program-cap {
  padding: 8px 9px 9px !important;
}
.program-cap b {
  font-size: 13px !important;
}
.program-cap small {
  font-size: 11px !important;
}
.upcoming-card {
  padding: 12px 14px !important;
}
.program-dialog-card {
  width: 100% !important;
}

/* ---- Mine 我的收藏 ---- */
/* 桌面：两列 */
.mine-list {
  grid-template-columns: 1fr !important;
}

/* ---- PostDetail 文章详情 ---- */
/* 桌面：标题 26px、通栏 860px、正文 18px */
.post-title {
  margin-bottom: 8px !important;
  font-size: 20px !important;
}
.post-sub {
  margin-bottom: 12px !important;
  padding-bottom: 10px !important;
  font-size: 12px !important;
}
.post-article .post-para {
  font-size: 15px !important;
}

/* ---- Gallery 图库（>=768px 就已变化）---- */
/* 桌面：预览面板 8 列、max-width 560px */
.pp-grid {
  grid-template-columns: repeat(4, 1fr) !important;
}
.pp-sheet {
  max-width: 100% !important;
  border-radius: 14px !important;
}
/* 图片查看器工具条：桌面限宽 640px 居中 */
.viewer-tools,
.viewer-turn {
  max-width: 100% !important;
}
/* 桌面给查看器加了上下大片留白 */
.viewer-stage:not(.reading) {
  padding: 24px 0 !important;
}

/* ---- 桌面 hover 效果在触屏上无意义，一并去掉 ----
   触屏的 :hover 会「粘住」，点完不松手就一直高亮。 */
@media (hover: none) {
  .replay-item:hover,
  .program-item:hover,
  .post-item:hover,
  .poster:hover,
  .mine-item:hover,
  .search-box input:hover {
    border-color: inherit !important;
    box-shadow: none !important;
    transform: none !important;
  }
}

/* ============================================================
   ---------- 18c. 图库页紧凑化 ----------
   ============================================================
   用户反馈：「图库页看着太乱了，空白处太多」。

   【诊断：探针 dump .page 直接子元素得到的真实结构】
     [0] div.lottery-tabs  h=65  新香港 / 澳彩 / 港彩
     [1] div.chip-rowh=30  「2026」                    ← 用户要求删
     [2] div.gallery-period-actions h=30  看最新一期 / 找往期
     [3] div.chip-row      h=61  全部期号 280期 279期…  ← 用户要求删
     [4] div.series-choice h=60  「看哪个栏目？」        ← 用户要求删
         [0] div.series-choice-heading  看哪个栏目？+ 更多栏目↓
         [1] div.chip-row.series-options 看图抓码/ 客家娘…  ← 保留
     [5] div.poster-grid    h=2653  图片
     [6] button.btn-ghost   加载更多

   【用户要求删除的三块】
     - 「2026」那一行        -> .page > .chip-row:nth-child(2)
     - 「全部期号…」整行    -> .page > .chip-row:nth-child(4)
     - 「看哪个栏目？」标题  -> .series-choice-heading
     （栏目胶囊 .series-options 保留，见 18c-④）

   【为什么用 nth-child 而不是类名】
   页面里有**三个** .chip-row（2026 行、期号行、栏目胶囊），
   类名完全相同，只能靠位置区分。
   nth-child 序号会随 DOM 变化失效，所以下面加了注释与
   定期核对的断言（verify_h5_lock.py 的 [H5-9] 组）。

   【剩下的结构】
   彩种 Tab -> 两个快捷按钮 -> 栏目胶囊 -> 图片。
   筛选区从 5 块降到 3 块，首屏能完整露出 2 行图片。

   【横滚的实现要点】
   overflow-x:auto + flex-wrap:nowrap + 滚动条隐藏 +
   scroll-snap 让切换有吸附感。
   ------------------------------------------------------ */

/* ---- ① 两个大按钮：压扁 ---- */
.gallery-period-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin: 6px 0 !important;
}
.gallery-period-actions button {
  /* 探针实测按钮已是 h=24，不要再加高 —— 只收紧水平内边距与字号 */
  min-height: 30px !important;
  padding: 0 10px !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
}

/* ---- ② 期号区：单行横滚 ----
   【真实类名是 .chip-row，我踩了两次坑】
   源码 Gallery-CYa2UZga.css 里写的是 .period-step，
   但运行时那个容器**根本没有这个 class**。
   探针 dump `.page` 的直接子元素才看到真相：
     [3] div.chip-rowh=72 kids=7← 期号区就是它
   我前两版分别写成 .period-step 和 .period-actions，
     整块规则全打在空类上，页面毫无变化。

   该区实际 DOM: div.chip-row > button.chip * 7
     （6 个期号 + 「全部期号」）
   用的是全局 .chip-row{flex-wrap:wrap}，所以折成两行、高 72px。
   改成 nowrap + overflow-x:auto 即省掉一行的 34px。 */
.chip-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  margin-bottom: 6px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-x: contain !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
}
.chip-row::-webkit-scrollbar {
  display: none !important;
}
/* 该行同时也是「彩种 Tab」和「栏目胶囊」的公共容器，
   三个区都用同一套横滚语法，这里统一处理。 */
.chip-row > * {
  flex: none !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12.5px !important;
  scroll-snap-align: start !important;
  white-space: nowrap !important;
}
/* 「当前期」原本 flex:1 占满整行、窄屏还 order:-1 独占一行 */
.chip-row .period-current {
  flex: none !important;
  flex-basis: auto !important;
  order: 0 !important;
}

/* ---- ③ 栏目选择：去卡片感，与其他筛选区同级 ---- */
.series-choice {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
}
.series-choice-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  /* 原来 44px 高的大按钮，占一整行 */
  margin-bottom: 4px !important;
}
.series-choice-heading b {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--muted) !important;
}
.series-choice-heading button {
  min-height: 26px !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  background: var(--green-soft) !important;
  border: 1px solid #b7e6cd !important;
}

/* ---- ④ 栏目胶囊 ----
   .series-options 的父容器 .series-choice-heading 是 flex，
   它内部就是一组 .chip。上面的 .chip-row > * 规则已统一处理，
   这里只需把 .series-options 本身变成横滚容器。 */
.series-options {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior-x: contain !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
}
.series-options::-webkit-scrollbar {
  display: none !important;
}
.series-options .chip {
  flex: none !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12.5px !important;
  scroll-snap-align: start !important;
  white-space: nowrap !important;
}

/* ---- ⑤ 图片网格：紧跟筛选区，缩小间距 ---- */
.poster-grid {
  gap: 8px !important;
  margin-bottom: 8px !important;
}
.poster-grid .poster-cap {
  padding: 8px 9px 9px !important;
}
.poster-grid .poster-cap .t {
  font-size: 14px !important;
  margin-bottom: 3px !important;
}
.poster-grid .poster-cap .s {
  font-size: 11.5px !important;
}
.poster-grid .open-picture {
  margin-top: 4px !important;
  font-size: 13px !important;
}

/* ---- ⑥ 空态提示别占太多空间 ---- */
.page .hint {
  margin: 8px 0 !important;
  font-size: 12.5px !important;
}

/* ============================================================
   ---------- 18d. 图库页：按要求删除三块筛选 ----------
   ============================================================
   用户要求：「2026 这行删除，全部期号 这行删除，
   看哪个栏目? 更多栏目 都删除」。

   【用 nth-child 的原因】页面里有三个 .chip-row，
   类名一模一样（都来自同一个组件），只能按位置区分：
     nth-child(2) = 「2026」
     nth-child(4) = 「全部期号 280期 …」
     .series-options = 栏目胶囊（保留）
   nth-child 序号会随 DOM 增删而漂移，
   所以 verify_h5_lock.py 里加了对应断言，DOM 一变就会报 FAIL。

   【为什么用 display:none 而不是改 Vue 渲染】
   压缩 bundle 里做条件渲染改动风险过高（本项目已吃过多次亏），
   且这些区块可能别处还要用（期号行隐藏后仍可通过
   「看最新一期 / 找往期」与左右切换期号）。
   ------------------------------------------------------------ */

/* 删「2026」行 */
.page > .chip-row:nth-child(2) {
  display: none !important;
}

/* 删「全部期号 280期 279期 …」整行 */
.page > .chip-row:nth-child(4) {
  display: none !important;
}

/* 删「看哪个栏目？」标题 + 「更多栏目↓」按钮 */
.series-choice-heading {
  display: none !important;
}

/* 删完之后 .series-choice 只剩胶囊行，
   外层不再需要额外留白 —— margin / padding 归零。 */
.series-choice {
  margin: 0 0 8px !important;
  padding: 0 !important;
}

/* 栏目胶囊行现在就是 .page 的直接筛选区，
   给一点上边距与前一个区块拉开距离 */
.page > .series-options,
.page > .series-choice .series-options {
  margin-top: 2px !important;
}

/* 顶部彩种 Tab 与下方内容拉开一点（原来靠被删的 2026 行占位） */
.page > .lottery-tabs {
  margin-bottom: 10px !important;
}

/* ── 底部导航列数自适应（隐藏「现场」后为 4 项）─────────────
   原站样式把 .bottom-nav 写死 repeat(5,1fr)，隐藏一项后 4 个图标
   会挤在左侧 4/5 宽度里。改为按实际子项自动平分：
   以后导航项增减（live_enabled 等开关）都不用再改 CSS。 */
.bottom-nav {
  grid-template-columns: none !important;
  grid-auto-flow: column !important;
  grid-auto-columns: 1fr !important;
}

/* 4 项时每格更宽：图标与文字稍微放大，间距更舒展 */
.bottom-nav .nav-item {
  min-height: 56px !important;
  font-size: 14px;
  gap: 3px !important;
}
.bottom-nav .nav-item svg {
  width: 24px;
  height: 24px;
}

/* ── 底部导航：彩色按钮化 ──────────────────────────────
   每个 tab 一个主题色：图标坐在浅色圆角底上（App 按钮质感）；
   选中项 = 实色底 + 白图标 + 上浮投影，一眼看出当前页。
   色板沿用站内既有语义色：首页绿 / 图库蓝 / 资料橙 / 开奖红。 */
.bottom-nav .nav-item:nth-child(1) { --nav-c: #07c160; --nav-c-soft: rgba(7, 193, 96, .12);  --nav-c-shadow: rgba(7, 193, 96, .30); }
.bottom-nav .nav-item:nth-child(2) { --nav-c: #1989fa; --nav-c-soft: rgba(25, 137, 250, .12); --nav-c-shadow: rgba(25, 137, 250, .30); }
.bottom-nav .nav-item:nth-child(3) { --nav-c: #ff8f3d; --nav-c-soft: rgba(255, 143, 61, .14); --nav-c-shadow: rgba(255, 143, 61, .32); }
.bottom-nav .nav-item:nth-child(4) { --nav-c: #ee0a24; --nav-c-soft: rgba(238, 10, 36, .10);  --nav-c-shadow: rgba(238, 10, 36, .28); }

/* 彩色圆角按钮（图标底座） */
.bottom-nav .nav-item svg {
  width: 40px !important;
  height: 30px;
  padding: 3px 8px;
  box-sizing: border-box;
  color: var(--nav-c);
  background: var(--nav-c-soft);
  border-radius: 10px;
  transition: background .15s, color .15s, transform .15s, box-shadow .15s;
}

/* 文字颜色跟随主题色（未选中稍淡） */
.bottom-nav .nav-item {
  color: var(--nav-c);
  opacity: .62;
  transition: opacity .15s;
}
.bottom-nav .nav-item.on {
  color: var(--nav-c);
  opacity: 1;
  font-weight: 800;
}

/* 选中：实色按钮 + 白图标 + 上浮投影 */
.bottom-nav .nav-item.on svg {
  color: #fff;
  background: var(--nav-c);
  transform: translateY(-3px);
  box-shadow: 0 4px 10px var(--nav-c-shadow);
}

/* 触屏不粘 hover 态（与站内 @media(hover:none) 纪律一致） */
@media (hover: none) {
  .bottom-nav .nav-item svg { transition: none; }
}

/* ── 底部导航：iOS 液态玻璃风格 ─────────────────────
   参考 iOS 26 TabBar：毛玻璃底、细分隔线、未选中系统灰、
   选中项是一枚白色浮起胶囊 + 系统蓝图标（#007AFF）。 */
.bottom-nav {
  background: rgba(249, 249, 251, .78) !important;
  -webkit-backdrop-filter: saturate(180%) blur(22px) !important;
  backdrop-filter: saturate(180%) blur(22px) !important;
  box-shadow: 0 -0.5px 0 rgba(60, 60, 67, .22) !important;
}

/* 未选中：iOS 系统灰，无底色 */
.bottom-nav .nav-item {
  color: #86868b !important;
  opacity: 1 !important;
  font-size: 12px !important;
  gap: 2px !important;
  margin: 7px 5px !important;
  border-radius: 18px !important;
  background: none !important;
  box-shadow: none !important;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease !important;
}
.bottom-nav .nav-item svg {
  width: 25px !important;
  height: 25px !important;
  padding: 0 !important;
  background: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: inherit !important;
  transform: none !important;
  transition: none !important;
}

/* 选中：白色胶囊浮起 + 系统蓝 */
.bottom-nav .nav-item.on {
  color: #007aff !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .10), 0 0 0 .5px rgba(60, 60, 67, .10) !important;
}

@media (hover: none) {
  .bottom-nav .nav-item,
  .bottom-nav .nav-item svg { transition: none !important; }
}

/* ── 图库查看器：沉浸式重设计 ──────────────────────
   纯黑沉浸 + 打开缩放动画；顶部只留页码胶囊与三枚毛玻璃圆钮；
   底部一枚毛玻璃胶囊工具条（翻页图标化），点图收起/显示按钮的逻辑保留。 */
.viewer {
  background: #000 !important;
  animation: gvIn .22s ease !important;
}
@keyframes gvIn {
  from { opacity: 0; transform: scale(.975); }
  to   { opacity: 1; transform: scale(1); }
}
.viewer-stage img {
  animation: gvImg .3s ease;
}
@keyframes gvImg {
  from { opacity: .25; transform: scale(.97); }
  to   { opacity: 1; transform: none; }
}

/* 页码：顶部居中毛玻璃胶囊 */
.viewer-count {
  position: absolute !important;
  top: 14px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 6;
  background: rgba(28, 28, 30, .58) !important;
  color: #fff !important;
  font-size: 12px !important;
  padding: 4px 13px !important;
  border-radius: 999px !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: .06em;
}

/* 顶部按钮：右上角三枚圆形毛玻璃图标钮（拖动提示隐藏，手势天然支持） */
.viewer-bar {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  z-index: 6;
  display: flex !important;
  gap: 8px !important;
  background: none !important;
  padding: 0 !important;
}
.viewer-bar .viewer-drag { display: none !important; }
.viewer-bar button {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  border: none !important;
  background: rgba(28, 28, 30, .55) !important;
  color: #fff !important;
  font-size: 0 !important;
  position: relative !important;
  cursor: pointer;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}
.viewer-bar button::before {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  font-size: 16px !important;
  font-style: normal !important;
}
.viewer-bar button:nth-of-type(2)::before { content: '☆'; font-size: 17px !important; }
.viewer-bar button:nth-of-type(3)::before { content: '⤴'; font-size: 15px !important; }
.viewer-bar .viewer-close::before { content: '✕'; font-size: 15px !important; }

/* 底部工具条：居中悬浮毛玻璃胶囊，翻页图标化 */
.viewer-footer {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  transform: translateX(-50%) !important;
  z-index: 6;
  width: auto !important;
  background: none !important;
  padding: 0 !important;
}
.viewer-tools {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px !important;
  background: rgba(28, 28, 30, .58) !important;
  border-radius: 999px !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: 0 6px 22px rgba(0, 0, 0, .38) !important;
}
.viewer-tools button {
  height: 32px !important;
  min-width: 32px !important;
  padding: 0 11px !important;
  border: none !important;
  border-radius: 999px !important;
  background: none !important;
  color: #fff !important;
  font-size: 12px !important;
  white-space: nowrap;
  cursor: pointer;
}
.viewer-tools button:active { background: rgba(255, 255, 255, .15) !important; }
.viewer-footer button:nth-of-type(1),
.viewer-footer button:nth-of-type(3) {
  font-size: 0 !important;
  width: 34px !important;
  padding: 0 !important;
  position: relative !important;
}
.viewer-footer button:nth-of-type(1)::before {
  content: '‹'; font-size: 22px; position: absolute !important; inset: 0;
  display: grid !important; place-items: center;
}
.viewer-footer button:nth-of-type(3)::before {
  content: '›'; font-size: 22px; position: absolute !important; inset: 0;
  display: grid !important; place-items: center;
}

/* 查看器必须盖过底部导航（H5 修补层把底栏 z 设了 9999，toast 才 140） */
.viewer { z-index: 10000 !important; }

/* ── 图库查看器：详情页模式（参考 49278tk）────────────
   亮色阅读底 + 顶部标题栏 + 同系列期数横滑导航（custom.js 注入 .pv-*）。
   覆盖黑沉浸版：背景、页码胶囊、翻页按钮（期数条取代 ‹ ›）。 */
.viewer {
  background: #eef0f4 !important;
  animation: gvIn .22s ease !important;
  overflow-y: auto !important;
}

/* 隐藏被替代的元素：页码胶囊、返回✕（用顶部「‹ 返回」）、footer 翻页钮 */
.viewer-count,
.viewer-bar .viewer-close,
.viewer-footer button:nth-of-type(1),
.viewer-footer button:nth-of-type(3) { display: none !important; }

/* 图片区：白卡 + 圆角阴影（阅读感） */
.viewer-stage {
  padding: 12px 12px 96px !important;
  box-sizing: border-box !important;
}
.viewer-stage img {
  background: #fff !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 18px rgba(20, 30, 25, .10) !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
}

/* 顶部标题栏（custom.js 注入 .pv-top） */
.pv-top {
  position: sticky !important;
  top: 0 !important;
  z-index: 6 !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 10px !important;
  background: rgba(255, 255, 255, .88) !important;
  -webkit-backdrop-filter: saturate(180%) blur(18px) !important;
  backdrop-filter: saturate(180%) blur(18px) !important;
  box-shadow: 0 .5px 0 rgba(60, 60, 67, .18) !important;
}
.pv-back {
  flex: none !important;
  height: 32px !important;
  padding: 0 12px 0 8px !important;
  border: none !important;
  border-radius: 999px !important;
  background: rgba(7, 193, 96, .10) !important;
  color: #06ad56 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  cursor: pointer;
}
.pv-title {
  color: var(--ink) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}
.pv-sub {
  flex: none !important;
  margin-left: auto !important;
  color: #06ad56 !important;
  background: var(--green-soft) !important;
  border-radius: 999px !important;
  padding: 3px 10px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

/* 期数横滑导航条 */
.pv-chips {
  position: sticky !important;
  top: 48px !important;
  z-index: 5 !important;
  display: flex !important;
  gap: 8px !important;
  padding: 9px 12px !important;
  overflow-x: auto !important;
  background: rgba(255, 255, 255, .88) !important;
  -webkit-backdrop-filter: saturate(180%) blur(18px) !important;
  backdrop-filter: saturate(180%) blur(18px) !important;
  box-shadow: 0 .5px 0 rgba(60, 60, 67, .12) !important;
  scrollbar-width: none;
}
.pv-chips::-webkit-scrollbar { display: none !important; }
.pv-chip {
  flex: none !important;
  height: 30px !important;
  padding: 0 14px !important;
  border: 1px solid var(--border) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--ink) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.pv-chip.on {
  background: var(--green) !important;
  border-color: var(--green) !important;
  color: #fff !important;
}

/* 收藏/分享圆钮下移到标题栏下方，✕ 已隐藏 */
.viewer-bar {
  top: 60px !important;
  flex-direction: column !important;
}
.viewer-bar .viewer-close { display: none !important; }


/* 期数条左侧「往期」标签 */
.pv-chips-hint {
  flex: none !important;
  align-self: center !important;
  color: var(--muted) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  padding-right: 2px !important;
}

/* 查看器在桌面断点也锁 H5 宽度（480 居中，不随 --app-w 变 1180）。
   ⚠ 必须显式给 width：viewer 原生是 fixed+left/right:0 撑满，
   锁宽后 right:auto 但不给 width 会收缩成内容宽（实测 257px），
   两侧漏出底层页面——就是用户截图里的破版。 */
.viewer {
  width: 100vw !important;
  max-width: 480px !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  box-shadow: 0 0 40px rgba(0, 0, 0, .35) !important;
}
/* 480 列两侧的暗色遮罩：盖住底层页面，观感为全屏弹层（层叠在 viewer 内部，垫底） */
.viewer::before {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  background: rgba(12, 15, 19, .62) !important;
  z-index: -1 !important;
}
@keyframes gvIn {
  from { opacity: 0; transform: translateX(-50%) scale(.975); }
  to   { opacity: 1; transform: translateX(-50%) scale(1); }
}

/* viewer 自身是滚动容器：absolute 的悬浮件会随内容滚走，一律改 fixed
   （fixed 相对视口居中 = 480 列中心，与 viewer 对齐） */
.viewer-footer { position: fixed !important; }
.viewer-bar { position: fixed !important; }

/* 详情模式顶栏/往期条：不透明白，防止下层内容透出造成「漏页」观感 */
.pv-top { background: #ffffff !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.pv-chips { background: #ffffff !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }