:root{--bg:#0a0d14;--bg2:#0f1420;--panel:#121826;--panel2:#161e30;--line:#233049;--line-bright:#31456b;--txt:#e8eef8;--muted:#8a97b0;--neon:#3dff8b;--neon2:#37d6ff;--mag:#ff4dd8;--amber:#ffc53d;--danger:#ff5d5d;--radius:10px;--mono:"JetBrains Mono","Cascadia Code",Consolas,"Courier New",monospace;--sans:"PingFang SC","Microsoft YaHei",system-ui,sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--txt);font-family:var(--sans);background-image:radial-gradient(1200px 500px at 70% -10%,rgba(61,255,139,.06),transparent 60%),radial-gradient(900px 420px at 10% 110%,rgba(55,214,255,.05),transparent 60%)}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer}img{max-width:100%}.muted{color:var(--muted)}.mono{font-family:var(--mono)}.scanlines{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.35;background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.012) 2px 4px)}.topbar{position:-webkit-sticky;position:sticky;top:0;z-index:50;gap:14px;padding:10px 20px;background:rgba(10,13,20,.9);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}.brand,.topbar{display:flex;align-items:center}.brand{gap:9px;font-family:var(--mono);letter-spacing:1px}.brand-badge{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:8px;background:linear-gradient(135deg,var(--neon),var(--neon2));color:#04140b;font-weight:900;box-shadow:0 0 14px rgba(61,255,139,.45)}.brand-text{font-size:15px;font-weight:800}.brand-text b{color:var(--neon)}.brand-text i{display:block;font-style:normal;font-size:10px;color:var(--muted);letter-spacing:4px}.mainnav{display:flex;gap:2px;flex-wrap:wrap;flex:1 1;justify-content:center}.mainnav a{padding:7px 11px;border-radius:8px;font-size:13px;color:var(--muted);border:1px solid transparent}.mainnav a:hover{color:var(--txt);background:var(--panel)}.mainnav a.active{color:var(--neon);border-color:rgba(61,255,139,.35);background:rgba(61,255,139,.06)}.topbar-right{display:flex;align-items:center;gap:8px}.icon-btn{position:relative;background:var(--panel);border:1px solid var(--line);color:var(--txt);width:34px;height:34px;border-radius:8px;font-size:15px}.icon-btn:hover{border-color:var(--neon)}.notify-dot{position:absolute;top:-4px;right:-4px;min-width:15px;height:15px;border-radius:8px;background:var(--mag);color:#fff;font-size:10px;line-height:15px;padding:0 3px;font-family:var(--mono)}.btn{display:inline-flex;align-items:center;gap:7px;padding:10px 18px;border-radius:9px;font-size:14px;font-weight:700;border:1px solid var(--line-bright);background:var(--panel2);color:var(--txt);transition:.15s}.btn:hover{border-color:var(--neon);transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--neon),#19c96a);color:#04140b;border:none;box-shadow:0 0 18px rgba(61,255,139,.35)}.btn-primary:hover{box-shadow:0 0 26px rgba(61,255,139,.55)}.btn-cyan{background:linear-gradient(135deg,var(--neon2),#1e8fff);color:#03121a;border:none}.btn-mag{background:linear-gradient(135deg,var(--mag),#b13dff);color:#fff;border:none}.btn-ghost{background:transparent}.btn-sm{padding:7px 12px;font-size:12.5px;border-radius:8px}.btn-lg{padding:14px 26px;font-size:16px}.app-root{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:26px 20px 80px;min-height:70vh}.page-heading{display:flex;align-items:baseline;gap:14px;margin:8px 0 6px}.page-heading h1{font-family:var(--mono);font-size:28px;letter-spacing:2px}.page-heading .code{color:var(--neon)}.crumb{font-size:12px;color:var(--muted);margin-bottom:4px}.crumb,.section-title{font-family:var(--mono);letter-spacing:1px}.section-title{display:flex;align-items:center;gap:10px;margin:34px 0 14px;font-size:18px}.section-title:before{content:"▙";color:var(--neon)}.section-title .more{margin-left:auto;font-size:12.5px;color:var(--neon2)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px}.panel.glow{box-shadow:inset 0 0 24px rgba(61,255,139,.07)}.grid{display:grid;grid-gap:14px;gap:14px}.grid-2{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}.grid-3{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.grid-4{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}.tag{display:inline-block;font-family:var(--mono);font-size:11px;padding:3px 9px;border-radius:20px;border:1px solid var(--line-bright);color:var(--muted);margin:2px 3px 2px 0}.tag.on{color:var(--neon);border-color:var(--neon);background:rgba(61,255,139,.08)}.tag.hot{color:var(--mag);border-color:var(--mag);background:rgba(255,77,216,.08)}.tag.gold{color:var(--amber);border-color:var(--amber);background:rgba(255,197,61,.08)}.hero{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:linear-gradient(160deg,#0e1a18,#0c1220 55%,#101024);padding:46px 40px;margin-bottom:30px}.hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(61,255,139,.07),transparent 30%,transparent 70%,rgba(55,214,255,.07))}.hero-kicker{font-family:var(--mono);color:var(--neon);letter-spacing:3px;font-size:12px;margin-bottom:14px}.hero h1{font-size:clamp(26px,4.6vw,46px);line-height:1.2;font-weight:900}.hero h1 .hl{color:var(--neon);text-shadow:0 0 18px rgba(61,255,139,.6)}.hero p.sub{margin:14px 0 24px;color:var(--muted);max-width:640px;line-height:1.8}.hero-cta{gap:12px}.hero-cta,.hero-stats{display:flex;flex-wrap:wrap}.hero-stats{gap:26px;margin-top:30px}.hero-stat b{display:block;font-family:var(--mono);font-size:24px;color:var(--neon2)}.hero-stat span{font-size:12px;color:var(--muted)}.hero-card{position:absolute;right:60px;top:50%;transform:translateY(-50%) rotate(6deg);width:190px;height:298px;border-radius:14px;border:1px solid var(--line-bright);background:linear-gradient(170deg,#182642,#0d1424);box-shadow:0 20px 60px rgba(0,0,0,.6),0 0 30px rgba(55,214,255,.15);padding:14px;font-family:var(--mono);animation:float 5s ease-in-out infinite}.hero-card .screen{height:170px;border-radius:8px;background:#050a12;border:1px solid var(--line);display:grid;place-items:center;color:var(--neon);font-size:11px;letter-spacing:2px}.hero-card small{display:block;margin-top:10px;color:var(--muted);font-size:10px}@keyframes float{0%,to{transform:translateY(-50%) rotate(6deg)}50%{transform:translateY(-56%) rotate(4deg)}}@media(max-width:900px){.hero-card{display:none}}.tri{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:14px;gap:14px}.tri .panel{position:relative;cursor:pointer;transition:.2s}.tri .panel:hover{border-color:var(--neon);transform:translateY(-3px)}.tri .step{font-size:11px;color:var(--muted)}.tri .step,.tri h3{font-family:var(--mono)}.tri h3{letter-spacing:2px;margin:8px 0;font-size:20px}.tri .t1{color:var(--neon)}.tri .t2{color:var(--neon2)}.tri .t3{color:var(--mag)}@media(max-width:800px){.tri{grid-template-columns:1fr}}.play-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:.18s;cursor:pointer;position:relative}.play-card:hover{border-color:var(--neon);transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.5),0 0 18px rgba(61,255,139,.12)}.play-thumb{height:130px;display:grid;place-items:center;font-family:var(--mono);font-size:12px;letter-spacing:2px;color:#04140b;position:relative;overflow:hidden}.play-thumb .emoji{font-size:44px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.4))}.play-thumb .rank-badge{position:absolute;left:10px;top:10px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.25);color:#fff;font-size:11px;padding:2px 8px;border-radius:6px;font-family:var(--mono)}.play-body{padding:14px}.play-body h3{font-size:15px;margin-bottom:6px}.play-desc{font-size:12.5px;color:var(--muted);line-height:1.6;height:38px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.play-meta{display:flex;align-items:center;gap:12px;margin-top:10px;font-family:var(--mono);font-size:11.5px;color:var(--muted)}.play-meta b{color:var(--neon)}.play-meta .heart.on{color:var(--mag)}.rank-panel{display:grid;grid-template-columns:1fr 1fr;grid-gap:14px;gap:14px}@media(max-width:900px){.rank-panel{grid-template-columns:1fr}}.rank-tabs{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}.rank-tabs button{background:var(--bg2);border:1px solid var(--line);color:var(--muted);font-size:12px;font-family:var(--mono);padding:5px 12px;border-radius:7px}.rank-tabs button.on{color:var(--neon);border-color:var(--neon);background:rgba(61,255,139,.08)}.rank-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;font-size:13px}.rank-row:hover{background:var(--bg2)}.rank-no{font-family:var(--mono);width:26px;color:var(--muted)}.rank-no.top{color:var(--amber);font-weight:900}.rank-row .grow{flex:1 1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rank-row .dl{font-family:var(--mono);font-size:12px;color:var(--neon2)}.rank-row .growth{font-family:var(--mono);font-size:11px;color:var(--mag)}.stream-bar{height:3px;border-radius:2px;background:var(--line);overflow:hidden;margin:6px 0}.stream-bar i{display:block;height:100%;width:40%;background:linear-gradient(90deg,var(--neon),var(--neon2));animation:slide 1.1s linear infinite}@keyframes slide{0%{transform:translateX(-100%)}to{transform:translateX(250%)}}.cat-bar{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.cat-bar button{background:var(--panel);border:1px solid var(--line);color:var(--muted);padding:7px 14px;border-radius:8px;font-size:13px}.cat-bar button.on{color:var(--neon);border-color:var(--neon);background:rgba(61,255,139,.07)}.sort-bar{display:flex;gap:6px;margin:0 0 14px}.sort-bar button{background:none;border:none;color:var(--muted);font-size:13px;padding:6px 10px;border-radius:7px}.sort-bar button.on{color:var(--txt);background:var(--panel);border:1px solid var(--line-bright)}.detail{display:grid;grid-template-columns:1.7fr 1fr;grid-gap:20px;gap:20px}@media(max-width:900px){.detail{grid-template-columns:1fr}}.detail-banner{height:220px;border-radius:12px;display:grid;place-items:center;font-size:64px;border:1px solid var(--line-bright)}.stat-chip{display:inline-flex;flex-direction:column;align-items:center;gap:2px;background:var(--bg2);border:1px solid var(--line);border-radius:9px;padding:9px 14px;min-width:78px;font-family:var(--mono)}.stat-chip b{font-size:17px;color:var(--neon)}.stat-chip span{font-size:10.5px;color:var(--muted)}.stat-row{margin:14px 0}.eng-btns,.stat-row{display:flex;gap:10px;flex-wrap:wrap}.eng-btns{margin:16px 0}.eng-btns .btn.on-heart{border-color:var(--mag);color:var(--mag)}.eng-btns .btn.on-fav{border-color:var(--amber);color:var(--amber)}.comment{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:10px 0;background:var(--bg2)}.comment.child{margin-left:34px;background:transparent}.comment-head{display:flex;align-items:center;gap:9px;font-size:12.5px;margin-bottom:6px}.comment-head .avatar{width:24px;height:24px;border-radius:6px;display:grid;place-items:center;font-size:12px;font-weight:900;color:#04140b}.badge-tested{font-family:var(--mono);font-size:10px;color:var(--neon2);border:1px solid var(--neon2);border-radius:5px;padding:1px 6px;background:rgba(55,214,255,.08)}.comment-body{font-size:13.5px;line-height:1.7}.comment-foot{display:flex;gap:14px;margin-top:7px}.comment-foot,.comment-foot button{font-size:11.5px;color:var(--muted);font-family:var(--mono)}.comment-foot button{background:none;border:none}.comment-foot button:hover{color:var(--neon)}.reply-box{display:none;margin-top:8px}.reply-box.open{display:flex;gap:8px}.reply-box input{flex:1 1;background:var(--panel);border:1px solid var(--line-bright);border-radius:8px;color:var(--txt);padding:8px 12px;font-size:13px}.tree-wrap{overflow-x:auto;padding:10px 0}.tree-node{display:inline-block;background:var(--panel2);border:1px solid var(--line-bright);border-radius:9px;padding:9px 13px;font-size:12.5px;min-width:150px}.tree-node.root{border-color:var(--neon);box-shadow:0 0 14px rgba(61,255,139,.25)}.tree-node small{display:block;color:var(--muted);font-family:var(--mono);font-size:10px;margin-top:3px}.tree-gen{display:flex;gap:26px;align-items:flex-start;padding:18px 0 0 30px;position:relative}.tree-gen:before{content:"";position:absolute;left:0;top:0;bottom:50%;width:1px;background:repeating-linear-gradient(var(--line-bright) 0 4px,transparent 4px 8px)}.flasher{display:grid;grid-template-columns:1fr 340px;grid-gap:20px;gap:20px}@media(max-width:900px){.flasher{grid-template-columns:1fr}}.device-mock{background:#060a12;border:1px solid var(--line-bright);border-radius:16px;padding:16px;box-shadow:inset 0 0 40px rgba(55,214,255,.1)}.device-screen{height:380px;border-radius:10px;background:#02060c;border:1px solid var(--line);font-family:var(--mono);color:var(--neon);padding:14px;font-size:11.5px;line-height:1.8;overflow:hidden;text-shadow:0 0 6px rgba(61,255,139,.5)}.flash-step{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:9px;border:1px solid var(--line);margin-bottom:8px;font-size:13px;background:var(--bg2)}.flash-step .no{font-family:var(--mono);color:var(--muted)}.flash-step.doing{border-color:var(--neon)}.flash-step.done{border-color:rgba(61,255,139,.4);color:var(--muted)}.flash-step.done .no{color:var(--neon)}.flash-step.fail{border-color:var(--danger)}.progress{height:10px;border-radius:6px;background:var(--bg2);border:1px solid var(--line);overflow:hidden;margin:10px 0}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--neon),var(--neon2));transition:width .25s}.hash-line{font-family:var(--mono);font-size:11px;color:var(--muted);word-break:break-all}.workshop-steps{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:10px;gap:10px;margin:18px 0}@media(max-width:800px){.workshop-steps{grid-template-columns:1fr 1fr}}.ws-step{border:1px solid var(--line);border-radius:10px;padding:14px;background:var(--bg2);font-size:12.5px;position:relative;opacity:.45;transition:.3s}.ws-step.active{opacity:1;border-color:var(--neon2);box-shadow:0 0 16px rgba(55,214,255,.2)}.ws-step.done{opacity:1;border-color:var(--neon)}.ws-step b{font-family:var(--mono);display:block;margin-bottom:5px;font-size:12px}.ws-step .code-preview{margin-top:8px;font-family:var(--mono);font-size:10.5px;color:var(--neon2);background:#060a12;border-radius:7px;padding:8px;max-height:110px;overflow:hidden;white-space:pre-wrap}.big-input{width:100%;min-height:90px;background:var(--panel);border:1px solid var(--line-bright);border-radius:12px;color:var(--txt);padding:16px;font-size:15px;line-height:1.7;resize:vertical}.big-input:focus{outline:none;border-color:var(--neon)}.chip-suggest{display:inline-block;margin:4px 4px 0 0;background:var(--bg2);border:1px dashed var(--line-bright);color:var(--muted);border-radius:20px;padding:5px 12px;font-size:12px}.chip-suggest:hover{color:var(--neon);border-color:var(--neon)}.sim-dock{position:fixed;right:22px;bottom:22px;z-index:90;background:var(--panel);border:1px solid var(--line-bright);border-radius:14px;padding:12px;box-shadow:0 20px 60px rgba(0,0,0,.7),0 0 30px rgba(61,255,139,.12)}.sim-dock-head{display:flex;align-items:center;gap:10px;font-size:12.5px;font-family:var(--mono);margin-bottom:9px}.sim-dock-head span:first-child{color:var(--neon)}.sim-dock-title{font-size:11px}#sim-canvas{display:block;border-radius:10px;background:#02060c;border:1px solid var(--line)}.sim-dock-keys{display:flex;gap:8px;justify-content:center;margin-top:9px}.sim-dock-keys button{width:52px;height:40px;border-radius:9px;background:var(--bg2);border:1px solid var(--line-bright);color:var(--neon);font-size:15px}.sim-dock-keys button:active{background:rgba(61,255,139,.15)}.search-overlay{position:fixed;inset:0;z-index:80;background:rgba(4,7,12,.8);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;padding:90px 20px 20px}.search-panel{width:min(680px,100%);background:var(--panel);border:1px solid var(--line-bright);border-radius:14px;padding:18px;height:-moz-fit-content;height:fit-content;max-height:70vh;display:flex;flex-direction:column}.search-input{width:100%;background:var(--bg2);border:1px solid var(--line-bright);border-radius:10px;color:var(--txt);padding:14px 16px;font-size:16px}.search-input:focus{outline:none;border-color:var(--neon)}.search-hint{font-family:var(--mono);font-size:11px;color:var(--muted);margin:8px 0}.search-results{overflow-y:auto}.sr-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:9px;cursor:pointer}.sr-item:hover{background:var(--bg2)}.sr-item .emoji{font-size:22px}.sr-item b{font-size:13.5px}.sr-item small{display:block;color:var(--muted);font-size:11.5px}.sr-item .why{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--neon2)}.notify-drawer{position:fixed;top:60px;right:18px;z-index:80;width:340px;max-height:70vh;overflow:auto;background:var(--panel);border:1px solid var(--line-bright);border-radius:14px;padding:14px;box-shadow:0 20px 50px rgba(0,0,0,.6)}.notify-head{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:13px;margin-bottom:10px}.notify-item{border:1px solid var(--line);border-radius:9px;padding:10px 12px;margin-bottom:8px;font-size:12.5px;background:var(--bg2)}.notify-item.unread{border-color:rgba(61,255,139,.5)}.notify-item time{display:block;font-family:var(--mono);font-size:10px;color:var(--muted);margin-top:4px}.event-card{position:relative;border:1px solid var(--line);border-radius:12px;padding:18px;background:linear-gradient(150deg,var(--panel),var(--bg2));overflow:hidden}.event-card .city{font-family:var(--mono);font-size:22px;color:var(--neon2);letter-spacing:2px}.event-card .date{font-family:var(--mono);font-size:12px;color:var(--amber);margin:6px 0}.event-card .phase{position:absolute;right:14px;top:14px}.tier{border:1px solid var(--line);border-radius:12px;padding:20px;background:var(--panel);position:relative}.tier.hot{border-color:var(--neon)}.tier h3{letter-spacing:1px;margin-bottom:4px}.tier .price,.tier h3{font-family:var(--mono)}.tier .price{font-size:13px;color:var(--amber);margin:8px 0 12px}.tier ul{list-style:none;font-size:13px;color:var(--muted);line-height:2}.tier ul li:before{content:"▸ ";color:var(--neon)}.guide-row{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:11px;padding:15px 17px;margin-bottom:10px;background:var(--panel);cursor:pointer;transition:.15s}.guide-row:hover{border-color:var(--neon)}.guide-row .no{font-family:var(--mono);font-size:20px;color:var(--neon2);width:34px}.guide-row b{font-size:14.5px;display:block}.guide-row small{color:var(--muted);font-size:12.5px}.guide-row .arrow{margin-left:auto;color:var(--neon);font-family:var(--mono)}.dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));grid-gap:12px;gap:12px}.dash-card{background:var(--bg2);border:1px solid var(--line);border-radius:11px;padding:15px;font-family:var(--mono)}.dash-card b{font-size:22px;color:var(--neon);display:block}.dash-card span{font-size:11px;color:var(--muted)}.sub-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;margin-bottom:9px;background:var(--bg2);font-size:13px}.status-pill{font-family:var(--mono);font-size:10.5px;border-radius:14px;padding:3px 10px}.status-published{color:var(--neon);border:1px solid var(--neon)}.status-reviewing{color:var(--amber);border:1px solid var(--amber)}.status-draft{color:var(--muted);border:1px solid var(--line-bright)}.toast-wrap{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:100;display:flex;flex-direction:column;gap:8px}.toast{background:var(--panel2);border:1px solid var(--neon);color:var(--txt);border-radius:10px;padding:11px 18px;font-size:13.5px;box-shadow:0 8px 30px rgba(0,0,0,.6);animation:pop .2s}@keyframes pop{0%{opacity:0;transform:translateY(10px)}to{opacity:1}}.footer{border-top:1px solid var(--line);padding:36px 20px 20px;position:relative;z-index:1;background:var(--bg2)}.footer-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;grid-gap:24px;gap:24px}@media(max-width:800px){.footer-grid{grid-template-columns:1fr 1fr}}.footer h4{font-family:var(--mono);font-size:13px;color:var(--neon);margin-bottom:10px;letter-spacing:1px}.footer a{display:block;font-size:13px;color:var(--muted);padding:4px 0}.footer a:hover{color:var(--txt)}.footer-bottom{max-width:1200px;margin:26px auto 0;font-family:var(--mono);font-size:11px;border-top:1px solid var(--line);padding-top:14px;letter-spacing:1px}.brand.small{font-size:13px;margin-bottom:8px}.loading-dots:after{content:"…";animation:dots 1s steps(4) infinite}@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}