:root{--bg:#f4f7fb;--card:#fff;--text:#162033;--muted:#718096;--blue:#246bfd;--blue2:#0d47a1;--red:#e43c32;--green:#20a36a;--line:#e6ebf2;--shadow:0 10px 30px rgba(24,39,75,.08)}
*{box-sizing:border-box} body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text)}
button{font:inherit}.app-shell{max-width:540px;margin:0 auto;min-height:100vh;padding-bottom:88px}.topbar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:16px 18px;background:rgba(244,247,251,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(230,235,242,.7)}
.brand{font-weight:800;font-size:19px}.subtitle{font-size:11px;color:var(--muted);margin-top:3px}.icon-btn{border:0;background:var(--card);width:38px;height:38px;border-radius:12px;box-shadow:var(--shadow)}
main{padding:14px}.page{display:none}.page.active{display:block}.card{background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}
.hero{padding:24px;background:linear-gradient(145deg,#0b3b94,#1457c8 55%,#0f8fc7);color:#fff;overflow:hidden;position:relative}.hero:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.08);right:-70px;top:-80px}.hero-kicker{font-size:12px;opacity:.8}.hero h1{font-size:32px;line-height:1.15;margin:12px 0 10px}.hero p{margin:0;opacity:.85}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}.hero-stats div{padding:12px;background:rgba(255,255,255,.12);border-radius:16px}.hero-stats strong{display:block;font-size:22px}.hero-stats span{display:block;font-size:10px;opacity:.82;margin-top:4px}
.section-head{display:flex;align-items:center;justify-content:space-between;margin:22px 4px 10px}.section-head h2{font-size:17px;margin:0}.muted{color:var(--muted);font-size:12px}.latest-card{padding:18px;display:flex;align-items:center;justify-content:space-between;gap:12px}.balls{display:flex;gap:8px;flex-wrap:wrap}.ball{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;border:3px solid rgba(255,255,255,.75);box-shadow:inset 0 -5px 10px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.12)}.ball.red{background:var(--red)}.ball.blue{background:#2f6fc2}.ball.green{background:#2c9a5f}.special-wrap{display:flex;align-items:center;gap:8px;white-space:nowrap}.special-wrap span{font-size:11px;color:var(--muted)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.action-card{padding:18px;text-align:left;border:none;color:inherit}.action-card .emoji{font-size:24px;display:block;margin-bottom:12px}.action-card b{display:block}.action-card small{display:block;color:var(--muted);margin-top:6px;line-height:1.4}.picker-card{padding:18px}.picker-tabs{display:flex;background:#f0f3f8;border-radius:12px;padding:3px;width:max-content}.seg{border:0;background:transparent;padding:8px 12px;border-radius:9px;color:var(--muted)}.seg.active{background:#fff;color:var(--blue);font-weight:700;box-shadow:0 2px 8px rgba(0,0,0,.07)}.pick-balls{margin:18px 0}.pick-actions{display:flex;justify-content:flex-end}.primary{border:0;background:var(--blue);color:white;padding:11px 18px;border-radius:12px;font-weight:700}.fineprint{font-size:11px;color:var(--muted);line-height:1.55;margin-bottom:0}
.page-title{display:flex;align-items:center;gap:12px;margin:4px 0 16px}.page-title h2{margin:0;font-size:22px}.page-title p{margin:3px 0 0;color:var(--muted);font-size:12px}.back{border:0;background:var(--card);width:38px;height:38px;border-radius:12px;font-size:28px;line-height:1}.focus-card{display:flex;align-items:center;gap:16px;padding:18px}.focus-ball{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:32px;font-weight:800}.focus-ball.red{background:var(--red)}.badge{display:inline-block;font-size:10px;padding:5px 8px;border-radius:999px}.badge.danger{background:#fff0ef;color:#c9302c}.focus-copy h3{margin:8px 0 4px}.focus-copy p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.metric{padding:16px}.metric span{display:block;color:var(--muted);font-size:11px}.metric strong{display:block;font-size:22px;margin-top:8px}.rank-list{overflow:hidden}.rank-row{display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line)}.rank-row:last-child{border-bottom:0}.rank-no{width:28px;height:28px;border-radius:9px;background:#f1f4f9;display:grid;place-items:center;font-size:12px;font-weight:700}.rank-main b{display:block}.rank-main small{color:var(--muted)}.rank-value{text-align:right;font-weight:700}.rank-value small{display:block;color:var(--muted);font-weight:400}.notice{padding:13px 14px;border-radius:14px;background:#fff8e6;color:#73580a;font-size:12px;line-height:1.5;margin-bottom:12px}.highlight{padding:18px}.highlight span,.highlight small{display:block;color:var(--muted);font-size:11px}.highlight strong{display:block;font-size:21px;margin:8px 0}.chips{padding:16px;display:flex;flex-wrap:wrap;gap:9px}.chip{padding:9px 12px;border-radius:999px;background:#f2f5fa;font-weight:700}.compare-card{padding:6px 16px}.compare-row{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--line)}.compare-row:last-child{border:0}.compare-row span{color:var(--muted)}.explanation{padding:18px;margin-top:12px}.explanation h3{margin-top:0}.explanation p{color:var(--muted);font-size:13px;line-height:1.6}
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(540px,100%);display:grid;grid-template-columns:repeat(5,1fr);background:rgba(255,255,255,.94);backdrop-filter:blur(18px);border-top:1px solid var(--line);padding:8px 8px calc(8px + env(safe-area-inset-bottom));z-index:30}.nav-item{border:0;background:transparent;color:#8b97aa;padding:5px}.nav-item span{display:block;font-size:20px}.nav-item small{display:block;font-size:10px;margin-top:2px}.nav-item.active{color:var(--blue)}
body.dark{--bg:#0d1320;--card:#151e2d;--text:#edf3ff;--muted:#94a3b8;--line:#263247;--shadow:none}.dark .topbar{background:rgba(13,19,32,.9)}.dark .seg.active{background:#1d293a}.dark .notice{background:#2b2413;color:#f1d980}.dark .chip{background:#202b3d}.dark .bottom-nav{background:rgba(21,30,45,.94)}
@media(max-width:380px){.ball{width:36px;height:36px;font-size:13px}.hero h1{font-size:28px}.grid-2{gap:9px}.action-card{padding:14px}}

/* V3 traffic hub */
.traffic-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.traffic-link{padding:16px;border:1px solid var(--line);border-radius:18px;background:var(--card);cursor:pointer}.traffic-link b{display:block;font-size:15px}.traffic-link small{display:block;color:var(--muted);margin-top:5px;line-height:1.4}.number-hub,.zodiac-hub{padding:14px;display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.hub-num,.hub-zodiac{border:0;border-radius:12px;background:#f2f5fa;color:var(--text);padding:10px 2px;font-weight:800;cursor:pointer}.hub-num small,.hub-zodiac small{display:block;font-size:9px;color:var(--muted);margin-top:3px}.zodiac-hub{grid-template-columns:repeat(4,1fr)}.hub-zodiac{padding:12px 4px}.detail-sheet{margin-top:12px;padding:18px}.detail-sheet h3{margin:0 0 8px}.detail-sheet p{font-size:12px;color:var(--muted);line-height:1.6}.seo-copy{font-size:12px;color:var(--muted);line-height:1.7}@media(max-width:380px){.number-hub{grid-template-columns:repeat(7,1fr);gap:5px}.hub-num{font-size:11px;padding:8px 1px}}
.dark .hub-num,.dark .hub-zodiac{background:#202b3d}

/* V3.1.0 responsive links */
a{color:var(--blue)}.traffic-link,.hub-num,.hub-zodiac{text-decoration:none;display:block}.traffic-link{color:var(--text)}.hub-num,.hub-zodiac{text-align:center;min-height:44px}:focus-visible{outline:3px solid var(--blue);outline-offset:3px}.rank-main{min-width:0;overflow-wrap:anywhere}.rank-value{max-width:110px;overflow-wrap:anywhere}.section-head{gap:8px;flex-wrap:wrap}.latest-card{flex-direction:column;align-items:flex-start}.latest-card .balls{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));width:100%;gap:4px}.latest-card .ball{width:min(40px,100%);aspect-ratio:1;height:auto}.hero-stats>div{min-width:0}.hero-stats strong{overflow-wrap:anywhere}.app-shell{padding-bottom:calc(100px + env(safe-area-inset-bottom))}.explanation{overflow-wrap:anywhere}button,a{touch-action:manipulation}@media(max-width:360px){.hero{padding:18px}.hero-stats{gap:5px}.hero-stats div{padding:8px}.rank-row{padding:12px 10px;gap:7px;grid-template-columns:28px minmax(0,1fr) auto}.rank-value{max-width:82px;font-size:12px}}

/* Content navigation platform */
.portal-search{padding:18px;margin-top:16px}.portal-search label{display:block;font-weight:700;margin-bottom:10px}.portal-search>div{display:flex;gap:8px}.portal-search input{min-width:0;flex:1;width:100%;padding:12px;border:1px solid var(--line);border-radius:12px;font:inherit;background:var(--card);color:var(--text)}.portal-search button{flex-shrink:0}.portal-categories{margin-top:14px}.portal-categories a{text-decoration:none}.portal-breadcrumbs{display:flex;flex-wrap:wrap;gap:14px;margin:4px 0 16px;font-size:14px}.catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.catalog-item{padding:14px;text-decoration:none;color:var(--text);display:block;overflow-wrap:anywhere}.catalog-item small{display:block;color:var(--muted);margin-top:6px}.archive-row{padding:15px;border-bottom:1px solid var(--line);scroll-margin-top:90px}.archive-row time{display:block;font-size:12px;color:var(--muted);margin:5px 0}.archive-row p{margin:5px 0;font-size:14px}.search-results{list-style:none;margin:14px 0;padding:0}.search-results li{margin-bottom:10px}.portal-note{line-height:1.7}.portal-categories .action-card{border:1px solid var(--line)}

.hero-number{color:white;text-decoration:underline}.portal-tools{margin-top:24px}.portal-tools>summary{cursor:pointer;font-weight:700;padding:14px;background:var(--card);border-radius:14px}

/* Keep all seven latest draw balls on one row, including narrow phones. */
.latest-card{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,1fr);align-items:center;gap:6px;padding:18px 12px}.latest-card .balls{width:100%;gap:4px}.latest-card .ball{width:100%;max-width:40px;height:auto;aspect-ratio:1;font-size:clamp(11px,3.5vw,16px)}.latest-card .special-wrap{position:relative;display:block;min-width:0}.latest-card .special-wrap>span{position:absolute;bottom:calc(100% + 3px);left:50%;transform:translateX(-50%);font-size:9px;line-height:1;white-space:nowrap}.latest-card #specialBall{display:flex;justify-content:center}

/* Separate the special number while retaining a single row. */
.latest-card{grid-template-columns:minmax(0,6fr) minmax(0,1.5fr)}.latest-card .special-wrap{display:flex;align-items:center;gap:3px}.latest-card .special-wrap::before{content:'+';font-size:16px;font-weight:700;flex-shrink:0}.latest-card #specialBall{flex:1;min-width:0}.latest-card .special-wrap>span{left:auto;right:0;transform:none}

/* Match the latest draw's single-row number presentation. */
.picker-card{padding:18px 12px}.pick-balls{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) 10px minmax(0,1fr);align-items:center;gap:4px}.pick-balls .ball{width:100%;max-width:40px;height:auto;aspect-ratio:1;font-size:clamp(11px,3.5vw,16px)}.pick-balls>span{text-align:center;font-size:16px;font-weight:700}

.latest-card .special-wrap>span{display:none}

/* Zodiac labels below the latest seven numbers. */
.latest-card .draw-number{display:flex;flex-direction:column;align-items:center;min-width:0;width:100%;gap:7px}.latest-card .draw-zodiac{font-size:13px;line-height:18px;color:var(--text);font-weight:500}.latest-card .special-wrap{align-items:flex-start}.latest-card .special-wrap::before{align-self:flex-start;line-height:1;margin-top:clamp(8px,2.5vw,12px)}

.latest-card{align-items:start}

.pick-balls{align-items:start}.pick-balls .draw-number{display:flex;flex-direction:column;align-items:center;min-width:0;width:100%;gap:7px}.pick-balls .draw-zodiac{font-size:13px;line-height:18px;color:var(--text);font-weight:500}.pick-balls>span{line-height:1;margin-top:clamp(8px,2.5vw,12px)}

/* Live broadcast module: a 16:9 player area ready for an authorized embed. */
.live-video-card{overflow:hidden}.live-video-frame{position:relative;aspect-ratio:16/9;background:#0c172b;color:#fff;display:grid;place-items:center}.live-video-frame iframe{width:100%;height:100%;border:0;position:absolute;inset:0}.live-video-placeholder{text-align:center;padding:22px;max-width:370px}.live-video-placeholder strong{font-size:18px}.live-video-placeholder p{font-size:13px;line-height:1.6;color:#d1d9e7}.live-video-placeholder small{font-size:11px;color:#9eafc7}.live-video-actions{padding:14px;display:flex;flex-wrap:wrap;align-items:center;gap:12px}.live-video-actions .primary{text-decoration:none;display:inline-block}.live-video-actions .fineprint{margin:0}


.draw-result-box{margin-top:22px;padding:14px 10px;border:1.5px solid #efa62d;border-radius:14px}.draw-result-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.draw-result-heading h2{font-size:20px;margin:0}.draw-result-heading button{background:#f39300;color:#fff;border:0;border-radius:18px;min-height:44px;padding:8px 12px;font-weight:700;white-space:nowrap;cursor:pointer}.draw-result-box #latestMeta{margin:4px 0}.draw-result-box .latest-card{padding:10px 0;box-shadow:none;border:0;border-radius:0}.draw-video-note{margin:4px 0 0;font-size:11px;color:var(--muted)}#drawVideoDialog{width:min(540px,94vw);padding:18px;border:0;border-radius:18px;background:var(--card);color:var(--text)}#drawVideoDialog::backdrop{background:#000a}.draw-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.draw-dialog-heading h2{font-size:18px}.draw-dialog-heading button{min-width:44px;min-height:44px;border:0;border-radius:10px;cursor:pointer}#drawVideoDialog video{display:block;width:100%;max-height:60vh;background:#091c38}#drawVideoDialog p,#drawVideoDialog a{font-size:13px;line-height:1.6}#drawVideoDialog a{color:var(--blue)}

.draw-landscape-player{background:#091c38;overflow:hidden;border-radius:10px}.draw-landscape-screen{position:relative;width:100%;aspect-ratio:920/520;overflow:hidden}#drawVideoDialog .draw-landscape-screen video{position:absolute;left:50%;top:50%;width:56.52174%;height:176.92308%;max-height:none;object-fit:contain;transform:translate(-50%,-50%) rotate(90deg)}.draw-player-controls{display:flex;justify-content:space-around;gap:6px;padding:6px}.draw-player-controls button{min-height:44px;background:#183e68;color:#fff;border:0;border-radius:6px;padding:6px 10px;cursor:pointer}.draw-landscape-player:fullscreen{display:flex;flex-direction:column;justify-content:center}.draw-landscape-player:fullscreen .draw-landscape-screen{width:min(100%,calc((100vh - 60px)*920/520));margin:auto}

.next-draw-schedule{margin:10px 0;padding:12px 8px;border-top:1px solid var(--line);font-size:16px;font-weight:700;line-height:1.6}.next-draw-schedule small{font-size:12px;font-weight:400;color:var(--muted)}

/* V3.2 clear blue layout */
:root{--bg:#f1f5fa;--card:#fff;--text:#192a40;--muted:#62718a;--blue:#205db7;--blue2:#184d9c;--line:#e2e8f1;--shadow:0 3px 14px rgba(30,57,91,.035);--soft:#eaf1fc}
body.dark{--bg:#101925;--card:#1b2737;--text:#eef3fa;--muted:#b0bdd0;--blue:#8bbcff;--blue2:#75a9ec;--line:#34465e;--soft:#223d60}
.card{border-radius:16px}.topbar{padding:18px;background:var(--bg)}.dark .topbar{background:var(--bg)}.brand{font-size:19px;letter-spacing:.3px}.subtitle{color:var(--muted);font-size:12px;margin-top:4px}.icon-btn{box-shadow:none;border:1px solid var(--line)}main{padding:16px}.section-head{margin:22px 2px 10px}.section-head h2{font-size:16px}.muted{font-size:12px}
.draw-result-box{margin-top:0;padding:16px;border:1px solid var(--line);border-radius:16px}.draw-result-heading h2{font-size:20px}.draw-result-heading button{background:var(--soft);color:var(--blue);font-size:12px;min-height:44px;padding:8px 12px}.draw-result-box #latestMeta{margin:2px 0 10px;color:var(--muted)}.draw-result-box .latest-card{padding:8px 0 14px}.latest-card .ball{box-shadow:inset 0 -3px 0 #0002;border-width:2px}.latest-card .draw-zodiac{font-size:12px;color:var(--muted)}.next-draw-schedule{padding:12px 0 0;margin:0;font-size:15px;line-height:1.7;color:var(--blue)}.next-draw-schedule small{display:inline-block;font-size:12px;color:var(--muted)}.draw-video-note{margin-top:8px;line-height:1.6;color:var(--muted)}
.draw-result-box .explanation{margin:0 0 10px;padding:10px 0;border:0;border-radius:0;box-shadow:none;font-size:12px}.draw-result-box .notice{margin:8px 0;padding:8px 0;border:0;border-radius:0;background:transparent;color:var(--muted);font-size:11px}.draw-result-box details summary{color:var(--muted);font-size:12px}.draw-result-box details p{line-height:1.6}
.portal-search{padding:0;margin:14px 0;border:0;background:transparent;box-shadow:none}.search-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.portal-search input{border-radius:12px;padding:12px;font-size:16px}.portal-search button{padding:10px 14px;border-radius:12px;background:var(--soft);color:var(--blue)}.portal-categories{margin-top:0;gap:10px}.portal-categories .action-card{padding:15px 12px;border-radius:14px}.action-card b{font-size:15px;font-weight:650}.action-card small{font-size:12px;margin-top:5px}.primary{background:#205db7;color:#fff}.catalog-item{border-radius:12px;font-size:14px}.catalog-item small{font-size:12px}.traffic-grid{gap:10px}.number-hub,.zodiac-hub{gap:7px;padding:12px}.hub-num,.hub-zodiac{background:var(--bg);font-weight:600;border-radius:9px}.dark .hub-num,.dark .hub-zodiac{background:var(--bg)}.home-summary{margin-top:22px}.home-summary>summary,.portal-tools>summary{min-height:44px;padding:10px 0;color:var(--muted);font-size:13px;cursor:pointer}.home-summary .hero{background:var(--card);color:var(--text);padding:12px;border:1px solid var(--line)}.home-summary .hero:after{display:none}.home-summary .hero-stats{margin:0;gap:8px}.home-summary .hero-stats>div{background:var(--bg);padding:10px;border-radius:10px}.home-summary .hero-stats strong{font-size:20px;color:var(--blue)}.home-summary .hero-stats span{font-size:11px;opacity:1;color:var(--muted)}.home-summary .fineprint{color:var(--muted);opacity:1}.bottom-nav,.dark .bottom-nav{background:var(--card);backdrop-filter:none;padding-top:8px}.nav-item{min-height:44px;color:var(--muted)}.nav-item.active{color:var(--blue)}.nav-item small{font-size:11px}.nav-item span{font-size:19px}
@media(max-width:360px){main{padding:12px}.draw-result-box{padding:12px}.draw-result-heading h2{font-size:18px}.draw-result-heading button{padding:8px 10px}.next-draw-schedule{font-size:14px}.action-card small{font-size:11px}.portal-categories .action-card{padding:12px 10px}}
.topbar button{color:var(--text)}

/* Prominent expandable data sections. */
.home-summary,.portal-tools{margin-top:14px;border:1px solid var(--line);border-radius:14px;background:var(--card);overflow:hidden;box-shadow:var(--shadow)}.home-summary>summary,.portal-tools>summary{display:flex;align-items:center;gap:12px;min-height:80px;padding:16px;list-style:none;color:var(--text);cursor:pointer}.home-summary>summary::-webkit-details-marker,.portal-tools>summary::-webkit-details-marker{display:none}.disclosure-icon{display:grid;place-items:center;flex:0 0 40px;height:40px;border-radius:11px;background:var(--soft);color:var(--blue);font-size:22px}.disclosure-copy{flex:1;min-width:0}.disclosure-copy strong{display:block;font-size:16px;line-height:1.5;font-weight:650}.disclosure-copy small{display:block;color:var(--muted);font-size:12px;line-height:1.6;margin-top:4px}.disclosure-arrow{color:var(--blue);font-size:24px;transition:transform .15s}.home-summary[open]>summary,.portal-tools[open]>summary{border-bottom:1px solid var(--line);background:var(--soft)}.home-summary[open] .disclosure-arrow,.portal-tools[open] .disclosure-arrow{transform:rotate(180deg)}.home-summary .hero{margin:12px;border:0;box-shadow:none}.portal-tools>.section-head{margin:16px 16px 10px}.portal-tools>.picker-card{margin:0 12px 12px;box-shadow:none}.home-summary>summary:hover,.portal-tools>summary:hover{background:var(--soft)}@media(max-width:360px){.home-summary>summary,.portal-tools>summary{gap:10px;padding:14px 12px}.disclosure-copy small{font-size:11px}}@media(prefers-reduced-motion:reduce){.disclosure-arrow{transition:none}}

/* Readable ranking indices in day and night modes. */
.rank-no{background:var(--soft);color:var(--text);font-variant-numeric:tabular-nums}.back{color:var(--text)}
