:root{
  --bg:#050913;
  --panel:#0a101d;
  --panel-2:#0d1423;
  --line:#1a2436;
  --text:#f6f7fb;
  --muted:#8e98ab;
  --purple:#7b2cff;
  --purple2:#aa4cff;
  --pink:#ff3b9d;
  --green:#55e37b;
  --gold:#ffc84d;
  --blue:#48a9ff;
  --shadow:0 20px 50px rgba(0,0,0,.30);
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;font-family:Inter,system-ui,sans-serif;background:
radial-gradient(circle at 25% 0%,rgba(123,44,255,.08),transparent 28%),
linear-gradient(180deg,#050913,#070b14 45%,#050913);color:var(--text)}
button,input{font:inherit}
button{cursor:pointer}
.app-shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;padding:22px 14px;border-right:1px solid #111927;background:rgba(4,8,16,.88);backdrop-filter:blur(18px);display:flex;flex-direction:column;gap:16px}
.brand{display:flex;align-items:center;gap:10px;padding:0 18px 10px}
.brand-word{font-weight:900;font-size:30px;letter-spacing:-1.5px;font-style:italic}
.brand-mark{font-size:29px;color:var(--purple2)}
.nav{display:flex;flex-direction:column;gap:6px}
.nav-item{border:0;background:transparent;color:#cfd5df;padding:11px 13px;border-radius:10px;text-align:left;display:flex;align-items:center;gap:12px}
.nav-item span{flex:1}
.nav-item:hover,.nav-item.active{background:linear-gradient(90deg,rgba(123,44,255,.28),rgba(123,44,255,.08));color:#fff}
.pill{background:#8e2af0;border-radius:999px;padding:2px 7px;font-size:11px}
.boost-card,.level-card,.profile-mini{border:1px solid var(--line);border-radius:13px;background:linear-gradient(180deg,rgba(17,24,39,.9),rgba(9,14,25,.95));padding:14px}
.boost-card{margin-top:auto}.boost-title{font-weight:800;color:#c99bff;margin-bottom:6px}
.level-card{display:grid;gap:8px;text-align:center}.level-badge{margin:2px auto;font-size:32px;font-weight:900;width:76px;height:76px;border:2px solid #9f6eff;border-radius:24px;display:grid;place-items:center;transform:rotate(45deg);background:linear-gradient(135deg,#2e1a51,#10182a)}.level-badge::first-line{transform:rotate(-45deg)}
.xp-row{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}
.progress{height:6px;background:#141d2d;border-radius:999px;overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--purple),var(--purple2))}
.profile-mini{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center}.mini-points{grid-column:1/-1;color:#f2cf66}.avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#313b50,#111827);border:1px solid #44506a;font-weight:800}.avatar.small{width:38px;height:38px}
.main{padding:24px 26px 40px;min-width:0}
.topbar{display:flex;justify-content:space-between;gap:22px;align-items:flex-start;margin-bottom:22px}.hello{font-size:17px;font-weight:700}.topbar h1{margin:7px 0 4px;font-size:26px}.topbar p,.widget p{color:var(--muted);margin:0}.top-actions{display:flex;align-items:center;gap:10px}.search{width:365px;height:42px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#080e19;border-radius:10px;padding:0 12px}.search input{border:0;outline:0;color:white;background:transparent;width:100%}.icon-btn{width:42px;height:42px;border:1px solid var(--line);background:#080e19;color:#dfe5ef;border-radius:10px}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:12px}.stat-card{border:1px solid var(--line);background:rgba(10,16,29,.9);border-radius:12px;padding:13px 15px;display:flex;align-items:center;gap:10px}.stat-card strong{font-size:18px;display:block}.stat-card span{font-size:11px;color:var(--muted)}.stat-icon{width:33px;height:33px;display:grid;place-items:center;border-radius:10px;background:#151d2c}.stat-icon.yellow{color:#ffca44}.stat-icon.gold{color:#ff9f2f}.stat-icon.violet{color:#bf6cff}.stat-icon.grey{color:#bbc3d4}
.widget{border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,rgba(10,16,29,.94),rgba(7,12,22,.94));box-shadow:var(--shadow);padding:14px}.widget.hidden-widget{display:none}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.section-head h2{font-size:15px;margin:0}.head-actions{display:flex;gap:8px}.text-btn,.dots{background:transparent;color:var(--muted);border:0}.text-btn:hover{color:#fff}
.action-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.action-card{min-height:90px;text-align:left;border:1px solid #1b2639;border-radius:12px;color:white;background:linear-gradient(135deg,#111829,#0c1322);padding:14px;transition:.18s transform,.18s border-color}.action-card:hover{transform:translateY(-2px);border-color:#6233a7}.action-card .big-icon{font-size:24px;margin-bottom:8px}.action-card strong{display:block}.action-card span{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(310px,.9fr);gap:12px;margin-top:12px}.content-col,.right-col{display:flex;flex-direction:column;gap:12px}
.people-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.person-card{position:relative;overflow:hidden;min-height:245px;border:1px solid #222b3b;border-radius:12px;background:linear-gradient(180deg,#20293a 0%,#111827 44%,#0b111d 100%);padding:16px;display:flex;flex-direction:column;justify-content:flex-end}.person-bg{position:absolute;inset:0;background:radial-gradient(circle at 50% 20%,var(--personColor),transparent 40%);opacity:.45}.person-card>*:not(.person-bg){position:relative}.person-card h3{margin:0 0 4px}.person-card .points{color:#aab2c1;font-size:13px;margin-bottom:12px}.card-actions{display:grid;grid-template-columns:1fr 1fr auto;gap:7px}.card-actions button{height:34px;border:1px solid #26334a;background:#111a2a;color:white;border-radius:9px}.card-actions .heart:hover{background:#4a1231}.card-actions .message:hover{background:#123654}
.badges-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:14px}.badge{text-align:center}.badge-emblem{width:62px;height:62px;margin:0 auto 8px;display:grid;place-items:center;border-radius:20px;transform:rotate(45deg);border:2px solid var(--badgeColor);box-shadow:inset 0 0 25px color-mix(in srgb,var(--badgeColor) 20%, transparent)}.badge-emblem span{font-size:27px;transform:rotate(-45deg)}.badge strong{display:block;font-size:12px}.badge small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.split-row{display:grid;grid-template-columns:1fr 1.45fr;gap:12px}.activity-list{display:grid;gap:4px}.activity-item{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:10px 3px;border-bottom:1px solid #151d2a;font-size:12px}.act-icon{width:34px;height:34px;border-radius:10px;background:#121b2b;display:grid;place-items:center}.gain{color:#ff55b0;font-size:11px}
.friends-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.friend{text-align:center;font-size:11px}.friend .avatar{margin:0 auto 6px}.friend b{display:block}.friend span{color:var(--green);font-size:10px}
.crew-line{display:grid;grid-template-columns:auto 1fr 2fr auto;gap:12px;align-items:center}.crew-logo{width:50px;height:50px;border-radius:14px;background:#421376;display:grid;place-items:center;font-size:27px}.crew-score{font-size:12px;color:#aab3c1}.crew-score .progress{margin-top:6px}
.primary-btn,.secondary-btn{border-radius:9px;padding:10px 15px;border:1px solid #6833a6}.primary-btn{background:linear-gradient(90deg,#5720a4,#7e27d9);color:white}.secondary-btn{background:#0e1523;color:white;border-color:#28334a}
.rank-tabs{display:grid;grid-template-columns:1fr 1fr;background:#0b111d;border:1px solid #1a2434;border-radius:9px;padding:3px;margin-bottom:12px}.rank-tabs button{border:0;background:transparent;color:#8f99ad;padding:8px;border-radius:7px}.rank-tabs button.active{color:#fff;background:linear-gradient(90deg,#551c9d,#7428bd)}.rank-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ranking{margin:0;padding-left:28px}.ranking li{padding:8px 0;border-bottom:1px solid #111a28}.rank-row{display:flex;justify-content:space-between;gap:8px;font-size:12px}.rank-row strong{font-weight:600}.rank-row span{color:#afb8c7}
.group-rank{display:grid;gap:8px}.group-item{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px;border-bottom:1px solid #151d2c}.medal{width:30px;height:30px;border-radius:9px;background:#1b2434;display:grid;place-items:center}.group-item span{color:#b4bdcc;font-size:12px}
.customize-card{display:flex;justify-content:space-between;align-items:center}.customize-card h2{margin:0 0 6px;font-size:16px}.customize-card p{font-size:12px;margin-bottom:12px}.custom-art{font-size:52px;color:#ad72ff}
.friend-activity{display:grid;gap:14px;font-size:12px}.friend-activity>div{padding-bottom:10px;border-bottom:1px solid #141d2c}.friend-activity small{display:block;color:var(--muted);margin-left:14px;margin-top:3px}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:8px}.orange{background:#ff9f40}.green{background:#4be477}.blue{background:#4aa4ff}.pink{background:#ff4b9f}
.muted{color:var(--muted);font-size:12px}
dialog{width:min(560px,92vw);border:1px solid #26334a;border-radius:16px;background:#0a101c;color:white;padding:0;box-shadow:0 30px 100px rgba(0,0,0,.6)}dialog::backdrop{background:rgba(0,0,0,.65);backdrop-filter:blur(6px)}dialog form{padding:18px}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start}.dialog-head h2{margin:0 0 5px}.dialog-head p{margin:0;color:var(--muted)}.toggle-list{display:grid;gap:8px;margin:18px 0}.toggle-row{display:flex;align-items:center;justify-content:space-between;border:1px solid #1b2638;border-radius:10px;padding:11px}.toggle-row label{font-weight:600}.switch{position:relative;width:48px;height:26px;background:#1a2230;border-radius:999px;border:1px solid #2e394d}.switch input{display:none}.switch span{position:absolute;top:3px;left:3px;width:18px;height:18px;background:#818da1;border-radius:50%;transition:.2s}.switch input:checked+span{left:25px;background:white}.switch:has(input:checked){background:#6a24ba}.dialog-actions{display:flex;justify-content:flex-end;gap:9px}
.toast{position:fixed;right:20px;bottom:20px;padding:12px 16px;border-radius:10px;background:#111a28;border:1px solid #2e3a51;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}
@media(max-width:1250px){.people-grid{grid-template-columns:repeat(3,1fr)}.badges-grid{grid-template-columns:repeat(4,1fr)}.action-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:980px){.app-shell{grid-template-columns:78px 1fr}.sidebar{padding:18px 9px}.brand-word,.nav-item span,.pill,.boost-card,.level-card,.profile-mini{display:none}.brand{padding:0;justify-content:center}.nav-item{justify-content:center}.layout{grid-template-columns:1fr}.top-actions .search{width:240px}.stats-row{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.main{padding:16px 12px}.topbar{flex-direction:column}.top-actions{width:100%}.top-actions .search{flex:1}.stats-row,.action-grid,.split-row{grid-template-columns:1fr 1fr}.people-grid{grid-template-columns:repeat(2,1fr)}.badges-grid{grid-template-columns:repeat(3,1fr)}.crew-line{grid-template-columns:auto 1fr}.crew-score,.crew-line button{grid-column:1/-1}.friends-row{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.app-shell{display:block}.sidebar{display:none}.stats-row,.action-grid,.split-row,.people-grid{grid-template-columns:1fr}.badges-grid{grid-template-columns:repeat(2,1fr)}.rank-columns{grid-template-columns:1fr}.top-actions .icon-btn:nth-of-type(2),.top-actions .icon-btn:nth-of-type(3){display:none}}


/* Authentication */
.auth-gate{
  position:fixed; inset:0; z-index:1000; display:grid; place-items:center;
  background:
    radial-gradient(circle at 20% 15%,rgba(123,44,255,.22),transparent 30%),
    radial-gradient(circle at 80% 80%,rgba(255,59,157,.12),transparent 30%),
    rgba(3,7,14,.96);
  backdrop-filter:blur(18px);
  padding:20px;
}
.auth-gate.hidden{display:none}
.auth-card{
  width:min(460px,100%); padding:30px; border:1px solid #27344c; border-radius:20px;
  background:linear-gradient(180deg,rgba(13,20,35,.98),rgba(7,12,22,.98));
  box-shadow:0 35px 100px rgba(0,0,0,.55);
}
.auth-brand{font-weight:900;font-size:30px;font-style:italic;letter-spacing:-1px;margin-bottom:24px}
.auth-brand span{color:#a04cff}
.auth-card h1{margin:0 0 8px;font-size:26px}
.auth-card>p{color:var(--muted);margin:0 0 22px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:#070c15;border:1px solid var(--line);padding:4px;border-radius:11px;margin-bottom:20px}
.auth-tabs button{border:0;border-radius:8px;padding:10px;background:transparent;color:var(--muted)}
.auth-tabs button.active{background:linear-gradient(90deg,#5520a2,#8228db);color:white}
.auth-field{display:grid;gap:7px;margin-bottom:14px}
.auth-field.hidden{display:none}
.auth-field label{font-size:12px;color:#c9d0dc;font-weight:600}
.auth-field input{width:100%;height:44px;border-radius:10px;border:1px solid #243149;background:#080e19;color:white;padding:0 12px;outline:0}
.auth-field input:focus{border-color:#7b2cff;box-shadow:0 0 0 3px rgba(123,44,255,.12)}
.auth-submit{width:100%;margin-top:4px}
.auth-message{min-height:22px;margin-top:14px;font-size:12px;color:#ff8996}
.auth-message.success{color:#67e88b}
.auth-note{margin-top:14px;text-align:center;font-size:11px;color:#717d90}


/* V3 profile */
.profile-form-grid{display:grid;gap:14px;margin:18px 0}
.auth-field textarea{
  width:100%; min-height:110px; resize:vertical; border-radius:10px;
  border:1px solid #243149; background:#080e19; color:white; padding:12px;
  outline:0; font:inherit;
}
.auth-field textarea:focus{border-color:#7b2cff;box-shadow:0 0 0 3px rgba(123,44,255,.12)}
.profile-stats-box{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0
}
.profile-stats-box>div{
  text-align:center;padding:12px;border:1px solid #1d283b;background:#0b111d;border-radius:10px
}
.profile-stats-box strong{display:block;font-size:18px}
.profile-stats-box span{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.sync-badge{
  display:inline-flex;align-items:center;gap:6px;font-size:10px;color:#6ee58b;
  padding:4px 8px;border-radius:999px;border:1px solid #1e4931;background:#0c2215
}


/* ===== Nosta V4 ===== */
.eyebrow{font-size:10px;letter-spacing:.18em;color:#a872ff;font-weight:800;margin-bottom:5px}
.app-dialog{width:min(1180px,96vw);height:min(820px,92vh);padding:0;border:1px solid #26334a;border-radius:18px;background:#070c16;color:white;overflow:hidden}
.app-dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(8px)}
.app-dialog-shell{height:100%;display:flex;flex-direction:column}
.app-dialog-head{display:flex;justify-content:space-between;align-items:flex-start;padding:20px 22px;border-bottom:1px solid #182238;background:linear-gradient(180deg,#0d1423,#090f1a)}
.app-dialog-head h2{margin:0 0 5px;font-size:23px}.app-dialog-head p{margin:0;color:var(--muted);font-size:12px}
.app-dialog-body{padding:18px;overflow:auto;flex:1}
.page-grid{display:grid;grid-template-columns:1.35fr .85fr;gap:14px}.page-grid.equal{grid-template-columns:1fr 1fr}
.panel{border:1px solid #1b2639;background:#0a111e;border-radius:14px;padding:15px}.panel h3{margin:0 0 12px;font-size:15px}
.form-row{display:flex;gap:8px;align-items:center}.form-row input,.form-row textarea,.form-row select,.input{
  width:100%;border:1px solid #26334b;background:#080e19;color:#fff;border-radius:9px;padding:10px 11px;outline:0
}
.form-row textarea,.input.textarea{min-height:86px;resize:vertical}
.list-stack{display:grid;gap:8px}.list-item{border:1px solid #18243a;background:#0b1321;border-radius:11px;padding:11px;display:flex;align-items:center;gap:10px}
.list-item .grow{flex:1;min-width:0}.list-item .title{font-weight:700;font-size:13px}.list-item .sub{font-size:11px;color:var(--muted);margin-top:3px}.list-actions{display:flex;gap:6px;flex-wrap:wrap}
.mini-btn{border:1px solid #2a3851;background:#111a2a;color:#fff;border-radius:8px;padding:7px 9px;font-size:11px}.mini-btn:hover{border-color:#6f35b5}.mini-btn.primary{background:#5820a6;border-color:#7330c7}.mini-btn.danger{background:#35111c;border-color:#6e273b;color:#ff9bad}
.person-result{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center}.person-result .avatar{width:42px;height:42px}
.post-card{border:1px solid #1b2639;border-radius:12px;background:#0b1220;padding:13px;margin-bottom:10px}.post-head{display:flex;gap:10px;align-items:center}.post-author{font-weight:700;font-size:13px}.post-time{font-size:10px;color:var(--muted)}.post-body{font-size:13px;line-height:1.5;margin:10px 0;white-space:pre-wrap}.post-actions{display:flex;gap:8px}.comments{margin-top:10px;border-top:1px solid #172236;padding-top:8px}.comment{font-size:11px;padding:7px 0;border-bottom:1px solid #121b2a}.comment strong{margin-right:5px}
.message-layout{display:grid;grid-template-columns:280px 1fr;gap:12px;height:600px}.conversation-list{overflow:auto}.conversation{padding:10px;border:1px solid #17243a;border-radius:10px;margin-bottom:7px;cursor:pointer}.conversation.active{border-color:#7135b8;background:#15102b}.chat-box{display:flex;flex-direction:column;min-height:0}.chat-messages{flex:1;overflow:auto;border:1px solid #17243a;background:#070d17;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:8px}.bubble{max-width:75%;padding:9px 11px;border-radius:12px;background:#121c2d;font-size:12px}.bubble.mine{align-self:flex-end;background:#4e218e}.bubble small{display:block;color:#aeb7c6;font-size:9px;margin-top:4px}.chat-compose{display:flex;gap:8px;margin-top:8px}
.badge-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.badge-card{border:1px solid #1a263a;border-radius:12px;padding:14px;text-align:center;background:#0a121f}.badge-card.locked{opacity:.38;filter:grayscale(.8)}.badge-icon{font-size:30px;margin-bottom:8px}
.rank-table{width:100%;border-collapse:collapse}.rank-table th,.rank-table td{padding:10px;border-bottom:1px solid #182236;text-align:left;font-size:12px}.rank-table th{color:#8f9aaf;font-weight:600}
.crew-hero{display:flex;align-items:center;gap:12px;padding:16px;border-radius:13px;background:linear-gradient(135deg,#261044,#0c1827);border:1px solid #3b225e}.crew-symbol{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:#6b28b9;font-size:29px}.crew-members{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:12px}.crew-member{text-align:center;padding:9px;border-radius:10px;border:1px solid #1b2940;background:#0b1321;font-size:11px}
.settings-list{display:grid;gap:9px}.setting-row{display:flex;justify-content:space-between;align-items:center;border:1px solid #1a2639;border-radius:11px;padding:12px}.setting-row strong{display:block;font-size:12px}.setting-row span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.empty-state{text-align:center;padding:35px 15px;color:var(--muted)}.empty-state .empty-icon{font-size:36px;margin-bottom:8px}
.toast.error{border-color:#70293b;color:#ff9eaa}.toast.success{border-color:#275d3a;color:#7ce99b}
@media(max-width:820px){.page-grid,.page-grid.equal,.message-layout{grid-template-columns:1fr}.message-layout{height:auto}.conversation-list{max-height:220px}.chat-messages{min-height:350px}.badge-gallery{grid-template-columns:repeat(2,1fr)}}


/* ===== Nosta V5 Minigames ===== */
.games-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.game-card{border:1px solid #1d2940;border-radius:14px;padding:16px;background:linear-gradient(160deg,#0e1727,#090f1b);min-height:190px;display:flex;flex-direction:column}
.game-card .game-icon{font-size:34px;margin-bottom:12px}
.game-card h3{margin:0 0 7px}.game-card p{color:var(--muted);font-size:12px;line-height:1.5;margin:0 0 15px}.game-card .game-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:auto;margin-bottom:12px}
.game-chip{font-size:10px;border:1px solid #27344a;background:#111a2a;border-radius:999px;padding:5px 8px;color:#b7c0d0}
.game-stage{min-height:430px;border:1px solid #1b283f;border-radius:15px;background:radial-gradient(circle at center,rgba(111,49,187,.15),transparent 45%),#080e18;display:grid;place-items:center;padding:18px;position:relative;overflow:hidden}
.game-center{text-align:center;max-width:520px}.game-center h2{font-size:28px;margin:0 0 10px}.game-center p{color:var(--muted);line-height:1.5}.game-scorebar{display:flex;justify-content:space-between;gap:10px;margin-bottom:10px}.game-scorebox{flex:1;border:1px solid #1d2a40;border-radius:10px;padding:10px;background:#0a121e;text-align:center}.game-scorebox strong{display:block;font-size:18px}.game-scorebox span{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.reaction-orb{width:170px;height:170px;border-radius:50%;display:grid;place-items:center;font-size:22px;font-weight:800;border:2px solid #32415c;background:#101827;user-select:none}
.reaction-orb.ready{background:#1e8d4a;border-color:#63eb8e;box-shadow:0 0 50px rgba(80,230,125,.24)}
.target-zone{position:relative;width:100%;height:390px;border:1px dashed #2b3952;border-radius:13px;background:#07101b;overflow:hidden}
.click-target{position:absolute;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#7b2cff;border:2px solid #c895ff;font-weight:900;box-shadow:0 0 25px rgba(123,44,255,.35)}
.memory-grid{display:grid;grid-template-columns:repeat(4,78px);gap:10px;justify-content:center}
.memory-cell{width:78px;height:78px;border-radius:12px;border:1px solid #293752;background:#111a29;display:grid;place-items:center;font-size:28px;cursor:pointer;user-select:none}
.memory-cell.flash{background:#6d2ac0;border-color:#c18cff;box-shadow:0 0 25px rgba(133,54,212,.3)}
.game-result{padding:14px;border:1px solid #283750;border-radius:11px;background:#0c1422;margin-top:14px}
.game-leaderboard{margin-top:14px}
.game-leaderboard table{width:100%;border-collapse:collapse}.game-leaderboard th,.game-leaderboard td{padding:8px;border-bottom:1px solid #17243a;font-size:11px;text-align:left}
@media(max-width:900px){.games-grid{grid-template-columns:1fr}.memory-grid{grid-template-columns:repeat(4,64px)}.memory-cell{width:64px;height:64px}}

/* ===== Nosta V8 separated point wallets ===== */
.separated-stats{grid-template-columns:repeat(6,1fr)}
.balance-stack{line-height:1.55}
.points-wallets{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0
}
.wallet-card{
  border:1px solid #223149;border-radius:12px;padding:14px;background:#0b1320
}
.wallet-card strong{display:block;font-size:22px}
.wallet-card span{display:block;color:var(--muted);font-size:11px;margin-top:4px}
@media(max-width:1350px){.separated-stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.separated-stats{grid-template-columns:repeat(2,1fr)}.points-wallets{grid-template-columns:1fr}}

/* ===== Nosta V9 vote point selection ===== */
.vote-dialog{
  width:min(520px,94vw);
  border:1px solid #2a3852;
  border-radius:18px;
  padding:0;
  background:#080e18;
  color:#fff;
  box-shadow:0 35px 100px rgba(0,0,0,.6);
}
.vote-dialog::backdrop{
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(7px);
}
.vote-dialog-shell{padding:20px}
.vote-choice-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:9px;
  margin:20px 0 14px;
}
.vote-choice-grid button{
  min-height:58px;
  border-radius:11px;
  border:1px solid #2d3c57;
  background:linear-gradient(160deg,#111b2d,#0c1321);
  color:#fff;
  font-weight:800;
  font-size:16px;
  transition:.16s transform,.16s border-color,.16s background;
}
.vote-choice-grid button:hover{
  transform:translateY(-2px);
  border-color:#9a5cf0;
  background:linear-gradient(160deg,#59239b,#37175f);
}
.vote-dialog-note{
  border:1px solid #1e2c42;
  background:#0b1422;
  border-radius:11px;
  padding:12px;
  font-size:11px;
  line-height:1.55;
  color:var(--muted);
}
.vote-dialog-note strong{color:#caa5ff}
@media(max-width:560px){
  .vote-choice-grid{grid-template-columns:repeat(2,1fr)}
}


/* ===== Nosta V10 — database tuned dashboard ===== */
.database-ok{color:#68e88a}
.level-card .level-badge{transform:rotate(45deg)}
.level-card .level-badge::before{content:attr(data-level);transform:rotate(-45deg)}
.level-card .level-badge{font-size:0}
#communityStatusCard .boost-title{color:#68e88a}
#homeActivityList .activity-item:last-child{border-bottom:0}
#onlineFriendsList .empty-state{grid-column:1/-1;width:100%}
.crew-empty{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  border:1px dashed #2a3851;border-radius:11px;padding:14px;background:#09111d
}
.crew-empty strong{display:block;margin-bottom:3px}
.crew-live-line{
  display:grid;grid-template-columns:auto 1fr 2fr auto;gap:12px;align-items:center
}
.home-rank-empty{list-style:none!important;color:var(--muted);font-size:12px;padding:12px 0!important}
@media(max-width:720px){.crew-live-line{grid-template-columns:auto 1fr}.crew-live-line .crew-score,.crew-live-line button{grid-column:1/-1}}


/* ===== Nosta V11 Badges ===== */
.badge-card .badge-progress{
  height:7px;
  border-radius:999px;
  background:#141d2c;
  overflow:hidden;
  margin-top:10px;
}
.badge-card .badge-progress span{
  display:block;
  height:100%;
  background:linear-gradient(90deg,#6a2ac4,#a34cff);
}
.badge-progress-text{
  font-size:10px;
  color:var(--muted);
  margin-top:5px;
}
.badge-card.unlocked{
  border-color:#5c358d;
  box-shadow:0 0 25px rgba(122,62,190,.08);
}
.badge-card.unlocked .badge-icon{
  filter:none;
}


/* ===== Nosta V12 Frontpage ===== */
.app-shell-v12{align-items:stretch}
.sidebar-v12{
  gap:14px;
  background:
    radial-gradient(circle at top left, rgba(155,84,255,.2), transparent 28%),
    linear-gradient(180deg,#060b14,#050912 45%,#050812);
}
.community-brand{
  border:1px solid #2a2e74;
  border-radius:22px;
  padding:18px 18px 16px;
  background:linear-gradient(180deg,rgba(120,60,255,.18),rgba(18,22,42,.85));
  box-shadow:0 14px 30px rgba(0,0,0,.32), inset 0 0 0 1px rgba(255,255,255,.03);
}
.brand-sub{
  color:#dbd6ff;
  font-size:13px;
  font-weight:700;
  margin-top:6px;
}
.sidebar-panel{
  border:1px solid #2b2d6c;
  border-radius:18px;
  padding:14px;
  background:linear-gradient(180deg,rgba(16,19,43,.95),rgba(6,10,24,.95));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}
.panel-title{
  color:#fff;
  font-weight:800;
  margin-bottom:10px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}
.panel-title span{color:#49f0b7;font-size:12px;font-weight:700}
.quick-vertical{display:grid;gap:10px}
.quick-pill{
  width:100%;
  text-align:left;
  border:1px solid #6236b8;
  border-radius:12px;
  padding:11px 12px;
  background:linear-gradient(90deg,rgba(95,39,193,.5),rgba(18,26,58,.8));
  color:#fff;
  font-weight:700;
}
.quick-pill:hover{transform:translateY(-1px)}
.mini-member-list{display:grid;gap:10px}
.mini-member{
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid #212953;
  border-radius:12px;
  padding:8px 10px;
  background:#090f1d;
}
.mini-member .avatar{
  width:36px;height:36px;border-radius:50%;
  font-size:14px;
}
.mini-member .meta{display:grid;gap:2px}
.mini-member .meta strong{font-size:13px}
.mini-member .meta span{font-size:11px;color:var(--muted)}
.empty-mini{color:var(--muted);font-size:12px}
.hero-level-card{border-color:#5030a5}
.profile-mini-v12{border-color:#2c2f5e}

.topbar-v12{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:24px;
}
.top-tabs{
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
}
.top-tab{
  border:1px solid #2a2d62;
  background:linear-gradient(180deg,#0c1430,#091121);
  color:#eae8ff;
  border-radius:999px;
  padding:10px 18px;
  font-weight:700;
}
.top-tab.active,
.top-tab:hover{
  border-color:#9d62ff;
  box-shadow:0 0 0 1px rgba(157,98,255,.15), 0 8px 22px rgba(94,44,180,.25);
}
.summary-v12 .stat-card{
  border-color:#2a2d68;
  background:linear-gradient(180deg,rgba(14,19,43,.92),rgba(8,12,26,.92));
}
.hero-layout-v12{
  display:grid;
  grid-template-columns:2.2fr 1fr;
  gap:18px;
  margin-top:18px;
}
.hero-banner-v12{
  position:relative;
  overflow:hidden;
  border:1px solid #6632c0;
  border-radius:26px;
  padding:30px 32px;
  min-height:248px;
  background:
    radial-gradient(circle at 78% 18%, rgba(91,160,255,.9), transparent 20%),
    radial-gradient(circle at 62% 20%, rgba(206,37,255,.5), transparent 18%),
    radial-gradient(circle at 15% 25%, rgba(255,173,67,.18), transparent 22%),
    linear-gradient(135deg,#0d1450 0%,#0a0f2e 35%,#0e0931 55%,#050916 100%);
  box-shadow:0 22px 48px rgba(0,0,0,.35);
}
.hero-banner-v12::after{
  content:"";
  position:absolute;
  inset:auto -8% 18% auto;
  width:68%;
  height:4px;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,#67f0ff,#e252ff,transparent);
  box-shadow:0 0 32px rgba(103,240,255,.75);
  transform:rotate(-10deg);
}
.hero-badge{
  display:inline-flex;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06);
  color:#ffd56f;
  border-radius:999px;
  padding:7px 12px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
}
.hero-banner-v12 h2{
  margin:18px 0 10px;
  font-size:42px;
  line-height:1.04;
}
.hero-banner-v12 h2 span{
  color:#ffd76f;
  text-shadow:0 0 18px rgba(255,215,111,.18);
}
.hero-banner-v12 p{
  max-width:62%;
  color:#ddd9ff;
  font-size:16px;
  line-height:1.6;
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hall-card-v12{
  border:1px solid #6b39d6;
  border-radius:24px;
  padding:20px;
  background:
    radial-gradient(circle at top center, rgba(255,166,64,.16), transparent 22%),
    linear-gradient(180deg,#111040,#090d20);
}
.section-head.alt p{margin:4px 0 0;color:var(--muted);font-size:12px}
.hall-podium{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:18px 0 16px;
}
.podium-card{
  border:1px solid #373a7e;
  border-radius:20px;
  padding:12px 10px;
  text-align:center;
  background:linear-gradient(180deg,#101745,#0a1023);
}
.podium-card.place-1{
  border-color:#ffb342;
  box-shadow:0 0 24px rgba(255,179,66,.18);
}
.podium-card .place{
  font-size:24px;
  font-weight:900;
  margin-bottom:8px;
}
.podium-card .avatar{
  margin:0 auto 8px;
  width:54px;height:54px;
}
.podium-card strong{display:block}
.podium-card span{display:block;color:var(--muted);font-size:12px}
.wide{width:100%}

.leaderboard-cards-v12{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin-top:18px;
}
.glow-widget,
.challenge-widget,
.customize-banner-v12{
  border:1px solid #3b2c84;
  border-radius:22px;
  background:linear-gradient(180deg,rgba(14,17,42,.94),rgba(7,10,22,.94));
  box-shadow:0 18px 40px rgba(0,0,0,.28), inset 0 0 0 1px rgba(255,255,255,.02);
}
.challenge-widget p{color:#d3cdf5;line-height:1.6}

.mini-rank-list{display:grid;gap:10px}
.rank-mini-row,
.badge-leader-row{
  display:grid;
  grid-template-columns:36px 1fr auto;
  gap:10px;
  align-items:center;
  border:1px solid #242b57;
  border-radius:14px;
  padding:10px 12px;
  background:#090f1d;
}
.rank-mini-row .rank-num,
.badge-leader-row .rank-num{
  width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;
  background:linear-gradient(180deg,#351980,#11183a);
  font-weight:800;
}
.rank-mini-row strong,
.badge-leader-row strong{font-size:14px}
.rank-mini-row span,
.badge-leader-row span{font-size:12px;color:var(--muted)}
.rank-mini-row em,
.badge-leader-row em{font-style:normal;font-weight:800;color:#fff}

.how-strip-v12{
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:14px;
}
.how-card{
  border:1px solid #44308d;
  border-radius:20px;
  padding:16px;
  background:
    linear-gradient(180deg,rgba(89,33,173,.16),rgba(9,13,27,.95));
  display:grid;
  gap:8px;
}
.how-icon{font-size:24px}
.how-card span{font-size:12px;color:#d4cef4;line-height:1.5}

.home-bottom-grid-v12{
  margin-top:18px;
  display:grid;
  grid-template-columns:1.3fr 1fr 1.1fr .95fr;
  gap:16px;
}
.badges-home-v12 .badge{
  min-height:138px;
}
.customize-banner-v12{
  margin-top:18px;
  padding:20px 22px;
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
}
.badge-leader-list{display:grid;gap:10px}

@media(max-width:1480px){
  .topbar-v12{grid-template-columns:1fr}
  .top-tabs{justify-content:flex-start}
  .hero-layout-v12{grid-template-columns:1fr}
  .leaderboard-cards-v12{grid-template-columns:repeat(2,1fr)}
  .how-strip-v12{grid-template-columns:repeat(3,1fr)}
  .home-bottom-grid-v12{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:980px){
  .leaderboard-cards-v12,
  .home-bottom-grid-v12,
  .how-strip-v12{grid-template-columns:1fr}
  .hall-podium{grid-template-columns:1fr}
  .hero-banner-v12 p{max-width:100%}
}


/* ===== Nosta V13 Community Rules ===== */
.rules-dialog{
  width:min(900px,95vw);
  max-height:92vh;
  padding:0;
  border:1px solid #5d36bb;
  border-radius:22px;
  background:#080d19;
  color:#fff;
  overflow:hidden;
  box-shadow:0 40px 120px rgba(0,0,0,.65);
}
.rules-dialog::backdrop{
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(8px);
}
.rules-dialog-shell{
  display:flex;
  flex-direction:column;
  max-height:92vh;
}
.rules-dialog-head{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:22px 24px;
  border-bottom:1px solid #29255f;
  background:
    radial-gradient(circle at 80% 0%,rgba(126,45,220,.25),transparent 38%),
    linear-gradient(180deg,#111236,#090f1e);
}
.rules-dialog-head h2{margin:0 0 6px;font-size:28px}
.rules-dialog-head p{margin:0;color:#bbb5df}
.rules-content{
  padding:22px 24px;
  overflow:auto;
  display:grid;
  gap:14px;
}
.rules-intro{
  margin:0;
  padding:16px;
  border:1px solid #36316c;
  border-radius:14px;
  background:linear-gradient(180deg,rgba(92,39,174,.18),rgba(9,13,27,.92));
  line-height:1.7;
  color:#e4e0ff;
}
.rule-section{
  border:1px solid #20294d;
  border-radius:15px;
  padding:16px 18px;
  background:#0a111f;
}
.rule-section h3{
  margin:0 0 10px;
  color:#fff;
  font-size:16px;
}
.rule-section ul{
  margin:0;
  padding-left:20px;
  color:#c9c5df;
  line-height:1.65;
}
.rule-section p{
  margin:0 0 9px;
  color:#c9c5df;
  line-height:1.65;
}
.rule-section.emphasis{
  border-color:#7136c7;
  background:linear-gradient(180deg,rgba(95,33,175,.18),#0a111f);
}
.rules-accept-box{
  border:1px solid #7954d5;
  border-radius:15px;
  padding:16px 18px;
  color:#efeaff;
  background:linear-gradient(90deg,rgba(105,42,198,.22),rgba(27,13,64,.4));
  line-height:1.6;
}
.rules-dialog-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:16px 24px;
  border-top:1px solid #29255f;
  background:#090f1d;
}


/* ===== Nosta V14 Crew Battles ===== */
.crew-battle-grid{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);
  gap:14px;
}
.crew-battle-hero{
  border-color:#7037c9;
  background:
    radial-gradient(circle at 80% 0%,rgba(121,47,218,.2),transparent 30%),
    linear-gradient(135deg,#20103b,#0d1726);
}
.battle-create-box{
  border:1px solid #2c3760;
  border-radius:13px;
  padding:14px;
  background:linear-gradient(180deg,#0d1627,#09111e);
  margin-bottom:16px;
}
.battle-create-box strong{display:block;margin-bottom:5px}
.battle-create-box p{margin:0 0 12px;line-height:1.55}
.battle-section-title{
  margin:16px 0 9px;
  color:#c8b6ff;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-weight:800;
}
.battle-list{display:grid;gap:10px}
.battle-card{
  position:relative;
  border:1px solid #29365c;
  border-radius:15px;
  padding:14px;
  background:linear-gradient(180deg,#0d1525,#09101c);
  overflow:hidden;
}
.battle-card.active{
  border-color:#7740cf;
  box-shadow:inset 0 0 30px rgba(113,51,203,.08);
}
.battle-status{
  position:absolute;
  top:10px;
  right:10px;
  border-radius:999px;
  padding:4px 8px;
  font-size:9px;
  letter-spacing:.08em;
  font-weight:900;
  border:1px solid #344261;
  background:#121a2a;
}
.battle-status.active{color:#6ff0a0;border-color:#246a42;background:#0d2819}
.battle-status.pending{color:#deb5ff;border-color:#6737a5;background:#211038}
.battle-status.completed{color:#ffd778;border-color:#765923;background:#2a210d}
.battle-status.declined{color:#ff98a7;border-color:#78303f;background:#2b1118}
.battle-versus{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:12px;
  align-items:center;
  margin-top:12px;
}
.battle-team{
  padding:12px;
  border-radius:12px;
  border:1px solid #202d4b;
  background:#0b1321;
  text-align:center;
}
.battle-team strong{display:block;font-size:14px}
.battle-team span{display:block;font-size:23px;font-weight:900;margin-top:4px}
.battle-team.winning{border-color:#397a51;box-shadow:inset 0 0 20px rgba(65,181,105,.08)}
.battle-team.losing{opacity:.76}
.battle-vs{font-weight:900;color:#a877ff;font-size:15px}
.battle-meta{color:var(--muted);font-size:10px;text-align:center;margin-top:10px}
.battle-actions{display:flex;justify-content:center;gap:8px;margin-top:12px}
.battle-history{display:grid;gap:8px}
.battle-history-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  border:1px solid #1d2a43;
  border-radius:10px;
  background:#0a121f;
  padding:10px;
}
.battle-history-row strong{display:block;font-size:12px}
.battle-history-row span{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.battle-history-row em{font-style:normal;font-weight:800;font-size:12px}
.crew-members-v14{grid-template-columns:repeat(2,1fr)}
@media(max-width:900px){
  .crew-battle-grid{grid-template-columns:1fr}
  .battle-versus{grid-template-columns:1fr}
  .battle-vs{margin:auto}
}


/* ===== Nosta V15 Launch Ready ===== */
.hidden-admin{display:none!important}
.system-chip{
  display:inline-flex;align-items:center;gap:7px;
  height:38px;padding:0 11px;border-radius:999px;
  border:1px solid #293750;background:#09111e;color:#bfc8d8;
  font-size:11px;font-weight:700;
}
.status-dot{width:8px;height:8px;border-radius:50%;background:#f0ad48;box-shadow:0 0 12px rgba(240,173,72,.35)}
.system-chip.ok .status-dot{background:#58e58a;box-shadow:0 0 12px rgba(88,229,138,.45)}
.system-chip.bad .status-dot{background:#ff6d7f;box-shadow:0 0 12px rgba(255,109,127,.45)}
.auth-link-btn{
  width:100%;margin-top:10px;border:0;background:transparent;color:#b895ff;
  font-size:12px;text-decoration:underline;text-underline-offset:3px
}
.report-dialog,.recovery-dialog{
  width:min(580px,94vw);border:1px solid #41316d;border-radius:18px;
  background:#080e18;color:#fff;padding:0;box-shadow:0 35px 100px rgba(0,0,0,.6)
}
.report-dialog::backdrop,.recovery-dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(7px)}
.report-dialog form,.recovery-dialog form{padding:20px}
.report-btn{
  border:1px solid #503143!important;background:#28121a!important;color:#ff9aaa!important
}
.admin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.admin-stat{
  border:1px solid #26344d;border-radius:12px;background:#0a121f;padding:14px
}
.admin-stat strong{display:block;font-size:24px}
.admin-stat span{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.admin-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:14px}
.admin-report{
  border:1px solid #26334b;border-radius:12px;background:#0a111e;padding:12px
}
.admin-report + .admin-report{margin-top:9px}
.admin-report-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.admin-report .reason{font-size:11px;color:#c69cff;text-transform:uppercase;letter-spacing:.06em;font-weight:800}
.admin-report p{color:#c8cede;font-size:12px;line-height:1.55;margin:8px 0}
.admin-actions{display:flex;gap:6px;flex-wrap:wrap}
.admin-user-card{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;
  border:1px solid #26344b;border-radius:12px;background:#0a121e;padding:10px;margin-bottom:8px
}
.role-chip,.status-chip{
  display:inline-flex;border-radius:999px;padding:3px 7px;font-size:9px;font-weight:800;border:1px solid #33405a
}
.role-chip.admin{border-color:#7548bc;color:#cfafff}
.status-chip.active{border-color:#2c6943;color:#79eda0}
.status-chip.suspended{border-color:#8a612b;color:#ffd17b}
.status-chip.banned{border-color:#773244;color:#ff9aaa}
.admin-point-row{display:grid;grid-template-columns:1fr 110px auto;gap:8px;margin-top:8px}
.launch-checklist{display:grid;gap:8px}
.launch-check{
  display:flex;align-items:center;gap:10px;border:1px solid #233149;border-radius:10px;padding:10px;background:#09111e
}
.launch-check .check-icon{font-size:18px}
.launch-check strong{display:block;font-size:12px}.launch-check span{display:block;font-size:10px;color:var(--muted)}
@media(max-width:900px){
  .admin-grid{grid-template-columns:repeat(2,1fr)}
  .admin-layout{grid-template-columns:1fr}
}
@media(max-width:560px){
  .admin-grid{grid-template-columns:1fr}
  .admin-user-card{grid-template-columns:auto 1fr}
  .admin-user-card .admin-actions{grid-column:1/-1}
  .admin-point-row{grid-template-columns:1fr}
}


/* ===== Nosta V16 — Profile + useful Admin ===== */
.profile-page-hero{
  position:relative;overflow:hidden;
  border:1px solid #5731a2;border-radius:22px;
  padding:22px;background:
    radial-gradient(circle at 78% 5%,rgba(137,67,235,.30),transparent 28%),
    radial-gradient(circle at 10% 20%,rgba(56,129,255,.18),transparent 25%),
    linear-gradient(135deg,#111936,#0a101e 55%,#130b28);
}
.profile-page-head{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center}
.profile-big-avatar{
  width:84px;height:84px;border-radius:22px;display:grid;place-items:center;
  font-size:34px;font-weight:900;border:1px solid #7048bd;
  background:linear-gradient(145deg,#302365,#10182d);box-shadow:0 10px 30px rgba(0,0,0,.3)
}
.profile-page-head h2{margin:0 0 4px;font-size:26px}
.profile-page-bio{margin-top:7px;color:#c9c5dd;line-height:1.5}
.profile-page-stats{
  display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-top:18px
}
.profile-page-stat{
  border:1px solid #293650;border-radius:12px;padding:11px;background:rgba(7,13,25,.68)
}
.profile-page-stat strong{display:block;font-size:18px}
.profile-page-stat span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.profile-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.7fr);gap:14px;margin-top:14px}
.profile-composer textarea{min-height:86px}
.my-post{
  border:1px solid #26334d;border-radius:14px;background:#09111e;padding:14px;margin-bottom:10px
}
.my-post-head{display:flex;justify-content:space-between;gap:10px;align-items:center}
.my-post-body{line-height:1.6;margin:10px 0;color:#e3e5ed;white-space:pre-wrap}
.my-post-meta{font-size:10px;color:var(--muted);display:flex;gap:10px}
.my-post-actions{display:flex;gap:6px;margin-top:10px}
.profile-badge-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.profile-mini-badge{
  text-align:center;border:1px solid #293653;border-radius:12px;background:#0a121f;padding:10px
}
.profile-mini-badge .icon{font-size:23px}.profile-mini-badge strong{display:block;font-size:10px;margin-top:4px}
.admin-toolbar{
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:10px 0 12px
}
.admin-toolbar input{flex:1;min-width:190px}
.admin-users-scroll{max-height:560px;overflow:auto;padding-right:3px}
.admin-user-card.self-admin{border-color:#67409f}
.admin-note{
  padding:10px 12px;border:1px solid #31405c;border-radius:10px;background:#091321;
  color:#bdc8dc;font-size:11px;line-height:1.55;margin-bottom:10px
}
.admin-report-tabs{display:flex;gap:7px;margin-bottom:10px}
.admin-report-tabs button.active{background:#542195;border-color:#8b4ee7;color:#fff}
@media(max-width:980px){
  .profile-layout{grid-template-columns:1fr}
  .profile-page-stats{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:600px){
  .profile-page-head{grid-template-columns:auto 1fr}
  .profile-page-head .profile-head-actions{grid-column:1/-1}
  .profile-page-stats{grid-template-columns:repeat(2,1fr)}
}


/* ===== Nosta V18 — Media profiles + Nostis ===== */
.profile-media-edit{
  display:grid;grid-template-columns:180px 1fr;gap:14px;margin-bottom:14px
}
.profile-image-edit-block{
  border:1px solid #26344d;border-radius:14px;background:#09111e;padding:12px
}
.profile-image-edit-block label{display:block;font-weight:800;font-size:12px;margin-bottom:8px}
.profile-image-edit-block input{width:100%;margin-top:9px;color:#cbd3e1;font-size:11px}
.profile-image-edit-block small{display:block;color:var(--muted);font-size:9px;margin-top:6px}
.profile-media-preview{overflow:hidden;background:#111a2b;border:1px solid #34415d}
.avatar-preview{
  width:90px;height:90px;border-radius:22px;display:grid;place-items:center;font-size:30px
}
.banner-preview{height:90px;border-radius:12px;background:linear-gradient(135deg,#241253,#0b1730)}
.profile-media-preview img{width:100%;height:100%;object-fit:cover;display:block}
.profile-page-hero.has-banner{
  background-size:cover!important;background-position:center!important
}
.profile-page-hero.has-banner::before{
  content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,7,15,.9),rgba(4,7,15,.55),rgba(4,7,15,.72));pointer-events:none
}
.profile-page-hero > *{position:relative;z-index:1}
.profile-big-avatar.has-photo{padding:0;overflow:hidden}
.profile-big-avatar.has-photo img{width:100%;height:100%;object-fit:cover}
.post-image{
  width:100%;max-height:480px;object-fit:cover;border-radius:12px;
  border:1px solid #283550;margin:10px 0;background:#050912
}
.post-image-thumb{
  width:92px;height:70px;border-radius:9px;object-fit:cover;border:1px solid #2e3a54
}
.post-upload-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:9px;
  border:1px dashed #33415e;border-radius:11px;padding:9px 11px
}
.post-upload-row input{max-width:280px;color:#c7cfdf;font-size:11px}
.image-note{font-size:10px;color:var(--muted)}
.admin-mail-card{
  border:1px solid #2e3d59;border-radius:12px;padding:12px;background:#09121f;margin-bottom:12px
}
.admin-mail-card.ok{border-color:#2b6a45}
.admin-mail-card.warn{border-color:#76551f}
.admin-mail-card strong{display:block;margin-bottom:4px}
.admin-mail-card span{font-size:11px;color:var(--muted);line-height:1.5}
@media(max-width:650px){
  .profile-media-edit{grid-template-columns:1fr}
}


/* ===== Nosta V19 Media Upload Fix ===== */
.profile-direct-media{border-color:#493078}
.direct-media-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.direct-media-card{
  display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;
  border:1px solid #293650;border-radius:12px;padding:12px;background:#09111e
}
.direct-media-card strong{grid-column:1/-1}
.direct-media-card input{
  width:100%;min-width:0;color:#cbd3e1;font-size:11px
}
@media(max-width:720px){
  .direct-media-grid{grid-template-columns:1fr}
  .direct-media-card{grid-template-columns:1fr}
}


/* ===== Nosta V20 — zichtbare admins ===== */
.team-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px
}
.team-card{
  border:1px solid #3a3368;
  border-radius:16px;
  padding:16px;
  background:
    radial-gradient(circle at top right,rgba(122,65,219,.18),transparent 30%),
    linear-gradient(180deg,#0d1426,#09111d);
}
.team-card .avatar{
  width:58px;height:58px;margin-bottom:10px;
  border:1px solid #734bbb;
  box-shadow:0 8px 22px rgba(0,0,0,.28)
}
.team-card h3{margin:0 0 4px}
.admin-public-badge{
  display:inline-flex;
  align-items:center;
  gap:5px;
  border:1px solid #7447b6;
  background:#22143b;
  color:#d7baff;
  padding:4px 8px;
  border-radius:999px;
  font-size:9px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase
}
.person-card .admin-public-badge,
.profile-page-head .admin-public-badge{
  margin-top:7px
}
@media(max-width:900px){
  .team-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .team-grid{grid-template-columns:1fr}
}

/* ===== NOSTA HOME V24 — social community ===== */
.stories-shell-v24{margin-top:18px;padding:18px 20px;background:linear-gradient(145deg,rgba(18,24,42,.96),rgba(12,17,31,.96));border-color:#27324a}
.stories-shell-v24 .section-head p,.top20-v24 .section-head p{margin:4px 0 0;color:var(--muted);font-size:13px}.stories-row-v24{display:flex;gap:17px;overflow-x:auto;padding:8px 2px 2px;scrollbar-width:thin}.story-v24{min-width:72px;text-align:center;cursor:pointer;color:inherit}.story-ring-v24{width:64px;height:64px;margin:auto;padding:3px;border-radius:50%;background:linear-gradient(135deg,#ffb84d,#8d39f6,#4f8cff);position:relative}.story-ring-v24.seen{background:#33405a}.story-ring-v24 img,.story-ring-v24 .story-fallback{width:100%;height:100%;border-radius:50%;object-fit:cover;border:3px solid #0d1322;display:grid;place-items:center;background:#182239;font-weight:800}.online-dot-v24{position:absolute;right:1px;bottom:3px;width:13px;height:13px;border-radius:50%;background:#2bd576;border:3px solid #0d1322}.story-v24 strong{display:block;font-size:11px;margin-top:6px;max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-pulse-v24{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(290px,.7fr);gap:18px;margin-top:18px}.spotlight-v24{min-height:330px;border:1px solid #5940a0;border-radius:24px;overflow:hidden;position:relative;background:#11152a;box-shadow:0 18px 60px rgba(50,24,110,.22)}.spotlight-cover-v24{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.28}.spotlight-cover-v24:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#101528 0%,rgba(16,21,40,.9) 48%,rgba(16,21,40,.3))}.spotlight-content-v24{position:relative;z-index:2;padding:28px;max-width:720px}.spotlight-label-v24{display:inline-flex;gap:7px;align-items:center;padding:7px 11px;border-radius:999px;background:rgba(255,197,72,.12);border:1px solid rgba(255,197,72,.35);color:#ffd05d;font-size:11px;font-weight:900;letter-spacing:.08em}.spotlight-person-v24{display:flex;align-items:center;gap:16px;margin:22px 0 12px}.spotlight-avatar-v24{width:78px;height:78px;border-radius:22px;object-fit:cover;background:#222b46;display:grid;place-items:center;font-size:28px;font-weight:900;border:2px solid rgba(255,255,255,.15)}.spotlight-person-v24 h2{font-size:29px;margin:0 0 6px}.spotlight-meta-v24{display:flex;flex-wrap:wrap;gap:8px}.social-pill-v24{font-size:11px;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1)}.social-pill-v24.online{color:#67e69d}.spotlight-actions-v24{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}.spotlight-actions-v24 button{min-width:46px}.spotlight-empty-v24{padding:32px}.spotlight-empty-v24 h2{font-size:27px}.spotlight-empty-v24 p{color:var(--muted);max-width:560px}
.membership-v24{padding:22px;background:linear-gradient(155deg,#14182b,#0e1424)}.membership-v24 h2{font-size:20px;margin:0}.membership-rank-v24{font-size:26px;font-weight:900;margin:16px 0 5px}.membership-next-v24{color:var(--muted);font-size:12px}.membership-bar-v24{height:9px;border-radius:999px;background:#202a40;overflow:hidden;margin:16px 0 8px}.membership-bar-v24 i{display:block;height:100%;background:linear-gradient(90deg,#7545f4,#c85af5,#ffcb55);border-radius:inherit}.membership-steps-v24{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}.membership-steps-v24 span{padding:6px 8px;border-radius:8px;background:#161f33;color:#6f7b92;font-size:10px}.membership-steps-v24 span.done{color:#fff;background:#39236d}.membership-steps-v24 span.current{outline:1px solid #d8b052;color:#ffd968}
.trend-grid-v24{display:grid;grid-template-columns:1fr 1fr .8fr;gap:16px;margin-top:18px}.trend-card-v24,.create-group-v24{padding:18px}.social-rank-list{display:grid;gap:8px}.social-rank-row-v24{display:grid;grid-template-columns:30px 38px 1fr auto;gap:9px;align-items:center;padding:9px;border-radius:12px;background:rgba(255,255,255,.025)}.social-rank-row-v24 .mini-avatar-v24{width:36px;height:36px;border-radius:12px;object-fit:cover;background:#1c263d;display:grid;place-items:center;font-weight:800}.social-rank-row-v24 strong{font-size:12px}.social-rank-row-v24 small{display:block;color:var(--muted);margin-top:2px}.social-rank-row-v24 em{font-style:normal;color:#ffd365;font-weight:800;font-size:12px}.create-group-v24{background:linear-gradient(145deg,#24164a,#15172d);border-color:#5b3a9c}.create-group-icon{font-size:32px}.create-group-v24 h2{margin:12px 0 6px}.create-group-v24 p{color:var(--muted);font-size:13px;line-height:1.6;min-height:62px}
.top20-v24{margin-top:18px;padding:20px}.top20-list-v24{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}.top20-row-v24{display:grid;grid-template-columns:36px 44px 1fr auto;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:#11182a;border:1px solid #202b42}.top20-row-v24.me{border-color:#6d43d8;background:#181531}.top20-rank-v24{font-weight:900;text-align:center;color:#8d98ad}.top20-rank-v24.podium{color:#ffd15b}.top20-avatar-v24{width:42px;height:42px;border-radius:13px;object-fit:cover;background:#202a43;display:grid;place-items:center;font-weight:900;position:relative}.top20-name-v24{font-weight:800;font-size:13px}.top20-info-v24{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;color:#8995aa;font-size:10px}.top20-score-v24{text-align:right}.top20-score-v24 strong{display:block;color:#f5f7ff;font-size:13px}.top20-score-v24 span{font-size:9px;color:#7e8ba2}.home-bottom-grid-v24{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;margin-top:18px}.home-bottom-grid-v24>.widget{padding:20px}.community-shortcuts-v24{display:grid;grid-template-columns:1fr 1fr;gap:10px}.community-shortcuts-v24 button{display:grid;grid-template-columns:30px 1fr;grid-template-rows:auto auto;text-align:left;gap:1px 8px;padding:13px;border-radius:13px;background:#121a2d;border:1px solid #263149;color:#fff;cursor:pointer}.community-shortcuts-v24 button:hover{border-color:#6f46d9;transform:translateY(-1px)}.community-shortcuts-v24 button:first-letter{font-size:20px}.community-shortcuts-v24 strong{font-size:12px}.community-shortcuts-v24 span{grid-column:2;color:var(--muted);font-size:10px}
@media(max-width:1100px){.home-pulse-v24,.trend-grid-v24,.home-bottom-grid-v24{grid-template-columns:1fr}.top20-list-v24{grid-template-columns:1fr}}@media(max-width:700px){.top20-row-v24{grid-template-columns:28px 38px 1fr}.top20-score-v24{display:none}.spotlight-content-v24{padding:20px}.membership-steps-v24{display:none}}

/* ===== NOSTA HOME V25 — premium social dashboard ===== */
.nosta25-stories{margin-top:18px;padding:16px 18px;background:linear-gradient(145deg,#11172a,#0d1221);border-color:#2d3351}.nosta25-dashboard{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(500px,1.35fr) minmax(270px,.7fr);gap:16px;margin-top:16px}.nosta25-left,.nosta25-right{display:grid;gap:16px;align-content:start}.nosta25-profile-hero{padding:22px;position:relative;overflow:hidden;background:radial-gradient(circle at 12% 18%,rgba(255,57,176,.18),transparent 32%),linear-gradient(145deg,#17132c,#0e1425);border-color:#493074}.nosta25-profile-hero:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-70px;top:-70px;background:radial-gradient(circle,rgba(119,67,255,.22),transparent 70%)}.nosta25-crown{position:absolute;right:20px;top:16px;font-size:30px;filter:drop-shadow(0 0 12px rgba(255,196,70,.45))}.nosta25-profile-main{display:flex;gap:16px;align-items:center;position:relative;z-index:1}.nosta25-avatar{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;font-size:34px;font-weight:900;background:linear-gradient(135deg,#ff3fa8,#7547ff);border:4px solid #f1b94d;box-shadow:0 0 0 4px #452183,0 0 30px rgba(235,49,176,.3);overflow:hidden}.nosta25-avatar img{width:100%;height:100%;object-fit:cover}.nosta25-profile-main h2{margin:7px 0 3px;font-size:24px}.nosta25-profile-main p{margin:0;color:var(--muted);font-size:11px;max-width:260px}.nosta25-rankchip{display:inline-block;margin-top:8px;padding:5px 9px;border-radius:999px;background:#36205f;color:#ffd56a;font-size:10px;font-weight:800}.nosta25-profile-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:20px 0 15px;border-top:1px solid #2a3048;border-bottom:1px solid #2a3048}.nosta25-profile-stats div{padding:13px 5px;text-align:center}.nosta25-profile-stats div+div{border-left:1px solid #2a3048}.nosta25-profile-stats strong{display:block;font-size:18px}.nosta25-profile-stats span{font-size:9px;color:var(--muted)}.nosta25-level>div{display:flex;justify-content:space-between;font-size:10px;color:#aab3c7}.nosta25-level{height:auto;background:none}.nosta25-level i{display:block;height:7px;margin-top:7px;border-radius:999px;background:linear-gradient(90deg,#7a42ff,#28b8ff);width:15%}.nosta25-profile-actions{display:flex;gap:7px;margin-top:16px;flex-wrap:wrap}.nosta25-profile-actions button{font-size:10px}.nosta25-quickvote{padding:18px}.nosta25-votechips{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.nosta25-votechips button{padding:13px 4px;border-radius:12px;border:1px solid #42315e;background:linear-gradient(145deg,#201547,#13182b);color:#fff;font-weight:900;cursor:pointer}.nosta25-votechips button:nth-child(2),.nosta25-votechips button:nth-child(4){background:linear-gradient(135deg,#ff257f,#ff6b3d);border-color:#ff5b74}.nosta25-top20{padding:20px;min-height:590px;background:linear-gradient(145deg,#11162a,#0d1222);border-color:#34304f}.nosta25-tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:4px;background:#0b1020;border:1px solid #252c44;border-radius:12px;margin:14px 0}.nosta25-tabs span{text-align:center;padding:8px;font-size:10px;color:#8994a8;border-radius:9px}.nosta25-tabs .active{background:linear-gradient(90deg,#ed1688,#ff5b54);color:#fff;font-weight:800}.nosta25-top20 .top20-list-v24{grid-template-columns:1fr;max-height:485px;overflow:auto}.nosta25-top20 .top20-row-v24{background:transparent;border:0;border-bottom:1px solid #1e273c;border-radius:0}.nosta25-points{padding:18px;background:linear-gradient(145deg,#17102d,#101628);border-color:#4a2b74}.nosta25-points-grid{display:grid;grid-template-columns:1fr;gap:8px;margin:8px 0 14px}.nosta25-points-grid div{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:11px;background:#11192a}.nosta25-points-grid strong{font-size:17px}.nosta25-points-grid span{font-size:10px;color:var(--muted)}.nosta25-middle-grid{display:grid;grid-template-columns:1.45fr .75fr;gap:16px;margin-top:16px}.nosta25-middle-grid .spotlight-v24{margin:0;min-height:280px;background:radial-gradient(circle at 85% 30%,rgba(255,30,146,.18),transparent 30%),linear-gradient(145deg,#17112e,#101629)}.nosta25-hof{padding:22px;text-align:center;background:radial-gradient(circle at 50% 40%,rgba(255,186,47,.13),transparent 38%),linear-gradient(145deg,#20112b,#11152a);border-color:#59304f}.nosta25-hof .section-head{text-align:left}.nosta25-hof-art{font-size:42px;letter-spacing:8px;margin:30px 0 15px;filter:drop-shadow(0 0 14px rgba(255,194,52,.2))}.nosta25-hof p{color:var(--muted);font-size:11px}.nosta25-trends{grid-template-columns:1fr 1fr .8fr}.nosta25-action-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:16px}.nosta25-action{min-height:120px;padding:18px;text-align:left;border-radius:18px;border:1px solid #393052;background:linear-gradient(145deg,#18112d,#101629);color:#fff;cursor:pointer;transition:.18s}.nosta25-action:hover{transform:translateY(-2px);border-color:#8d48df}.nosta25-action>span{font-size:28px;display:block;margin-bottom:12px}.nosta25-action strong{display:block;font-size:14px}.nosta25-action small{display:block;color:var(--muted);margin-top:5px}.nosta25-bottom{margin-bottom:26px}
@media(max-width:1400px){.nosta25-dashboard{grid-template-columns:1fr 1.35fr}.nosta25-right{grid-column:1/-1;grid-template-columns:1fr 1fr}.nosta25-action-grid{grid-template-columns:1fr 1fr}}@media(max-width:1000px){.nosta25-dashboard,.nosta25-middle-grid,.nosta25-trends{grid-template-columns:1fr}.nosta25-right{grid-column:auto;grid-template-columns:1fr}.nosta25-action-grid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.nosta25-action-grid{grid-template-columns:1fr}.nosta25-votechips{grid-template-columns:repeat(2,1fr)}.nosta25-profile-main{align-items:flex-start}.nosta25-avatar{width:70px;height:70px}.nosta25-profile-stats strong{font-size:14px}}

/* ===== NOSTA V26 HOME + 1V1 BATTLES ===== */
.nosta25-votechips button.active{border-color:#a855f7;background:linear-gradient(135deg,#7c3aed,#d946ef);color:#fff;box-shadow:0 0 22px rgba(168,85,247,.22)}
.quick-vote-people-v26{display:flex;gap:10px;overflow-x:auto;padding:12px 2px 2px;scrollbar-width:thin}
.quick-vote-person-v26{min-width:86px;background:#0d1326;border:1px solid #24304f;border-radius:15px;padding:10px 8px;color:#fff;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;transition:.18s}
.quick-vote-person-v26:hover{transform:translateY(-2px);border-color:#8b5cf6;background:#111933}
.quick-vote-avatar-v26{width:42px;height:42px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:#6d28d9;font-weight:800}
.quick-vote-person-v26 span{font-size:12px;font-weight:800;max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quick-vote-person-v26 small{font-size:10px;color:#7f8ba8}

.battle26-hero{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:26px;border:1px solid #49328c;border-radius:22px;background:radial-gradient(circle at 80% 20%,rgba(219,39,119,.18),transparent 32%),radial-gradient(circle at 20% 10%,rgba(124,58,237,.28),transparent 35%),#0b1020;margin-bottom:14px}
.battle26-hero h2{font-size:30px;margin:5px 0 8px}.battle26-hero p{max-width:700px;color:#aeb8d0;line-height:1.55;margin:0}
.battle26-record{display:grid;grid-template-columns:repeat(3,minmax(90px,1fr));gap:8px;min-width:320px}.battle26-record div{background:#11172c;border:1px solid #283455;border-radius:15px;padding:14px;text-align:center}.battle26-record strong{font-size:22px;display:block}.battle26-record span{font-size:11px;color:#8792ad}
.battle26-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr);gap:12px}.battle26-create{display:grid;grid-template-columns:1fr auto;gap:10px}.battle26-list{display:grid;gap:10px}
.battle26-card{position:relative;padding:16px;border:1px solid #253252;border-radius:17px;background:linear-gradient(180deg,#10172b,#0b1020);overflow:hidden}.battle26-card.active{border-color:#7c3aed;box-shadow:inset 0 0 30px rgba(124,58,237,.08)}
.battle26-status{font-size:10px;font-weight:900;letter-spacing:.08em;color:#f5b3db;margin-bottom:10px}.battle26-vs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}.battle26-vs>div{display:grid;justify-items:center;gap:5px;text-align:center}.battle26-vs>span{font-weight:1000;font-size:18px;color:#f472b6}.battle26-vs b{font-size:19px;color:#f8d06b}.battle26-vs strong{font-size:12px}
.battle26-avatar{width:54px;height:54px;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:linear-gradient(135deg,#6d28d9,#db2777);border:2px solid #8b5cf6;font-weight:900}
.battle26-progress{height:7px;background:#1b2440;border-radius:99px;overflow:hidden;margin:13px 0 6px}.battle26-progress i{display:block;height:100%;background:linear-gradient(90deg,#7c3aed,#ec4899,#f59e0b);border-radius:inherit}
.battle26-card small{display:block;text-align:center;color:#7d89a8}.battle26-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.battle26-history{display:grid;gap:7px}.battle26-history-row{display:grid;grid-template-columns:1fr auto 120px;align-items:center;gap:10px;padding:11px 12px;border:1px solid #202c49;border-radius:12px;background:#0d1325}.battle26-history-row span{color:#f7c55b;font-weight:800}.battle26-history-row em{text-align:right;font-style:normal;color:#b5bfd7}
@media(max-width:900px){.battle26-hero{align-items:flex-start;flex-direction:column}.battle26-record{min-width:0;width:100%}.battle26-grid{grid-template-columns:1fr}.battle26-create{grid-template-columns:1fr}.battle26-history-row{grid-template-columns:1fr auto}.battle26-history-row em{grid-column:1/-1;text-align:left}}
/* ===== NOSTA V27 - reference inspired home ===== */
#page-home{background:radial-gradient(circle at 14% 15%,rgba(116,35,255,.12),transparent 25%),radial-gradient(circle at 82% 32%,rgba(255,31,139,.08),transparent 25%),#050914}
#page-home .widget{background:linear-gradient(180deg,rgba(17,21,47,.97),rgba(8,13,31,.98));border:1px solid #303663;border-radius:18px;box-shadow:0 12px 35px rgba(0,0,0,.18)}
.v27-online{margin-bottom:12px}.v27-bonus{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:12px;padding:18px 22px}.v27-days{display:flex;gap:8px}.v27-days span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#151b3c;border:1px solid #343b72;font-weight:900;color:#ffca46}.v27-days span.done{background:#0f493d;color:#55efb5}.v27-days small{display:block;font-size:8px;color:#9ca7c7}
.v27-main-grid{display:grid;grid-template-columns:300px minmax(440px,1fr) 270px;gap:12px}.v27-leftcol,.v27-rightcol{display:grid;align-content:start;gap:12px}.v27-profile{position:relative;padding:20px;background:radial-gradient(circle at 20% 25%,rgba(255,45,160,.2),transparent 25%),linear-gradient(180deg,#161039,#0a1025)!important;border-color:#7136ad!important}.v27-crown{position:absolute;right:18px;top:16px;font-size:25px}.v27-profile-main{display:flex;align-items:center;gap:14px}.v27-profile .nosta25-avatar{width:92px;height:92px;border:4px solid #ffca3a;box-shadow:0 0 0 5px #8b2dff,0 0 25px rgba(236,72,153,.35)}.v27-profile h2{font-size:24px;margin:5px 0}.v27-profile .nosta25-profile-stats{margin-top:18px}.v27-quickvote{padding:18px}.v27-quickvote .nosta25-votechips{grid-template-columns:repeat(4,1fr)}.v27-quickvote .nosta25-votechips button{font-size:19px;min-height:62px}.v27-quickvote .nosta25-votechips button:nth-child(1){background:linear-gradient(135deg,#1478ff,#19b7ff)}.v27-quickvote .nosta25-votechips button:nth-child(2){background:linear-gradient(135deg,#ff197c,#ff684d)}.v27-quickvote .nosta25-votechips button:nth-child(3){background:linear-gradient(135deg,#3568ff,#00b9ff)}.v27-quickvote .nosta25-votechips button:nth-child(4){background:linear-gradient(135deg,#ff6a00,#ffb000)}
.v27-top20{min-height:610px;padding:18px}.v27-top20 .top20-list-v24{max-height:505px;overflow:auto}.v27-top20 .nosta25-tabs{margin:10px 0}.v27-top20 .nosta25-tabs span.active{background:linear-gradient(90deg,#f10b8b,#ff5a55)}.v27-rank-row{display:grid;grid-template-columns:1.35fr 1fr;gap:12px;margin-top:12px}.v27-threecols{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.v27-threecols>div{padding:12px;border:1px solid #26335c;border-radius:14px;background:#0b1230}.v27-rank-copy{color:#8995b7;font-size:12px;line-height:1.5}.v27-hof{text-align:center}.v27-podium{font-size:50px;padding:28px 0;text-shadow:0 0 24px #ffbd2e}
.v27-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}.v27-feature{min-height:210px;padding:20px;text-align:left;color:#fff}.v27-feature>span{font-size:40px}.v27-feature h2{font-size:22px;margin:10px 0 4px}.v27-feature p{color:#a7b1cb}.v27-feature strong{display:block;margin-top:18px;padding:12px;text-align:center;border-radius:12px;background:linear-gradient(90deg,#d80b91,#ff2d72)}button.v27-feature{cursor:pointer}.v27-battle{background:radial-gradient(circle at 75% 20%,rgba(0,128,255,.28),transparent 35%),linear-gradient(180deg,#131039,#081026)!important}.v27-bottom-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:12px}.v27-streaks{display:grid;gap:10px}.v27-streaks div{padding:11px;border-bottom:1px solid #252e51}.v27-streaks b{float:right;color:#ff4e83}.v27-badges{font-size:34px;letter-spacing:8px;padding:18px 0}.v27-help{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:12px 0 75px;padding:0!important;overflow:hidden}.v27-help button{border:0;border-right:1px solid #273056;background:transparent;color:#fff;padding:17px;display:grid;grid-template-columns:auto 1fr;column-gap:10px;text-align:left;cursor:pointer}.v27-help button:hover{background:#151a39}.v27-help button>b,.v27-help button>span{grid-column:2}.v27-help button>span{color:#8e9ab9;font-size:11px}
/* make inner pages feel premium */
.app-body .panel{border-radius:18px;background:linear-gradient(180deg,#11172d,#090f20);border:1px solid #28345a}.app-body .primary-btn{background:linear-gradient(90deg,#d60a92,#ff316d);box-shadow:0 7px 22px rgba(237,18,123,.18)}.app-body .primary-btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.battle26-hero{background:radial-gradient(circle at 80% 15%,rgba(255,28,131,.28),transparent 30%),radial-gradient(circle at 20% 30%,rgba(76,83,255,.3),transparent 35%),#080d20;border-color:#5a3f9b}.battle26-card{transition:.2s}.battle26-card:hover{transform:translateY(-2px);border-color:#d528a1;box-shadow:0 10px 28px rgba(216,20,143,.13)}
@media(max-width:1200px){.v27-main-grid{grid-template-columns:280px 1fr}.v27-rightcol{grid-column:1/-1;grid-template-columns:1fr 1fr}.v27-bottom-grid{grid-template-columns:1fr 1fr}.v27-help{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.v27-bonus{align-items:flex-start;flex-direction:column}.v27-days{max-width:100%;overflow:auto}.v27-main-grid,.v27-rank-row,.v27-feature-grid,.v27-bottom-grid{grid-template-columns:1fr}.v27-rightcol{grid-template-columns:1fr}.v27-threecols{grid-template-columns:1fr}.v27-help{grid-template-columns:1fr}.v27-main-grid{display:grid}.v27-profile .nosta25-avatar{width:76px;height:76px}}

/* ===== NOSTA V28 · 2000-2005 social profile revival ===== */
:root{--y2k-pink:#ff168f;--y2k-pink2:#ff4b7a;--y2k-purple:#7c3aed;--y2k-blue:#179cff;--y2k-cyan:#2ee6d6;--y2k-gold:#ffc845;--y2k-ink:#050817;--y2k-panel:#0b1125;--y2k-line:#28365d}
body{background:radial-gradient(circle at 50% -10%,#311066 0,#0a0d20 32%,#030712 70%);background-attachment:fixed}
.app-shell-v12{display:block;max-width:1680px;margin:auto}.sidebar-v12{display:none}.main-v12{margin:0!important;width:100%!important;max-width:none!important;padding:0 18px 24px!important}
.topbar-v12{position:sticky;top:0;z-index:40;margin:0 -18px 14px;padding:12px 24px;background:linear-gradient(180deg,rgba(7,9,27,.98),rgba(7,9,27,.9));border-bottom:1px solid #263354;backdrop-filter:blur(18px);display:grid;grid-template-columns:260px 1fr auto;gap:18px;align-items:center}
.topbar-left h1{font-size:0;margin:0}.topbar-left h1:after{content:'Nosta';font-size:38px;font-style:italic;font-weight:900;letter-spacing:-2px;background:linear-gradient(90deg,#ff42a8,#ff6b5f,#ffd34e,#6b5cff,#39d5ff);-webkit-background-clip:text;color:transparent;text-shadow:0 0 25px #ff168f55}.topbar-left .hello,.topbar-left p{display:none}.top-tabs{justify-content:center;background:#0a1023;border:1px solid #25345a;border-radius:16px;padding:5px}.top-tab{border-radius:11px}.top-tab.active{background:linear-gradient(135deg,#ff168f,#7c3aed);box-shadow:0 0 22px #ff168f55}.system-chip{display:none}.search{min-width:300px}.icon-btn{border-color:#2d3b61}.y2k-home{display:grid;gap:14px}.widget{background:linear-gradient(180deg,rgba(15,21,45,.96),rgba(7,12,29,.96));border:1px solid var(--y2k-line);box-shadow:0 12px 30px #0004,inset 0 1px #ffffff0d;border-radius:14px}.widget:hover{border-color:#445583}
.y2k-stories{padding:14px 18px}.stories-row-v24{min-height:92px}.story-bubble,.story-avatar{box-shadow:0 0 0 2px #ff168f,0 0 18px #ff168f55!important}.y2k-columns{display:grid;grid-template-columns:280px minmax(0,1fr) 330px;gap:14px;align-items:start}.y2k-left,.y2k-center,.y2k-right{display:grid;gap:14px}.y2k-profile{padding:16px;position:relative;overflow:hidden}.y2k-profile:before{content:'';position:absolute;inset:0 0 auto;height:90px;background:linear-gradient(90deg,#7c3aed55,#ff168f55,#179cff44);filter:blur(18px)}.y2k-profile-ring{width:150px;height:150px;margin:4px auto 14px;padding:5px;border-radius:50%;background:conic-gradient(#ffc845,#ff168f,#7c3aed,#179cff,#ffc845);position:relative}.y2k-profile-ring .nosta25-avatar{width:100%;height:100%;border-radius:50%;overflow:hidden;background:#111a33;border:4px solid #080c1b}.y2k-profile-ring .nosta25-avatar img{width:100%;height:100%;object-fit:cover}.y2k-online{position:absolute;right:-4px;bottom:10px;background:#063a28;color:#5cffad;border:1px solid #1ee887;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:800}.y2k-profile h2{text-align:center;font-size:24px;margin:0}.verified{color:#179cff}.y2k-location{text-align:center;color:#ff63b6!important}.y2k-profile>p:not(.y2k-location){text-align:center}.y2k-profile .nosta25-rankchip{display:table;margin:8px auto}.nosta25-profile-stats{margin-top:14px;border-block:1px solid #2b3658;padding:12px 0}.nosta25-profile-stats strong{color:#ffd34e}.nosta25-level i{background:linear-gradient(90deg,#7c3aed,#179cff,#2ee6d6)!important}.y2k-profile-links{display:grid;margin-top:12px}.y2k-profile-links button{padding:9px 8px;text-align:left;color:#dce7ff;background:transparent;border:0;border-bottom:1px solid #1e2946;cursor:pointer}.y2k-profile-links button:hover{background:#ffffff08;color:#ff66b9}.y2k-quickvote,.y2k-visitors{padding:14px}.nosta25-votechips{grid-template-columns:repeat(4,1fr)!important}.nosta25-votechips button{font-weight:900!important;font-size:16px!important}.nosta25-votechips button:nth-child(1){background:#087df4!important}.nosta25-votechips button:nth-child(2){background:#ff168f!important}.nosta25-votechips button:nth-child(3){background:#6545ff!important}.nosta25-votechips button:nth-child(4){background:#ff6b1a!important}.primary-btn{background:linear-gradient(90deg,#ff168f,#e91e63,#7c3aed)!important;box-shadow:0 7px 22px #ff168f33}.y2k-composer,.y2k-feed{padding:14px}.y2k-compose-tabs{display:flex;gap:7px;margin-bottom:10px}.y2k-compose-tabs button{background:#111a34;border:1px solid #26375f;color:#cbd8f3;border-radius:8px;padding:8px 13px}.y2k-compose-tabs .active{background:#5f35d8;color:#fff}.y2k-compose-box{width:100%;min-height:66px;text-align:left;padding:14px;border:1px solid #34456e;background:#101a31;color:#8fa0c0;border-radius:12px;cursor:pointer}.y2k-compose-box b{float:right;background:#ff168f;color:white;padding:8px 18px;border-radius:8px}.y2k-feed{min-height:500px}.activity-item,.feed-card{border-bottom:1px solid #263354!important;padding:14px 0!important}.y2k-feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.y2k-feature{min-height:190px;padding:18px;text-align:center;position:relative;overflow:hidden}.y2k-feature:after{content:'✦';position:absolute;right:12px;top:8px;color:#ffd34e;text-shadow:0 0 12px #ff168f}.y2k-feature>span{font-size:34px}.y2k-feature strong{display:block;margin-top:14px;color:#fff;background:#ff168f;border-radius:8px;padding:9px}.y2k-battle{border-color:#6d4cff}.y2k-right>section{padding:14px}.v27-days{display:flex!important;justify-content:space-between!important;gap:4px!important}.v27-days span{min-width:34px!important;width:auto!important;height:48px!important;border-radius:999px!important;background:#13203a!important}.v27-days .done{background:#0a9b6c!important}.y2k-membership{border-color:#5b2ebc;background:radial-gradient(circle at 85% 10%,#7c3aed44,transparent 35%),#0b1024}.membership-rank-v24{color:#ffd34e!important}.membership-bar-v24 i{background:linear-gradient(90deg,#ff168f,#7c3aed,#2ee6d6)!important}.y2k-podium{font-size:48px;display:flex;justify-content:space-around;align-items:end;padding:22px 8px;background:radial-gradient(circle,#6f3bd044,transparent 65%);border-radius:12px}.top20-list-v24{max-height:410px;overflow:auto}.top20-row-v24{border-bottom:1px solid #253153}.top20-row-v24:nth-child(1){background:#ffc84510}.top20-row-v24 strong{color:#ffd34e}.nosta25-tabs .active{background:#ff168f!important}.y2k-wallet .nosta25-points-grid{grid-template-columns:1fr!important}.y2k-bottom{display:grid;grid-template-columns:repeat(4,1fr);padding:10px}.y2k-bottom button{display:grid;gap:2px;padding:12px;background:transparent;border:0;border-right:1px solid #263354;color:#dbe7ff;text-align:left}.y2k-bottom button:last-child{border:0}.y2k-bottom button span{font-size:11px;color:#8f9bb6}.y2k-bottom button:hover{background:#ffffff08}.report-dialog::backdrop,.app-dialog::backdrop{background:#02040bd9;backdrop-filter:blur(8px)}dialog{border:1px solid #5d3bb1!important;background:linear-gradient(180deg,#11172e,#080c1b)!important;box-shadow:0 0 60px #7c3aed44,0 30px 90px #000b!important}.dialog-head{border-bottom:1px solid #29375d;padding-bottom:14px}.app-dialog-shell{border-radius:18px!important}.app-dialog-body .panel{border-color:#2c3b62!important;background:#0d1429!important}
@media(max-width:1100px){.y2k-columns{grid-template-columns:240px 1fr}.y2k-right{grid-column:1/-1;grid-template-columns:repeat(2,1fr)}.topbar-v12{grid-template-columns:180px 1fr}.top-actions{grid-column:1/-1}.search{min-width:0}.y2k-feature-row{grid-template-columns:1fr 1fr}.y2k-feature-row>*:last-child{grid-column:1/-1}}
@media(max-width:760px){.main-v12{padding:0 9px 80px!important}.topbar-v12{position:relative;margin:0 -9px 10px;padding:10px;display:flex;flex-wrap:wrap}.topbar-left{width:100%}.top-tabs{width:100%;overflow:auto;justify-content:flex-start}.top-actions{width:100%;overflow:auto}.search{min-width:220px}.y2k-columns{grid-template-columns:1fr}.y2k-left,.y2k-center,.y2k-right{grid-column:auto}.y2k-right{grid-template-columns:1fr}.y2k-profile-ring{width:130px;height:130px}.y2k-feature-row,.y2k-bottom{grid-template-columns:1fr}.y2k-bottom button{border-right:0;border-bottom:1px solid #263354}.y2k-feed{min-height:300px}}

/* ===== NOSTA V29 · reference-faithful 2000s profile portal ===== */
body:before{content:'';position:fixed;inset:0 0 auto 0;height:155px;z-index:-1;background:radial-gradient(circle at 18% 25%,#ff168f38,transparent 17%),radial-gradient(circle at 80% 10%,#6437ff55,transparent 24%),linear-gradient(180deg,#150b36 0,#080d23 75%,transparent);pointer-events:none}
.topbar-v12{min-height:108px;grid-template-columns:270px minmax(620px,1fr) auto;background:linear-gradient(180deg,rgba(8,8,31,.98),rgba(7,11,29,.94));box-shadow:0 8px 28px #0007}
.topbar-left h1:after{font-size:54px;content:'Nosta★';letter-spacing:-4px;text-shadow:0 0 18px #ff168f88,0 0 32px #6f49ff55}
.y2k-mainnav{align-self:end;border-radius:10px;padding:0;overflow:hidden;gap:0;background:#080e22}
.y2k-mainnav .top-tab{min-width:88px;min-height:62px;border-radius:0;display:grid;place-items:center;align-content:center;gap:4px;font-size:17px;border-right:1px solid #222e50}
.y2k-mainnav .top-tab span{font-size:10px;font-weight:700}.y2k-mainnav .top-tab.active{background:linear-gradient(180deg,#39166b,#121431);box-shadow:inset 0 -3px #ff168f,0 0 20px #ff168f33}
.y2k-home{max-width:1720px;margin:auto}.y2k-columns{grid-template-columns:300px minmax(520px,1.15fr) minmax(510px,.95fr);gap:14px}.y2k-center>.y2k-stories{order:-5}.y2k-stories{padding:12px 16px;background:linear-gradient(180deg,#10152f,#090e21)}
.y2k-right{grid-template-columns:1fr 1fr;align-items:start}.y2k-right>.y2k-bonus,.y2k-right>.y2k-membership{min-height:170px}.y2k-right>.y2k-hof,.y2k-right>.y2k-top20{min-height:365px}.y2k-right>.y2k-wallet{grid-column:1/-1}.y2k-top20 .top20-list-v24{max-height:260px}.y2k-podium{min-height:205px}
.y2k-feature-row{grid-template-columns:repeat(4,1fr)}.y2k-feature{min-height:205px}.y2k-games{background:radial-gradient(circle at 50% 10%,#00d8ff2b,transparent 38%),linear-gradient(180deg,#12113c,#071128)!important;border-color:#2d8bd4!important}.y2k-games strong{background:linear-gradient(90deg,#147cff,#6b4cff)!important}
.y2k-profile{border-color:#8c3cff!important;box-shadow:0 0 28px #7928ca22}.y2k-profile-ring{width:170px;height:170px}.y2k-profile-ring:before{content:'♛';position:absolute;left:-7px;top:-30px;font-size:40px;color:#ffd34e;transform:rotate(-12deg);text-shadow:0 0 12px #ff9b00}.y2k-quickvote{border-color:#294e85!important}.y2k-visitors{border-color:#4e316e!important}
.y2k-feed{min-height:560px}.y2k-composer{border-color:#33477b!important}.y2k-composer:before{content:'Deel iets met Nosta';display:block;font-weight:800;color:#e8efff;margin-bottom:10px}.y2k-bottom{margin-top:0}.y2k-footer{min-height:90px;margin:2px -18px -24px;padding:20px 30px;display:grid;grid-template-columns:180px 1fr 1fr auto;align-items:center;gap:18px;border-top:1px solid #4b2c72;background:radial-gradient(circle at 20% 100%,#ff168f26,transparent 20%),linear-gradient(180deg,#090d22,#10082a);color:#9ca9c8}.y2k-footer b{font-size:28px;background:linear-gradient(90deg,#ff168f,#ffd34e,#2ee6d6);-webkit-background-clip:text;color:transparent}.y2k-footer>span{font-size:10px;font-weight:900;color:#fff}.y2k-footer nav{text-align:center;font-size:12px}.y2k-footer em{font-family:cursive;color:#ff87d0;font-size:16px}
.app-dialog-shell{max-width:1180px!important}.app-dialog-body{background:radial-gradient(circle at 80% 0,#47207522,transparent 30%),#070c1b}.app-dialog-body h2,.app-dialog-body h3{color:#f4f7ff}.app-dialog-body .panel:hover{border-color:#7a42c6!important;box-shadow:0 12px 30px #0005,0 0 18px #7c3aed18}.app-dialog-body button{transition:.18s}.app-dialog-body button:hover{transform:translateY(-1px)}
@media(max-width:1450px){.y2k-columns{grid-template-columns:280px minmax(480px,1fr) 440px}.y2k-right{grid-template-columns:1fr}.y2k-right>.y2k-wallet{grid-column:auto}.y2k-feature-row{grid-template-columns:1fr 1fr}.topbar-v12{grid-template-columns:220px 1fr}.top-actions{grid-column:1/-1}}
@media(max-width:1000px){.y2k-columns{grid-template-columns:260px 1fr}.y2k-right{grid-column:1/-1;grid-template-columns:repeat(2,1fr)}.y2k-right>.y2k-wallet{grid-column:1/-1}.y2k-mainnav .top-tab{min-width:78px}}
@media(max-width:760px){.y2k-columns,.y2k-right,.y2k-feature-row{grid-template-columns:1fr}.y2k-right>.y2k-wallet{grid-column:auto}.y2k-footer{grid-template-columns:1fr;text-align:center}.y2k-footer em{display:none}.topbar-left h1:after{font-size:42px}}

/* ===== NOSTA V30 INTERACTION + CLARITY ===== */
.nosta-menu-wrap{position:relative;z-index:50}
.nosta-menu-button{display:flex;align-items:center;gap:9px;padding:10px 16px;border-radius:14px;border:1px solid rgba(168,85,247,.5);background:linear-gradient(135deg,#231247,#10172a);color:#fff;font-weight:800;box-shadow:0 0 22px rgba(168,85,247,.16);cursor:pointer}.nosta-menu-button b{color:#f472b6}
.nosta-menu-dropdown{position:absolute;top:calc(100% + 8px);left:0;width:270px;padding:10px;background:rgba(7,11,24,.98);border:1px solid rgba(168,85,247,.45);border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.5),0 0 30px rgba(168,85,247,.12);backdrop-filter:blur(20px)}
.nosta-menu-dropdown[hidden]{display:none}.nosta-menu-dropdown button{width:100%;display:flex;align-items:center;gap:10px;border:0;background:transparent;color:#e9e6ff;padding:10px 12px;border-radius:11px;text-align:left;cursor:pointer;font-weight:700}.nosta-menu-dropdown button:hover{background:linear-gradient(90deg,rgba(236,72,153,.18),rgba(124,58,237,.2));color:#fff}

.y2k-compose-tabs button,.compose-kind-pills button,.nosta25-tabs button,.top-period-switch button{border:1px solid #27345a;background:#0b1224;color:#bfc6dc;border-radius:10px;padding:9px 13px;cursor:pointer;font-weight:750}.y2k-compose-tabs button.active,.compose-kind-pills button.active,.nosta25-tabs button.active,.top-period-switch button.active{background:linear-gradient(135deg,#ec168c,#ff5b63);color:#fff;border-color:#ff3b8d;box-shadow:0 0 18px rgba(236,22,140,.22)}
.compose-kind-pills{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}.nosta-compose-dialog textarea{min-height:110px;resize:vertical}.nosta-compose-dialog label{display:grid;gap:7px;color:#dce3f5;font-weight:700}.nosta-compose-dialog input,.nosta-compose-dialog textarea{width:100%;box-sizing:border-box;border-radius:12px;border:1px solid #2b3558;background:#0b1222;color:white;padding:12px}.hidden{display:none!important}
.story-add-head{background:linear-gradient(135deg,#7928ca,#ff2f8b)!important;color:#fff!important;padding:8px 12px!important;border-radius:999px!important}

.membership-rank-showcase{display:flex;gap:14px;align-items:center;margin:10px 0 12px}.membership-main-emblem{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:31px;background:radial-gradient(circle at 30% 20%,#fff2,transparent 40%),linear-gradient(135deg,#26134b,#101a37);border:1px solid #8b5cf6;box-shadow:0 0 24px #7c3aed33}.membership-emblems{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:12px}.membership-emblem{display:flex;align-items:center;gap:6px;padding:7px 8px;border:1px solid #24304f;border-radius:10px;background:#0c1427;opacity:.48}.membership-emblem b{font-size:18px}.membership-emblem span{font-size:10px}.membership-emblem.done{opacity:.8;border-color:#0ea5e9}.membership-emblem.current{opacity:1;border-color:#f472b6;background:linear-gradient(135deg,#25113d,#111d3b);box-shadow:0 0 15px #ec489933}

.top-rank-actions{display:flex;gap:6px}.top-rank-actions .text-btn{padding:6px 9px;border-radius:9px;background:#131b31}
.top-page,.vote-page,.help-grid,.onboarding-page,.spotlight-page{display:grid;gap:14px}.top-page-hero,.vote-page-hero,.help-hero,.spotlight-page-hero{background:radial-gradient(circle at 80% 20%,#7c3aed3a,transparent 35%),linear-gradient(135deg,#111936,#120e2c);border-color:#5b3c98}.top-page-hero{display:flex;justify-content:space-between;align-items:center;gap:20px}.top-period-switch{display:flex;gap:7px}.top-members-list{display:grid;gap:9px}.top-member-card{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;border:1px solid #253354;background:#0b1327}.top-member-card.podium{background:linear-gradient(135deg,#151535,#22133c);border-color:#8b5cf655}.top-member-card .rank{width:45px;font-size:20px}.top-page-avatar,.vote-page-avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;background:#231447;display:grid;place-items:center;overflow:hidden}.top-page-avatar img,.vote-page-avatar img{width:100%;height:100%;object-fit:cover}

.vote-page-amounts{max-width:440px}.vote-member-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}.vote-member-card{display:grid;justify-items:center;gap:7px;padding:15px;border-radius:16px;border:1px solid #263459;background:linear-gradient(180deg,#11182e,#0a1020);color:white;cursor:pointer}.vote-member-card:hover{transform:translateY(-2px);border-color:#ec4899;box-shadow:0 12px 30px #0007,0 0 20px #ec489922}.vote-member-card span{color:#ffcc4d;font-weight:800}

.help-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.help-cards button{display:grid;gap:5px;text-align:left;padding:16px;border-radius:15px;border:1px solid #28355c;background:linear-gradient(135deg,#0f1830,#111126);color:#fff;cursor:pointer}.help-cards button:hover{border-color:#9b5cff;transform:translateY(-2px)}.help-cards b{font-size:16px}.help-cards span{color:#99a4bf;font-size:12px}
.onboarding-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.onboarding-steps article{position:relative;padding:18px;border-radius:18px;border:1px solid #334168;background:linear-gradient(145deg,#111a31,#0a1020)}.onboarding-steps article>b{position:absolute;right:14px;top:12px;font-size:34px;color:#8b5cf633}.onboarding-steps button{border:0;border-radius:10px;background:linear-gradient(135deg,#7928ca,#ff2f8b);color:#fff;padding:9px 12px;font-weight:800;cursor:pointer}
.spotlight-activate,.spotlight-live{text-align:center;padding:26px}.spotlight-orb{width:100px;height:100px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center;font-size:48px;background:radial-gradient(circle,#ff4ddb 0,#7c3aed 42%,#11182c 70%);box-shadow:0 0 60px #f0f8}

/* Make minigames feel like challenges */
.y2k-feature.y2k-games{background:radial-gradient(circle at 80% 15%,#ff7a0038,transparent 36%),linear-gradient(145deg,#2a1022,#16112f)!important;border-color:#ff7a4d!important;box-shadow:inset 0 0 28px #ff5a1920,0 0 22px #ff4d6d16}.y2k-feature.y2k-games>span{font-size:34px;filter:drop-shadow(0 0 12px #ff704d)}.y2k-feature.y2k-games strong{color:#ffb44d}.games-grid .game-card:nth-child(3n+1){border-color:#ff4d91;background:radial-gradient(circle at 90% 0,#ff2f5d20,transparent 35%),#10162a}.games-grid .game-card:nth-child(3n+2){border-color:#ff9f43;background:radial-gradient(circle at 90% 0,#ff9f4320,transparent 35%),#10162a}.games-grid .game-card:nth-child(3n){border-color:#34d399;background:radial-gradient(circle at 90% 0,#34d39920,transparent 35%),#10162a}.games-grid .game-card .primary-btn{background:linear-gradient(135deg,#ff2f8b,#ff6b35)}

@media(max-width:900px){.help-cards,.onboarding-steps{grid-template-columns:1fr}.top-page-hero{align-items:flex-start;flex-direction:column}.nosta-menu-dropdown{width:min(85vw,300px)}.compose-kind-pills{grid-template-columns:repeat(2,1fr)}}
.post-link{color:#60a5fa;text-decoration:underline;word-break:break-all}.post-link:hover{color:#f472b6}

/* ===== NOSTA V31 · centering & no horizontal overflow ===== */
html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}
body {
  min-width: 0;
}
.app-shell,
.app-shell-v12,
.main,
.main-v12,
.y2k-home,
.y2k-columns,
.y2k-left,
.y2k-center,
.y2k-right,
.topbar-v12,
.widget {
  min-width: 0;
}

/* Keep the complete app centered inside the available viewport. */
.main-v12 {
  width: 100%;
  max-width: 100%;
  padding-left: clamp(14px, 2vw, 28px) !important;
  padding-right: clamp(14px, 2vw, 28px) !important;
  overflow-x: clip;
}
.topbar-v12,
.y2k-home {
  width: min(100%, 1460px);
  max-width: 1460px;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Flexible columns: never force the page wider than the browser. */
.y2k-columns {
  display: grid;
  grid-template-columns: minmax(230px, .72fr) minmax(0, 1.55fr) minmax(300px, .95fr) !important;
  gap: clamp(10px, 1.2vw, 16px) !important;
  width: 100%;
  max-width: 100%;
  align-items: start;
}
.y2k-columns > *,
.y2k-center > *,
.y2k-right > *,
.y2k-left > * {
  min-width: 0;
  max-width: 100%;
}

/* Prevent inner rows/widgets from creating side-scroll. */
.stories-row-v24 {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}
.nosta25-votechips,
.y2k-feature-row,
.y2k-bottom,
.top20-list-v24,
.nosta25-points-grid,
.y2k-compose-tabs,
.top-period-switch,
.nosta25-tabs {
  max-width: 100%;
}
img, video, iframe, canvas {
  max-width: 100%;
}

/* Spotlight: visually centered both on Home and the dedicated page. */
.spotlight-v24,
#spotlightCard {
  width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}
.spotlight-empty-v24,
.spotlight-content-v24 {
  width: min(100%, 760px);
  max-width: 760px;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
}
.spotlight-person-v24,
.spotlight-meta-v24,
.spotlight-actions-v24 {
  justify-content: center;
}
.spotlight-page {
  width: min(100%, 1080px);
  max-width: 1080px;
  margin: 0 auto !important;
}
.spotlight-page > * {
  width: 100%;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.spotlight-page-hero,
.spotlight-activate,
.spotlight-live {
  text-align: center;
}
.spotlight-page-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.spotlight-activate,
.spotlight-live {
  width: min(100%, 760px);
  margin-left: auto !important;
  margin-right: auto !important;
}
.spotlight-orb {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Large screens: keep a clean centered composition, no giant spread. */
@media (min-width: 1500px) {
  .topbar-v12,
  .y2k-home {
    width: min(100%, 1460px);
  }
}

/* Medium desktop/tablet: collapse right column below without side scrolling. */
@media (max-width: 1240px) {
  .y2k-columns {
    grid-template-columns: minmax(220px, .72fr) minmax(0, 1.45fr) !important;
  }
  .y2k-right {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .y2k-right > .y2k-wallet {
    grid-column: 1 / -1;
  }
}

@media (max-width: 900px) {
  .y2k-columns {
    grid-template-columns: 1fr !important;
  }
  .y2k-right {
    grid-column: auto;
    grid-template-columns: 1fr 1fr !important;
  }
  .y2k-feature-row {
    grid-template-columns: 1fr 1fr !important;
  }
}

@media (max-width: 700px) {
  .main-v12 {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .topbar-v12,
  .y2k-home {
    width: 100%;
  }
  .y2k-right,
  .y2k-feature-row,
  .y2k-bottom {
    grid-template-columns: 1fr !important;
  }
  .spotlight-empty-v24,
  .spotlight-content-v24,
  .spotlight-activate,
  .spotlight-live {
    width: 100%;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* ===== NOSTA V31.1 · hard centering fix ===== */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin:0; width:100%; max-width:100%; overflow-x:hidden !important; }
body { position:relative; }

/* Never let the application itself become wider than the viewport. */
.app-shell,
.app-shell-v12,
.main,
.main-v12 {
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  overflow-x:hidden !important;
}

/* One shared centered width for header and homepage. */
.main-v12 {
  padding:0 0 28px !important;
}
.topbar-v12,
.y2k-home {
  width:calc(100% - 32px) !important;
  max-width:1400px !important;
  min-width:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.topbar-v12 {
  margin-top:0 !important;
  margin-bottom:14px !important;
  padding:12px 16px !important;
  left:auto !important;
  right:auto !important;
  grid-template-columns:minmax(170px,230px) minmax(0,1fr) minmax(0,auto) !important;
}
.topbar-v12 > *,
.top-tabs,
.top-actions,
.y2k-mainnav { min-width:0 !important; max-width:100% !important; }
.top-tabs,
.y2k-mainnav { overflow-x:auto; overflow-y:hidden; scrollbar-width:thin; }
.top-actions { justify-content:flex-end; flex-wrap:wrap; }
.search { min-width:0 !important; width:min(100%,300px) !important; }

/* Desktop columns: fixed side rails + genuinely flexible center. */
.y2k-home { padding:0 !important; }
.y2k-columns {
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 auto !important;
  grid-template-columns:minmax(220px,280px) minmax(0,1fr) minmax(280px,340px) !important;
  gap:14px !important;
}
.y2k-columns > *,
.y2k-left,
.y2k-center,
.y2k-right,
.y2k-left > *,
.y2k-center > *,
.y2k-right > * { min-width:0 !important; max-width:100% !important; }

/* Wide content may scroll inside its own card, never the whole page. */
.stories-row-v24,
.top20-list-v24,
.top-period-switch,
.nosta25-tabs,
.nosta25-votechips,
.y2k-compose-tabs,
.membership-emblems {
  max-width:100% !important;
}
.stories-row-v24 { overflow-x:auto !important; }

/* Spotlight centered as a card and internally. */
#spotlightCard,
.spotlight-v24,
.spotlight-page {
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
#spotlightCard .spotlight-content-v24,
#spotlightCard .spotlight-empty-v24,
.spotlight-page .spotlight-page-hero,
.spotlight-page .spotlight-activate,
.spotlight-page .spotlight-live {
  width:min(100%,760px) !important;
  max-width:760px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}
.spotlight-person-v24,
.spotlight-meta-v24,
.spotlight-actions-v24 { justify-content:center !important; }

/* Collapse early enough to avoid cramped/off-center desktops. */
@media (max-width:1180px) {
  .y2k-columns { grid-template-columns:minmax(220px,270px) minmax(0,1fr) !important; }
  .y2k-right { grid-column:1 / -1 !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .topbar-v12 { grid-template-columns:190px minmax(0,1fr) !important; }
  .top-actions { grid-column:1 / -1 !important; justify-content:center !important; }
}
@media (max-width:820px) {
  .topbar-v12,
  .y2k-home { width:calc(100% - 20px) !important; }
  .topbar-v12 { display:flex !important; flex-wrap:wrap !important; }
  .topbar-v12 > * { width:100% !important; }
  .y2k-columns { grid-template-columns:1fr !important; }
  .y2k-left,.y2k-center,.y2k-right { grid-column:auto !important; }
  .y2k-right { grid-template-columns:1fr !important; }
  .y2k-feature-row,.y2k-bottom { grid-template-columns:1fr !important; }
}
@media (max-width:520px) {
  .topbar-v12,.y2k-home { width:calc(100% - 12px) !important; }
  .spotlight-content-v24,.spotlight-empty-v24,.spotlight-activate,.spotlight-live { padding-left:12px !important; padding-right:12px !important; }
}

/* ===== NOSTA V31.2 · cleaner centered homepage ===== */
.home-top20-compat{display:none!important}

/* Keep the full home genuinely centered on desktop. */
.topbar-v12,
.y2k-home{
  width:min(calc(100% - 32px),1180px)!important;
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Two balanced content columns. The utility cards move underneath. */
.y2k-columns{
  display:grid!important;
  grid-template-columns:minmax(250px,300px) minmax(0,1fr)!important;
  gap:18px!important;
  align-items:start!important;
  width:100%!important;
  margin:0 auto!important;
}
.y2k-left{grid-column:1!important;min-width:0!important}
.y2k-center{grid-column:2!important;min-width:0!important}
.y2k-right{
  grid-column:1 / -1!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  width:100%!important;
  margin:0 auto!important;
  min-width:0!important;
}

/* Spotlight is the only promotional action on Home and gets one calm, centered slot. */
.y2k-feature-row.spotlight-only-row{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:0 auto!important;
}
.y2k-feature-row.spotlight-only-row #spotlightCard{
  width:100%!important;
  max-width:760px!important;
  margin:0 auto!important;
  min-height:220px!important;
}
#spotlightCard .spotlight-empty-v24,
#spotlightCard .spotlight-content-v24{
  width:100%!important;
  max-width:680px!important;
  margin:0 auto!important;
  padding:28px 22px!important;
  text-align:center!important;
}
#spotlightCard .primary-btn{margin-left:auto!important;margin-right:auto!important}

/* Remove any legacy horizontal offset/width rules. */
.main-v12{padding-left:0!important;padding-right:0!important}
.y2k-left,.y2k-center,.y2k-right{margin-left:0!important;margin-right:0!important}
.y2k-home>*{max-width:100%!important}

@media(max-width:980px){
  .topbar-v12,.y2k-home{width:min(calc(100% - 20px),860px)!important}
  .y2k-columns{grid-template-columns:1fr!important}
  .y2k-left,.y2k-center,.y2k-right{grid-column:1!important}
  .y2k-right{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:620px){
  .topbar-v12,.y2k-home{width:calc(100% - 12px)!important}
  .y2k-right{grid-template-columns:1fr!important}
}