
:root{--bg:#080d18;--panel:#101828;--panel2:#141f31;--stroke:#283449;--muted:#98a9c0;--text:#eef5ff;--blue:#82d5ff;--gold:#e6cb91;--shadow:0 18px 65px #0008}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:var(--bg);font-family:Inter,"Noto Sans TC","Microsoft JhengHei",system-ui,-apple-system,sans-serif;font-size:14px;line-height:1.65}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #9cd9ff;outline-offset:3px}input,select{outline:none}
body:before{position:fixed;content:"";inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse 60% 40% at 50% -5%,#1537597a,transparent),radial-gradient(ellipse 50% 32% at 95% 36%,#1f1c4770,transparent);}
.container{max-width:1200px;margin:auto;padding-inline:30px}.topbar{height:81px;background:#090f1dbe;backdrop-filter:blur(20px);border-bottom:1px solid #ffffff14;position:sticky;top:0;z-index:35}.nav-inner{display:flex;align-items:center;justify-content:space-between;height:100%;gap:20px}.brand{display:flex;gap:12px;align-items:center}.brand-mark{display:grid;place-items:center;width:52px;height:58px;flex:0 0 auto}.brand-mark img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 7px #58bfd255)}.brand-text{display:flex;flex-direction:column;line-height:1.35;gap:2px}.brand-text b{font-size:16px;letter-spacing:.04em}.brand-text span{font-size:10px;letter-spacing:.14em;color:#82a4bc;font-weight:750}.nav-actions{display:flex;align-items:center;gap:11px}.nav-link{color:#c4d4e6;font-weight:650}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;padding:11px 17px;border-radius:11px;font-weight:730;border:1px solid #34465d;background:#182437;color:#dfedff;transition:.18s}.btn:hover{transform:translateY(-1px);border-color:#78b8dc}.btn-primary{background:linear-gradient(110deg,#4dbde7,#73a9ea);border:1px solid #8cd9ff;color:#072033;box-shadow:0 8px 24px #4ac2f622}.btn-soft{background:#152033;color:#b7d8ec}.btn-small{padding:9px 12px;font-size:12px}
.hero{padding:86px 0 65px;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;right:-180px;top:-170px;width:700px;height:650px;background:radial-gradient(circle,#136c9540,transparent 65%);pointer-events:none}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:35px}.eyebrow{display:inline-flex;align-items:center;gap:9px;color:#8ad8ef;letter-spacing:.17em;font-size:11px;font-weight:790}.dot{background:#6fd2b8;width:7px;height:7px;border-radius:50%;box-shadow:0 0 10px #6fd2b8}.hero h1{font-size:clamp(42px,5vw,70px);line-height:1.15;margin:25px 0 19px;letter-spacing:-.055em;font-weight:900}.hero h1 span{display:block;color:#87d8ff;text-shadow:0 0 42px #1f9cd34d}.hero-lead{color:#a9bdd4;font-size:16px;line-height:1.95;max-width:570px;margin:0 0 30px}.hero-cta{display:flex;align-items:center;gap:11px;flex-wrap:wrap}.demo-banner{font-size:12px;color:#e9c993;background:#9c743b20;border:1px solid #bc93523b;padding:9px 13px;border-radius:9px;margin-top:26px;max-width:575px}.showcase{position:relative;padding:22px;border:1px solid #43577469;border-radius:23px;background:linear-gradient(155deg,#162943d9,#0a1324 85%);box-shadow:var(--shadow);min-height:318px;overflow:hidden}.showcase:before{content:"";position:absolute;width:270px;height:270px;right:-80px;top:-80px;border-radius:50%;border:1px solid #72a2ff20;box-shadow:0 0 0 35px #69a4dc08,0 0 0 80px #69a4dc08}.showcase-kicker{font-size:10px;color:#9fbbd5;letter-spacing:.19em;font-weight:800}.showcase-flex{display:flex;align-items:center;gap:18px;margin-top:16px}.showcase-spotlight{position:relative;flex:0 0 180px;width:180px;height:180px;display:grid;place-items:center}.showcase-avatar-shell{width:152px;height:152px;border-radius:50%;padding:4px;background:linear-gradient(145deg,color-mix(in srgb,var(--featured-color) 48%,#c5e7ff 18%),#263b59 78%);box-shadow:0 0 0 1px #ffffff1a,0 22px 38px #00000038,0 0 36px color-mix(in srgb,var(--featured-color) 22%,transparent)}.showcase-avatar{width:100%;height:100%;border-radius:50%;overflow:hidden;background:linear-gradient(145deg,#20344f,#151f33);display:grid;place-items:center;font-size:76px;color:#eef7ff}.showcase-avatar img{width:100%;height:100%;object-fit:cover;display:block}.showcase-title-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.showcase-rank-badge{flex:0 0 auto;width:118px;height:82px;display:grid;place-items:center;background:none;border:none;box-shadow:none;padding:0}.showcase-icon{width:118px;height:82px;object-fit:contain;filter:drop-shadow(0 0 14px color-mix(in srgb,var(--featured-color) 28%,transparent))}.showcase-title{font-size:36px;line-height:1.1;font-weight:880}.showcase-title small{display:block;color:#bd91ff;font-size:11px;letter-spacing:.12em;margin-bottom:12px}.showcase-sub{font-size:12px;color:#bbbad2;margin-top:8px}.mini-card{position:relative;display:flex;align-items:center;gap:12px;background:#1a2437;border:1px solid #3b4a63;border-radius:13px;padding:12px;margin-top:8px}.avatar-mini{display:grid;place-items:center;width:45px;height:45px;background:linear-gradient(135deg,#34618c,#51417b);border:2px solid #99ddff;border-radius:50%;font-size:25px}.mini-text b{font-size:14px}.mini-text div{color:#99aabd;font-size:11px}.mini-pill{margin-left:auto;font-size:11px;color:#e3c7ff;border-radius:99px;background:#784ea433;padding:4px 9px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:22px}.stat{background:#111c2b92;border:1px solid #24364c;border-radius:13px;padding:16px 19px}.stat .num{font-size:24px;font-weight:850;color:#e5f8ff;letter-spacing:-.035em}.stat .desc{color:#7f96ae;font-size:11px;margin-top:2px}.main{padding-bottom:75px}.sectionhead{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:22px 0 21px}.section-kicker{font-size:11px;color:#6fc4e8;font-weight:800;letter-spacing:.16em}.sectionhead h2{font-size:29px;letter-spacing:-.035em;margin:2px 0 4px}.sectionhead p{margin:0;color:#8298b2;font-size:12px}.section-side{color:#7c94ae;font-size:12px}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px;background:#0f1828;border:1px solid #26354a;border-radius:15px;margin-bottom:17px}.searchbox{display:flex;gap:10px;align-items:center;background:#0b1422;border:1px solid #334559;border-radius:10px;min-width:230px;flex:1;max-width:440px;padding:10px 13px;color:#90b8d1}.searchbox input{border:none;color:#fff;background:transparent;flex:1;min-width:0;font-size:13px}.searchbox input::placeholder{color:#607991}.selector{background:#122036;color:#d7e4f5;border:1px solid #354760;border-radius:10px;padding:10px 13px;min-width:148px}.filter-chips{display:flex;gap:7px;overflow:auto;padding:1px 0 17px;scrollbar-width:thin}.chip{background:#101d30;color:#9badc3;border:1px solid #273952;padding:6px 15px;border-radius:100px;font-size:12px;flex:0 0 auto}.chip.active{background:#225374;color:#c4eeff;border-color:#4787b2}.rank-list{display:grid;gap:13px}.rank-row{--accent:#7dcbe9;--ambient:#17283b;display:grid;grid-template-columns:180px 1fr;min-height:174px;overflow:hidden;border:1px solid #2a384e;border-radius:18px;background:radial-gradient(ellipse 70% 150% at 1% 50%,var(--ambient),transparent 80%),linear-gradient(100deg,#132033,#10192a 80%);box-shadow:0 10px 30px #00000019;transition:.2s}.rank-row:hover{border-color:#577087}.rank-side{padding:14px 8px;border-right:1px solid #ffffff12;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;background:linear-gradient(90deg,#ffffff08,transparent);isolation:isolate}.rank-icon{height:84px;width:140px;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--accent) 35%,transparent));margin-bottom:0;display:block}.rank-name{font-size:21px;font-weight:850;text-shadow:0 1px 14px #0009;line-height:1;margin-top:-2px}.rank-eng{font-size:9px;font-weight:800;color:var(--accent);letter-spacing:.19em;margin-top:5px}.rank-content{padding:17px 20px 18px;min-width:0}.rank-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}.rank-label{font-size:13px;color:#c3d1df;font-weight:730}.count{font-size:10px;border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);color:var(--accent);border-radius:100px;background:#ffffff06;padding:4px 10px;font-weight:700}.people{display:flex;flex-wrap:wrap;gap:14px}.person{width:94px;display:flex;flex-direction:column;align-items:center;gap:7px;border:0;color:#dae5f1;background:transparent;padding:0;position:relative}.person-avatar{width:67px;height:67px;border:2px solid var(--accent);box-shadow:0 0 0 4px #ffffff0c,0 5px 19px #0008;background:linear-gradient(135deg,#2a344f,#2a203e);border-radius:50%;display:grid;place-items:center;color:#e9f5ff;font-size:23px;overflow:hidden;transition:.18s}.person:hover .person-avatar{transform:translateY(-4px) scale(1.04);box-shadow:0 0 0 5px #ffffff15,0 8px 19px #0008}.person-avatar img{width:100%;height:100%;object-fit:cover}.person-name{font-size:11px;line-height:1.3;font-weight:700;max-width:96px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.person.demo .person-name{color:#a1abc1}.demo-marker{position:absolute;top:52px;right:1px;border:1px solid #4e5f76;background:#263043;font-size:9px;padding:0px 4px;border-radius:4px;color:#a9bbca}.empty{display:flex;align-items:center;gap:10px;color:#70849c;font-size:12px;min-height:74px}.empty-mark{font-size:25px;opacity:.45}.noresults{text-align:center;padding:40px;color:#a5b6c9;border:1px dashed #31445d;border-radius:16px}
.how{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr);gap:20px;margin-top:50px}.info-panel,.owner-panel{border-radius:20px;border:1px solid #33465b;background:linear-gradient(140deg,#162438,#0d1728);padding:29px}.info-panel h3,.owner-panel h3{font-size:22px;margin:0 0 9px}.info-panel p,.owner-panel p{color:#91a7bd;font-size:13px;line-height:1.85}.info-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:19px 0 0;padding:0;list-style:none}.step{border-top:1px solid #31516d;padding-top:13px}.step-num{color:#79cef4;font-weight:900;font-size:11px;letter-spacing:.13em}.step b{display:block;font-size:13px;margin-top:5px}.step span{display:block;font-size:11px;color:#8499af;margin-top:4px}.owner-panel{background:radial-gradient(ellipse at 90% 0,#23527870,transparent 70%),linear-gradient(140deg,#13243c,#0d1728)}.owner-panel .owner{color:#a6dcff;font-size:11px;letter-spacing:.16em;font-weight:800}.footer{border-top:1px solid #202e42;padding:25px 0 45px;color:#71879f;font-size:11px}.footrow{display:flex;justify-content:space-between;align-items:start;gap:20px}.legal{max-width:720px;font-size:10px;line-height:1.8;color:#62768d;margin-top:14px}
.overlay{position:fixed;inset:0;z-index:100;background:#020712ca;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:16px}.modal{background:linear-gradient(160deg,#17283e,#101725);border:1px solid #3c536e;width:min(570px,100%);max-height:90vh;overflow:auto;border-radius:20px;box-shadow:0 30px 90px #000e}.modalhead{display:flex;align-items:center;justify-content:space-between;padding:21px 23px;border-bottom:1px solid #314057}.modalhead h3{margin:0;font-size:19px}.close{display:grid;place-items:center;width:34px;height:34px;background:#203149;color:#bccbdf;border:0;border-radius:9px;font-size:23px}.modalbody{padding:24px}.profile-head{display:flex;align-items:center;gap:17px}.profile-avatar{width:89px;height:89px;border-radius:50%;border:3px solid #bc96fa;background:#30324d;display:grid;place-items:center;font-size:35px;overflow:hidden;flex-shrink:0}.profile-avatar img{width:100%;height:100%;object-fit:cover}.profile-head h3{font-size:25px;margin:0}.profile-sub{color:#a6b6cb}.profile-note{background:#0b1727;border:1px solid #30425c;border-radius:11px;padding:15px;color:#9bb0c7;margin:19px 0;font-size:12px}.flex-btn{display:flex;gap:10px;flex-wrap:wrap}.form-field{display:flex;flex-direction:column;gap:6px;margin-bottom:15px}.form-field span{font-size:12px;color:#b1c6d9;font-weight:700}.input{padding:11px 12px;border-radius:10px;border:1px solid #39536b;background:#0b1626;color:#f1f8ff;min-width:0;width:100%;font-size:13px}.input::placeholder{color:#647c97}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.help{color:#7d96af;font-size:11px}.sep{border-top:1px solid #314057;margin:20px 0}.admin-items{display:grid;gap:8px;max-height:230px;overflow:auto}.admin-item{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#111e30;border:1px solid #293f56;border-radius:9px;padding:9px 12px;font-size:12px}.admin-btn{padding:5px 9px;border-radius:7px;border:1px solid #3b5b78;background:#1c3855;color:#c5e9ff;cursor:pointer}.danger{color:#ffc1c6;border-color:#733e4c;background:#432332}.notice{font-size:12px;background:#d5a14319;border:1px solid #a7794259;color:#e4ba81;border-radius:9px;padding:10px 13px;margin-bottom:18px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:12px 18px;background:#2c5d78;color:white;border:1px solid #85dafa;border-radius:10px;box-shadow:0 12px 35px #0009;z-index:200;font-size:12px}.hidden{display:none!important}
@media(max-width:850px){.hero{padding:55px 0 38px}.hero-grid{grid-template-columns:1fr}.showcase{display:none}.how{grid-template-columns:1fr}.container{padding-inline:19px}}@media(max-width:620px){.topbar{height:68px}.brand-text b{font-size:13px}.brand-text span{font-size:9px}.brand-mark{width:40px;height:46px}.nav-link{display:none}.nav-actions{gap:6px}.nav-actions .btn{font-size:11px;padding:8px 9px}.hero{padding:45px 0 29px}.hero h1{font-size:43px;margin:20px 0 14px}.hero-lead{font-size:13px;margin-bottom:23px}.stats{gap:8px}.stat{padding:11px 12px}.stat .num{font-size:20px}.stat .desc{font-size:10px}.sectionhead{margin-top:25px}.sectionhead h2{font-size:24px}.section-side{display:none}.toolbar{padding:10px}.searchbox{max-width:none;min-width:100%}.selector{width:100%}.rank-list{gap:10px}.rank-row{grid-template-columns:103px 1fr;min-height:150px;border-radius:13px}.rank-side{padding:10px 3px}.rank-icon{width:98px;height:58px}.rank-name{font-size:16px}.rank-eng{font-size:7px;letter-spacing:.08em}.rank-content{padding:12px 10px}.rank-top{margin-bottom:12px}.rank-label{font-size:11px}.count{font-size:10px;padding:3px 8px}.people{gap:10px 4px}.person{width:71px}.person-avatar{height:53px;width:53px}.person-name{font-size:10px;max-width:68px}.demo-marker{top:42px;right:0}.empty{font-size:11px;min-height:58px}.info-panel,.owner-panel{padding:22px}.info-steps{grid-template-columns:1fr;gap:12px}.footrow{flex-direction:column}.form-row{grid-template-columns:1fr}.modalbody{padding:17px}.modalhead{padding:16px 17px}}

.yt-preview{display:flex;gap:13px;align-items:center;padding:12px;background:#0a192a;border:1px solid #31506a;border-radius:12px;margin-top:8px}
.yt-preview-thumb{height:64px;width:64px;flex-shrink:0;border-radius:50%;background:radial-gradient(circle at 35% 20%,#395476,#172c43);border:2px solid #4e829a;overflow:hidden;display:grid;place-items:center;color:#aed6e9;font-size:24px}
.yt-preview-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.yt-preview-info{min-width:0;flex:1;display:grid;gap:3px}
.yt-preview-info b{font-size:12px;color:#d8f0ff}
.yt-preview-info p{font-size:11px;color:#a8bfd2;line-height:1.55;margin:0;overflow-wrap:anywhere}
.yt-preview-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:9px 0 0}
.yt-preview-actions .btn{font-size:11px;padding:7px 10px}
.yt-success{color:#8ce7b5!important}.yt-error{color:#f0bc99!important}.fallback-emoji{position:absolute;inset:0;display:grid;place-items:center}
.person-avatar,.avatar-mini,.profile-avatar{position:relative}
.person-avatar img,.profile-avatar img{position:absolute;inset:0;z-index:2;width:100%;height:100%;display:block;object-fit:cover;border-radius:50%}
.person-avatar .fallback-emoji,.profile-avatar .fallback-emoji{z-index:0}
@media(max-width:620px){.yt-preview{gap:9px}.yt-preview-thumb{width:55px;height:55px}}

/* Rank emblems v5: use intact, transparent game-client assets; do not crop or blend screenshots. */
.rank-side{padding:15px 8px 17px;isolation:initial}
.emblem-stage{position:relative;width:146px;height:99px;max-width:100%;margin:0 auto 2px;overflow:hidden;flex:none;display:block;pointer-events:none}
.emblem-stage .rank-icon{
  position:absolute;left:50%;top:50%;width:460px;height:auto;max-width:none;min-width:0;
  display:block;object-fit:unset;transform:translate(-50%,-50%);margin:0;
  filter:drop-shadow(0 7px 12px rgba(0,0,0,.20));mix-blend-mode:normal;
}
.emblem-stage .emblem-error-icon{display:none;position:absolute;inset:0;place-items:center;font-size:54px;color:var(--accent)}
.emblem-stage.source-error .rank-icon{display:none}
.emblem-stage.source-error .emblem-error-icon{display:grid}
.rank-name{margin-top:0;line-height:1.15}
.rank-eng{margin-top:3px}
.showcase-emblem-stage{position:relative;flex:0 0 164px;width:164px;height:143px;overflow:hidden}
.showcase-emblem-stage .showcase-icon{position:absolute;left:50%;top:50%;width:550px;height:auto;max-width:none;object-fit:unset;transform:translate(-50%,-50%);margin:0;filter:drop-shadow(0 10px 18px rgba(0,0,0,.2))}
@media(max-width:620px){
 .rank-side{padding:10px 3px 12px}
 .emblem-stage{width:99px;height:76px;margin-bottom:2px}
 .emblem-stage .rank-icon{width:332px}
 .emblem-stage .emblem-error-icon{font-size:38px}
 .rank-name{margin-top:0;font-size:16px;line-height:1.15}
 .rank-eng{font-size:7px;margin-top:2px}
}


/* Featured VTuber shuffle: one fair round of all non-demo records, including on mobile. */
.featured-heading{position:relative;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.featured-cycle{font-size:10px;color:#95acc3;letter-spacing:.025em}
#featuredShowcase{--featured-color:#c796ff}
#featuredShowcase .showcase-title small{color:var(--featured-color)}
#featuredShowcase .showcase-flex{position:relative;z-index:1}
.featured-rank-text{min-width:0}
#featuredShowcase .showcase-title span{display:block;line-height:1.2;word-break:keep-all}
#featuredShowcase .featured-person{width:100%;color:inherit;text-align:left;cursor:pointer;transition:background .2s,border-color .2s,transform .2s;z-index:1}
#featuredShowcase .featured-person:hover{background:#25334b;border-color:#7596b5;transform:translateY(-1px)}
#featuredShowcase .featured-person:disabled{opacity:.62;cursor:default;transform:none}
#featuredShowcase .avatar-mini{flex:0 0 45px;overflow:hidden;border-color:var(--featured-color);font-size:22px}
#featuredShowcase .avatar-mini img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%;position:absolute;inset:0;z-index:2}
#featuredShowcase .mini-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
#featuredShowcase .mini-text b{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#featuredShowcase .mini-text span{display:block;font-size:11px;color:#a3b8cc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#featuredShowcase .mini-pill{color:var(--featured-color);margin-left:0;flex:none;white-space:nowrap;background:color-mix(in srgb,var(--featured-color) 13%,transparent);font-weight:750}
.featured-chevron{font-size:22px;color:#8cacc7;line-height:1}
.featured-actions{position:relative;z-index:1;margin-top:11px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.featured-actions span{font-size:10px;color:#7e98b0}
.featured-next{border:1px solid #405c78;background:#12273d;color:#c5e7fb;font-size:11px;border-radius:99px;padding:5px 11px;white-space:nowrap}
.featured-next:hover{background:#1e3e58}
.featured-next:disabled{opacity:.4;cursor:default}
@media(max-width:850px){.showcase{display:block;max-width:560px;width:100%;margin-inline:auto}}
@media(max-width:620px){.showcase{padding:17px;border-radius:18px;min-height:0}.showcase-flex{gap:10px;margin-top:10px;align-items:flex-start}.showcase-spotlight{flex:0 0 126px;width:126px;height:126px}.showcase-avatar-shell{width:108px;height:108px}.showcase-avatar{font-size:54px}.showcase-title-row{gap:10px;align-items:center}.showcase-rank-badge{width:72px;height:50px}.showcase-icon{width:72px;height:50px}.showcase-title{font-size:28px}.showcase-title small{margin-bottom:5px;font-size:10px}.showcase-sub{font-size:10px}.mini-card{margin-top:9px}.featured-cycle{font-size:9px}#featuredShowcase .avatar-mini{flex-basis:39px;width:39px;height:39px}.featured-actions span{font-size:9px}}
@media(prefers-reduced-motion:reduce){#featuredShowcase .featured-person{transition:none}}


/* 完整牌位徽章：沿用原版精選牌位的裁切方式，不使用失真的裁圖檔。 */
#featuredShowcase .featured-rank-text{flex:1;min-width:0}
#featuredShowcase .showcase-title-row{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
#featuredShowcase .showcase-rank-badge{
  flex:0 0 130px;width:130px;height:113px;position:relative;overflow:hidden;
  padding:0;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;display:block;
}
#featuredShowcase .showcase-rank-badge .showcase-icon{
  position:absolute;left:50%;top:50%;width:436px;height:auto;max-width:none;
  object-fit:unset;transform:translate(-50%,-50%);margin:0;
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.24));
}
@media(max-width:620px){
  #featuredShowcase .showcase-rank-badge{flex-basis:112px;width:112px;height:98px}
  #featuredShowcase .showcase-rank-badge .showcase-icon{width:376px}
  #featuredShowcase .showcase-title-row{gap:6px}
}
@media(max-width:380px){
  #featuredShowcase .showcase-spotlight{flex-basis:108px;width:108px;height:116px}
  #featuredShowcase .showcase-avatar-shell{width:100px;height:100px}
  #featuredShowcase .showcase-rank-badge{flex-basis:95px;width:95px;height:83px}
  #featuredShowcase .showcase-rank-badge .showcase-icon{width:318px}
  #featuredShowcase .showcase-title{font-size:26px}
}

/* 精選輪播下方資訊卡：不重複顯示頭像，讓姓名成為主視覺 */
#featuredShowcase .featured-person{padding:15px 17px;gap:12px;min-height:70px}
#featuredShowcase .mini-text{gap:5px}
#featuredShowcase .mini-text b{font-size:20px;line-height:1.25;font-weight:850;letter-spacing:.01em}
#featuredShowcase .mini-text span{font-size:11px;line-height:1.4}
@media(max-width:620px){
  #featuredShowcase .featured-person{padding:13px 15px;min-height:67px}
  #featuredShowcase .mini-text b{font-size:18px}
}

/* Empty showcase should not display broken image placeholders. */
#featuredShowcase.featured-empty .showcase-rank-badge{display:none!important}
#featuredShowcase.featured-empty .featured-person{display:none!important}
#featuredShowcase.featured-empty .showcase-title-row{display:block!important}
/* LoL / VALORANT one-click switcher */
.game-switch-bar{padding:13px 0 0;position:relative;z-index:2}
.game-tabs{display:flex;align-items:center;gap:7px;width:fit-content;max-width:100%;padding:5px;background:#101b2c;border:1px solid #293e56;border-radius:15px;box-shadow:0 10px 28px #00000022}
.game-tab{display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;background:transparent;color:#92a8bf;font-size:12px;font-weight:780;padding:10px 20px;min-height:42px;border-radius:11px;white-space:nowrap;transition:background .18s,color .18s,border-color .18s}
.game-tab:hover{color:#fff;background:#1d3046}.game-tab[aria-selected="true"]{color:#eff9ff;background:linear-gradient(135deg,#224e71,#1b3655);border-color:#3d7294;box-shadow:0 6px 18px #0003}
.game-tab.val-tab[aria-selected="true"]{color:#ffeef0;background:linear-gradient(135deg,#752c3e,#462232);border-color:#a54962}
.game-tab .tab-glyph{font-size:16px;font-weight:900;line-height:1}.game-tab .tab-logo{width:20px;height:20px;display:block;object-fit:contain;filter:drop-shadow(0 1px 4px rgba(0,0,0,.22))}
.game-tab .val-glyph{color:#ff697b;letter-spacing:-.16em;font-size:15px;padding-right:3px}.game-tab .val-logo{width:18px;height:18px;display:block;flex:0 0 auto;filter:drop-shadow(0 1px 4px rgba(0,0,0,.18))}.game-tab .val-logo path{fill:#ff5d6d}
.mode-valorant{--blue:#ff7082;--gold:#edb9c1}
.mode-valorant .hero:after{background:radial-gradient(circle,#942a4660,transparent 66%)}
.mode-valorant .eyebrow{color:#ffacb8}.mode-valorant .dot{background:#ff637c;box-shadow:0 0 10px #ff637c}
.mode-valorant .hero h1 span{color:#ff94a1;text-shadow:0 0 42px #ff456a4d}
.mode-valorant .btn-primary{background:linear-gradient(135deg,#b83c5b,#81263e);border-color:#dc6a81;color:#fff}
.mode-valorant .brand-mark{width:52px;height:58px;min-width:52px;display:grid;place-items:center}
.mode-valorant .brand-val-mark{width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:#ff465520;border:1px solid #ff465555}
.mode-valorant .brand-val-mark svg{width:29px;height:29px}
.mode-valorant .chip.active{background:#752b43;border-color:#a95067;color:#ffccd4}
.mode-valorant .section-kicker{color:#ff9daa}
/* Valorant-api emblems are transparent, centered icons. Never use the LoL zoom-and-crop treatment here. */
.mode-valorant .emblem-stage{width:138px;height:100px;overflow:visible;display:grid;place-items:center}
.mode-valorant .emblem-stage .rank-icon{position:static;transform:none;width:112px;height:96px;min-width:0;max-width:100%;object-fit:contain;filter:drop-shadow(0 5px 13px #0007)}
.mode-valorant #featuredShowcase .showcase-rank-badge{overflow:visible;display:grid;place-items:center}
.mode-valorant #featuredShowcase .showcase-rank-badge .showcase-icon{position:static;transform:none;width:105px;height:105px;max-width:100%;object-fit:contain;filter:drop-shadow(0 8px 14px #0006)}
.mode-valorant .rank-row{background:radial-gradient(ellipse 70% 150% at 1% 50%,var(--ambient),transparent 80%),linear-gradient(100deg,#17202f,#121724 80%)}
@media(max-width:620px){
 .game-switch-bar{padding:10px 0 0}.game-tabs{display:grid;grid-template-columns:1fr 1fr;width:100%}.game-tab{font-size:11px;gap:6px;padding:9px 8px;min-width:0}
 .mode-valorant .emblem-stage{width:96px;height:74px}.mode-valorant .emblem-stage .rank-icon{width:84px;height:70px}
 .mode-valorant #featuredShowcase .showcase-rank-badge .showcase-icon{width:83px;height:85px}
}
@media(max-width:380px){.game-tab{font-size:10px}.mode-valorant #featuredShowcase .showcase-rank-badge .showcase-icon{width:70px;height:70px}}
/* 所屬勢別：個人勢、社團勢、企業勢與團體名稱輸入 */
#agencyNameWrap[hidden]{display:none!important}
.profile-affiliation{color:#d4e4f6;font-size:13px;margin-top:10px}
.profile-affiliation strong{color:#8fd9ff;font-weight:750}

/* Google Forms enrollment: one direct CTA for the selected game */
.join-form-intro{background:#0b1728;border:1px solid #334962;border-radius:13px;padding:18px 19px;margin-bottom:16px}
.join-form-label{font-size:12px;letter-spacing:.08em;font-weight:850;color:#8cd9ff}
.join-form-intro p{font-size:13px;line-height:1.9;color:#bed0e4;margin:10px 0 0}
.join-form-intro p+p{font-size:12px;color:#93aac4;margin-top:7px}
.join-form-link{display:flex;width:100%;min-height:54px;padding:14px 18px;font-size:16px;white-space:normal;text-align:center}
.join-form-help{color:#91a7bd;font-size:12px;line-height:1.8;margin:13px 3px 0}
.mode-valorant .join-form-label{color:#ff8ea2}

/* Profile: secondary game tier, shown only for a uniquely matched VTuber in both games. */

textarea.input{resize:vertical;min-height:90px} .admin-items{max-height:55vh}.admin-item{flex-wrap:wrap}.admin-item small{display:block;color:var(--muted)}.form-error{color:#ffc1c6;white-space:pre-wrap}.consent-options{display:grid;gap:10px;margin:10px 0 20px}.consent-options label{display:flex;align-items:flex-start;gap:8px}.admin-filter{margin:15px 0}.admin-item button:disabled{opacity:.5}
[hidden]{display:none!important}.consent-options{border:1px solid #39536b;border-radius:10px;padding:12px;font-size:12px;color:#b1c6d9}.consent-options legend{padding:0 5px;font-weight:700}

/* Enrollment cards keep their content within the grid at every width. */
#rankings,#howto{scroll-margin-top:105px}
.how>.info-panel,.how>.owner-panel,.info-steps>.step{min-width:0}
.how p,.step span{overflow-wrap:anywhere}
.how .info-panel{display:flex;flex-direction:column;align-items:flex-start}
.info-steps{width:100%;align-items:start}
#copyJoin{margin-top:23px;max-width:100%;white-space:normal;text-align:center}
/* Bundled emblems are complete transparent icons; display them without zooming. */
.emblem-stage .rank-icon{position:static;transform:none;width:100%;height:100%;max-width:100%;object-fit:contain}
#featuredShowcase .showcase-rank-badge .showcase-icon{position:static;transform:none;width:100%;height:100%;max-width:100%;object-fit:contain}
@media(max-width:1000px) and (min-width:851px){.info-steps{grid-template-columns:1fr;gap:14px}.step{width:100%}}
@media(max-width:620px){#rankings,#howto{scroll-margin-top:88px}.how{gap:16px;margin-top:32px}.how>.info-panel,.how>.owner-panel{padding:22px}.info-steps{grid-template-columns:1fr}.step{padding-top:14px}.step span{line-height:1.8}#copyJoin{width:100%}}

.riot-disclaimer{margin-top:22px;padding:18px 20px;border:1px solid #33465b;border-radius:11px;background:#111d2d;color:#a9bbce;font-size:12px;line-height:1.85;overflow-wrap:anywhere}
.riot-disclaimer strong{color:#d0deed;font-size:13px}
.riot-disclaimer p{margin:8px 0 0}
.riot-disclaimer em{font-style:italic}
@media(max-width:620px){.riot-disclaimer{padding:15px 16px;font-size:11px}}
