:root{--bg:#070707;--panel:rgba(10,10,10,.72);--line:rgba(255,255,255,.11);--text:#f4f4f2;--muted:#aaa;--accent:#ff7500;--accent2:#ff9a36;--accent-rgb:255,117,0;--accent-icon-filter:brightness(0) saturate(100%) invert(55%) sepia(95%) saturate(3220%) hue-rotate(2deg) brightness(104%) contrast(103%);--cursor-default:url('assets/cursor-default.png') 16 16,auto;--cursor-pointer:url('assets/cursor-pointer-orange.png') 16 16,pointer}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#050505;color:var(--text);font-family:Inter,Arial,sans-serif;min-height:100vh}a{text-decoration:none;color:inherit}button{font:inherit}
body:before{content:"";position:fixed;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.56) 44%,rgba(0,0,0,.72) 100%),linear-gradient(0deg,#050505 0%,transparent 38%),url('assets/background.webp') center/cover no-repeat;z-index:-2}body:after{content:"";position:fixed;inset:0;background:radial-gradient(circle at 35% 40%,rgba(var(--accent-rgb),.10),transparent 28%),repeating-linear-gradient(90deg,transparent 0 99px,rgba(255,255,255,.018) 100px);z-index:-1;pointer-events:none}
.page-shell{width:min(1500px,calc(100% - 72px));margin:auto;min-height:100vh;position:relative;padding-bottom:42px}.topbar{height:110px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:44px}.brand{display:flex;align-items:center;gap:14px;min-width:260px}.brand img{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(255,255,255,.08))}.brand-copy{display:flex;flex-direction:column;line-height:1}.brand-copy strong{font-size:20px;letter-spacing:.18em}.brand-copy span{font-size:9px;letter-spacing:.45em;color:#888;margin-top:8px}.nav{display:flex;gap:34px;margin-left:auto}.nav a{text-transform:uppercase;font-size:12px;letter-spacing:.11em;color:#a9a9a9;position:relative;padding:47px 0}.nav a:hover,.nav a.active{color:white}.nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent);box-shadow:0 0 14px rgba(var(--accent-rgb),.7)}.top-actions{display:flex;align-items:center;gap:12px}.server-pill,.discord-mini{height:48px;border:1px solid var(--line);background:rgba(6,6,6,.55);backdrop-filter:blur(14px);display:flex;align-items:center;border-radius:8px}.server-pill{padding:0 14px;gap:7px;font-size:12px}.server-pill img{width:18px;height:18px;object-fit:contain;filter:invert(1);opacity:.75}.server-pill span:last-child{color:#777}.status-dot{width:7px!important;height:7px!important;border-radius:50%;background:#38e478;box-shadow:0 0 12px #38e478}.discord-mini{padding:0 17px;gap:9px;text-transform:uppercase;font-weight:700;font-size:11px}.discord-mini img{width:22px;height:22px;object-fit:contain;filter:invert(1)}.discord-mini:hover{border-color:rgba(var(--accent-rgb),.55)}.menu{display:none;background:none;border:0;color:#fff;width:42px}.menu span{display:block;height:2px;background:#fff;margin:7px 0}
.hero{min-height:610px;display:flex;align-items:center;padding:78px 2vw 34px}.hero-copy{max-width:760px}.eyebrow{font-size:11px;letter-spacing:.5em;color:#c8c8c8;display:flex;align-items:center;gap:15px}.eyebrow span{display:block;width:46px;height:1px;background:var(--accent)}h1{font-size:clamp(68px,8vw,132px);line-height:.80;letter-spacing:-.06em;margin:30px 0 34px;text-transform:uppercase}h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.62);text-shadow:0 0 26px rgba(255,255,255,.05)}.hero-copy>p{max-width:570px;color:#aaa;font-size:17px;line-height:1.7;border-left:2px solid var(--accent);padding-left:18px}.hero-actions{display:flex;gap:14px;margin-top:35px}.btn{height:76px;min-width:255px;border-radius:6px;display:flex;align-items:center;gap:16px;padding:0 23px;border:1px solid var(--line);transition:.22s ease}.btn img{width:37px;height:37px;object-fit:contain}.btn span{display:flex;flex-direction:column;gap:5px}.btn b{font-size:13px;letter-spacing:.06em}.btn small{font-size:11px;font-weight:400}.btn-primary{background:linear-gradient(135deg,var(--accent2),var(--accent));color:#090909;border-color:var(--accent2);box-shadow:0 15px 44px rgba(var(--accent-rgb),.15)}.btn-primary img{filter:brightness(0)}.btn-dark{background:rgba(12,12,12,.76);backdrop-filter:blur(12px)}.btn-dark img{filter:invert(1)}.btn:hover{transform:translateY(-3px)}
.scroll-note{text-align:center;color:#666;font-size:9px;letter-spacing:.35em;padding-top:24px}.scroll-note span{width:1px;height:20px;background:linear-gradient(var(--accent),transparent);display:block;margin:0 auto 10px}
@media(max-width:1050px){.nav{position:fixed;top:0;right:-100%;width:min(370px,85vw);height:100vh;background:#080808;z-index:20;display:flex;flex-direction:column;padding:110px 40px;transition:.3s}.nav.open{right:0}.nav a{padding:14px 0;font-size:16px}.nav a.active:after{display:none}.menu{display:block}.discord-mini span{display:none}.discord-mini{padding:0 12px}.hero{padding-top:55px}}
@media(max-width:700px){.page-shell{width:calc(100% - 30px)}.topbar{height:82px;gap:10px}.brand{min-width:0}.brand img{width:42px;height:42px}.brand-copy strong{font-size:14px}.brand-copy span{display:none}.server-pill{display:none}.hero{min-height:auto;padding:75px 0 40px}.eyebrow{letter-spacing:.3em}.hero-copy>p{font-size:14px}.hero-actions{flex-direction:column}.btn{width:100%}h1{font-size:63px}.scroll-note{padding-bottom:20px}}

/* Single-page sections */
#home,#about,#gallery{scroll-margin-top:24px}

/* About - balanced layout */
.about-section{position:relative;margin-top:84px;padding:0 2vw 72px}
.about-section:before{content:"";position:absolute;left:50%;top:0;width:100vw;transform:translateX(-50%);height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),rgba(var(--accent-rgb),.52),rgba(255,255,255,.13),transparent)}
.about-kicker{display:grid;grid-template-columns:max-content minmax(60px,1fr) max-content;align-items:center;gap:20px;padding:26px 0 34px;color:rgba(255,255,255,.34);font-size:8px;letter-spacing:.28em;text-transform:uppercase;white-space:nowrap}
.about-kicker-line{height:1px;background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.22),rgba(255,255,255,.06))}
.about-intro{display:grid;grid-template-columns:minmax(300px,.88fr) minmax(0,1.12fr);gap:clamp(42px,6vw,96px);align-items:start;padding:58px 0 64px;border-top:1px solid rgba(255,255,255,.07);border-bottom:1px solid rgba(255,255,255,.07)}
.section-index{display:block;color:rgba(255,255,255,.34);font-size:9px;letter-spacing:.3em;margin-bottom:20px}
.about-heading-block{min-width:0}
.about-heading-block h2{max-width:650px;margin:0 0 30px;font-size:clamp(48px,5.3vw,88px);line-height:.9;letter-spacing:-.055em;text-transform:uppercase;overflow-wrap:normal;word-break:normal}
.about-heading-block h2 em,.gallery-heading h3 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.58)}
.about-heading-block>p{max-width:510px;margin:0;padding-left:18px;border-left:1px solid rgba(var(--accent-rgb),.68);color:rgba(255,255,255,.46);font-size:13px;line-height:1.8}
.about-copy-block{min-width:0;margin-top:4px;padding:34px clamp(26px,3vw,44px);border:1px solid rgba(255,255,255,.075);border-radius:14px;background:linear-gradient(135deg,rgba(255,255,255,.025),rgba(255,255,255,.008));backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.copy-label{display:block;margin-bottom:22px;color:var(--accent);font-size:9px;letter-spacing:.3em}
.about-copy-block>h3{max-width:800px;margin:0 0 30px;font-size:clamp(28px,3.1vw,48px);line-height:1.08;letter-spacing:-.035em;font-weight:550}
.copy-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.copy-columns p{margin:0;color:rgba(255,255,255,.43);font-size:13px;line-height:1.8}
.about-sign{margin-top:32px;padding-top:22px;border-top:1px solid rgba(255,255,255,.07);font-size:8px;letter-spacing:.3em;color:rgba(255,255,255,.24)}
.about-sign span{margin:0 8px;color:var(--accent)}

.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid rgba(255,255,255,.08)}
.principle{position:relative;min-width:0;min-height:220px;padding:32px 32px 36px;border-right:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(255,255,255,.012),transparent);transition:.25s ease}
.principle:last-child{border-right:0}
.principle:after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:2px;background:var(--accent);box-shadow:0 0 16px rgba(var(--accent-rgb),.38);transition:.28s ease}
.principle:hover{background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(var(--accent-rgb),.016))}
.principle:hover:after{width:100%}
.principle-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:38px}
.principle-top span{font-size:10px;letter-spacing:.25em;color:rgba(255,255,255,.24)}
.principle-top img{width:30px;height:30px;object-fit:contain;filter:var(--accent-icon-filter);opacity:.72}
.principle h3{margin:0 0 11px;text-transform:uppercase;font-size:14px;line-height:1.3;letter-spacing:.075em}
.principle p{max-width:340px;margin:0;color:rgba(255,255,255,.4);font-size:11px;line-height:1.65}

/* About gallery - balanced 2x2 composition */
.gallery-section{padding:72px 0 10px;scroll-margin-top:24px}
.gallery-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,460px);gap:48px;align-items:end;margin-bottom:30px}
.gallery-heading h3{margin:0;font-size:clamp(38px,4.5vw,72px);line-height:.92;letter-spacing:-.05em;text-transform:uppercase}
.gallery-heading>p{margin:0;max-width:460px;color:rgba(255,255,255,.42);font-size:12px;line-height:1.75}
.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.gallery-card{position:relative;margin:0;aspect-ratio:16/9;overflow:hidden;border:1px solid rgba(255,255,255,.09);border-radius:13px;background:#0a0a0a;isolation:isolate;box-shadow:0 18px 55px rgba(0,0,0,.22);transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}
.gallery-card img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.002);filter:saturate(.88) contrast(1.03);transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .35s ease}
.gallery-card:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.02) 45%,rgba(0,0,0,.72) 100%);pointer-events:none}
.gallery-card:after{content:"";position:absolute;inset:0;z-index:3;border:1px solid transparent;border-radius:inherit;pointer-events:none;transition:.28s ease}
.gallery-card figcaption{position:absolute;z-index:2;left:20px;right:20px;bottom:17px;display:flex;align-items:center;gap:13px;padding-top:13px;border-top:1px solid rgba(255,255,255,.16);text-shadow:0 2px 14px rgba(0,0,0,.8)}
.gallery-card figcaption span{font-size:9px;letter-spacing:.26em;color:var(--accent)}
.gallery-card figcaption strong{font-size:9px;letter-spacing:.18em;color:rgba(255,255,255,.78);font-weight:600}
.gallery-card:hover{transform:translateY(-4px);border-color:rgba(var(--accent-rgb),.28);box-shadow:0 24px 70px rgba(0,0,0,.34)}
.gallery-card:hover img{transform:scale(1.035);filter:saturate(1) contrast(1.04)}
.gallery-card:hover:after{border-color:rgba(var(--accent-rgb),.38);box-shadow:inset 0 0 42px rgba(var(--accent-rgb),.035)}

.about-statement{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:28px;align-items:center;padding:54px 0 0}
.about-statement>span{font-size:8px;letter-spacing:.32em;color:rgba(255,255,255,.28);white-space:nowrap}
.about-statement>strong{min-width:0;font-size:clamp(23px,2.6vw,40px);font-weight:500;line-height:1.1;letter-spacing:-.03em;color:rgba(255,255,255,.82)}
.text-link{font-size:10px;letter-spacing:.14em;color:#ccc;border-bottom:1px solid rgba(255,255,255,.18);padding:8px 0;white-space:nowrap;transition:.2s ease}
.text-link b{color:var(--accent);font-size:14px;margin-left:7px}
.text-link:hover{color:#fff;border-color:var(--accent)}

@media(max-width:1100px){
  .about-intro{grid-template-columns:1fr;gap:38px}
  .about-heading-block h2{max-width:760px}
  .about-heading-block>p{max-width:680px}
  .principles{grid-template-columns:1fr}
  .principle{min-height:0;border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
  .principle:last-child{border-bottom:0}
  .gallery-heading{grid-template-columns:1fr;gap:18px}
  .gallery-heading>p{max-width:680px}
  .gallery-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:820px){
  .about-kicker{grid-template-columns:max-content 1fr}
  .about-kicker>span:last-child{display:none}
  .copy-columns{grid-template-columns:1fr;gap:16px}
  .gallery-grid{grid-template-columns:1fr}
  .about-statement{grid-template-columns:1fr;gap:14px}
}

@media(max-width:700px){
  .about-section{margin-top:56px;padding:0 0 48px}
  .about-kicker{padding:22px 0 28px}
  .about-intro{padding:42px 0 46px;gap:32px}
  .about-heading-block h2{font-size:50px;margin-bottom:24px}
  .about-heading-block>p{font-size:12px}
  .about-copy-block{padding:26px 22px}
  .about-copy-block>h3{font-size:29px;margin-bottom:24px}
  .copy-columns p{font-size:12px}
  .principle{padding:26px 22px}
  .principle-top{margin-bottom:24px}
  .gallery-section{padding-top:52px}
  .gallery-heading{margin-bottom:22px}
  .gallery-heading h3{font-size:45px}
  .gallery-grid{gap:10px}
  .gallery-card figcaption{left:15px;right:15px;bottom:13px}
  .about-statement{padding-top:38px}
  .about-statement>strong{font-size:26px}
}

@media(max-width:420px){
  .about-heading-block h2{font-size:43px}
  .about-copy-block>h3{font-size:26px}
  .gallery-heading h3{font-size:39px}
}

/* Step 8 - interactive gallery: one main image + three selectable thumbnails */
.gallery-viewer{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;max-width:1180px;margin:0 auto}
.gallery-main{position:relative;margin:0;width:100%;aspect-ratio:16/8.25;overflow:hidden;border:1px solid rgba(255,255,255,.10);border-radius:14px;background:#090909;box-shadow:0 24px 70px rgba(0,0,0,.30);isolation:isolate}
.gallery-main img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.92) contrast(1.03);transform:scale(1.001);transition:opacity .22s ease,transform .6s cubic-bezier(.2,.7,.2,1),filter .35s ease}
.gallery-main.is-switching img{opacity:.18;transform:scale(1.018)}
.gallery-main:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 54%,rgba(0,0,0,.76) 100%);pointer-events:none}
.gallery-main:after{content:"";position:absolute;inset:0;z-index:3;border:1px solid rgba(var(--accent-rgb),.08);border-radius:inherit;pointer-events:none}
.gallery-main figcaption{position:absolute;z-index:2;left:24px;right:24px;bottom:20px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.17);text-shadow:0 2px 15px rgba(0,0,0,.8)}
.gallery-main figcaption span{font-size:10px;letter-spacing:.28em;color:var(--accent)}
.gallery-main figcaption strong{font-size:10px;letter-spacing:.18em;color:rgba(255,255,255,.84);font-weight:600}
.gallery-main figcaption small{font-size:8px;letter-spacing:.24em;color:rgba(255,255,255,.42)}
.gallery-thumbnails{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.gallery-thumb{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;padding:0;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:#090909;cursor:pointer;box-shadow:0 12px 34px rgba(0,0,0,.20);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.gallery-thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.74) brightness(.78) contrast(1.04);transform:scale(1.001);transition:transform .45s cubic-bezier(.2,.7,.2,1),filter .25s ease}
.gallery-thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.42));pointer-events:none}
.gallery-thumb span{position:absolute;z-index:2;left:14px;bottom:12px;color:#fff;font-size:9px;letter-spacing:.24em;text-shadow:0 2px 10px #000}
.gallery-thumb:hover,.gallery-thumb:focus-visible{transform:translateY(-3px);border-color:rgba(var(--accent-rgb),.38);box-shadow:0 16px 42px rgba(0,0,0,.32)}
.gallery-thumb:hover img,.gallery-thumb:focus-visible img{filter:saturate(.96) brightness(.96) contrast(1.03);transform:scale(1.035)}
.gallery-thumb:focus-visible{outline:1px solid var(--accent);outline-offset:2px}

@media(max-width:820px){
  .gallery-viewer{gap:10px}
  .gallery-main{aspect-ratio:16/9}
  .gallery-thumbnails{gap:8px}
  .gallery-main figcaption{left:16px;right:16px;bottom:14px}
  .gallery-main figcaption small{display:none}
}
@media(max-width:560px){
  .gallery-thumbnails{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .gallery-thumb{border-radius:7px}
  .gallery-thumb span{left:9px;bottom:8px;font-size:8px}
  .gallery-main figcaption{grid-template-columns:auto 1fr;gap:10px}
}


/* Step 10 - transparent categorized rules section */
.rules-section{scroll-margin-top:118px;padding:96px 0 72px;border-top:1px solid rgba(255,255,255,.07);margin-top:96px}
.rules-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,440px);gap:54px;align-items:end;margin-bottom:42px}
.rules-heading h3{font-size:clamp(48px,5.5vw,82px);line-height:.92;letter-spacing:-.055em;text-transform:uppercase;margin:12px 0 0}
.rules-heading h3 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.55)}
.rules-heading>p{margin:0;color:rgba(255,255,255,.43);font-size:12px;line-height:1.8;max-width:430px}
.rules-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:18px;align-items:start}

.rules-categories{position:sticky;top:132px;display:grid;gap:6px;padding:7px;border:1px solid rgba(255,255,255,.065);border-radius:14px;background:rgba(255,255,255,.012);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.rule-category{width:100%;display:grid;grid-template-columns:35px minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;text-align:left;color:rgba(255,255,255,.56);border:1px solid rgba(255,255,255,.025);border-radius:9px;padding:15px 14px;background:rgba(255,255,255,.006);cursor:pointer;transition:background .22s ease,border-color .22s ease,color .22s ease,transform .22s ease}
.rule-category>span{grid-row:1/3;align-self:center;font-size:10px;letter-spacing:.18em;color:rgba(255,255,255,.22);transition:.22s ease}
.rule-category b{font-size:11px;letter-spacing:.07em;text-transform:uppercase;font-weight:650;color:inherit}
.rule-category small{font-size:9px;color:rgba(255,255,255,.25);margin-top:5px;letter-spacing:.025em}
.rule-category:hover{background:rgba(255,255,255,.018);border-color:rgba(255,255,255,.07);color:#fff;transform:translateX(2px)}
.rule-category.active{background:linear-gradient(100deg,rgba(var(--accent-rgb),.065),rgba(var(--accent-rgb),.008));border-color:rgba(var(--accent-rgb),.17);color:#fff;box-shadow:inset 2px 0 0 var(--accent)}
.rule-category.active>span{color:var(--accent)}

.rules-panels{min-width:0;border:1px solid rgba(255,255,255,.055);border-radius:14px;background:rgba(255,255,255,.008);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.018)}
.rule-panel{display:none;animation:rulePanelIn .28s ease both}
.rule-panel.active{display:block}
@keyframes rulePanelIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.rule-panel-head{min-height:108px;display:flex;align-items:center;gap:20px;padding:25px 29px;border-bottom:1px solid rgba(255,255,255,.05);background:linear-gradient(90deg,rgba(var(--accent-rgb),.027),rgba(255,255,255,.004) 52%,transparent)}
.rule-panel-head>span{font-size:46px;line-height:1;font-weight:700;color:transparent;-webkit-text-stroke:1px rgba(var(--accent-rgb),.38);letter-spacing:-.04em}
.rule-panel-head small{display:block;font-size:8px;letter-spacing:.3em;color:var(--accent);margin-bottom:7px;opacity:.88}
.rule-panel-head h4{font-size:22px;line-height:1;margin:0;text-transform:uppercase;letter-spacing:.025em}

.rule-list{display:grid;gap:7px;padding:9px}
.rule-list article{display:grid;grid-template-columns:72px minmax(0,1fr);gap:19px;padding:20px 21px;border:1px solid rgba(255,255,255,.045);border-radius:9px;background:rgba(255,255,255,.008);transition:background .2s ease,border-color .2s ease,transform .2s ease;position:relative;overflow:hidden}
.rule-list article:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--accent);opacity:.14;transition:.2s ease}
.rule-list article:hover{background:rgba(255,255,255,.022);border-color:rgba(255,255,255,.09);transform:translateX(2px)}
.rule-list article:hover:before{opacity:.85}
.rule-list article>span{font-size:9px;letter-spacing:.18em;color:var(--accent);padding-top:3px;opacity:.86}
.rule-list h5{font-size:12px;text-transform:uppercase;letter-spacing:.055em;margin:0 0 8px;color:rgba(255,255,255,.9)}
.rule-list p{margin:0;max-width:780px;color:rgba(255,255,255,.42);font-size:11px;line-height:1.7}
.rules-note{margin-top:14px;display:grid;grid-template-columns:36px 1fr;gap:14px;align-items:center;border:1px solid rgba(var(--accent-rgb),.12);border-radius:9px;padding:15px 18px;background:rgba(var(--accent-rgb),.018);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.rules-note>span{width:30px;height:30px;border:1px solid rgba(var(--accent-rgb),.29);border-radius:50%;display:grid;place-items:center;color:var(--accent);font-weight:700;font-size:11px}
.rules-note p{margin:0;color:rgba(255,255,255,.39);font-size:10px;line-height:1.6}
.rules-note b{color:rgba(255,255,255,.78)}

@media(max-width:980px){
  .rules-heading{grid-template-columns:1fr;gap:16px}
  .rules-layout{grid-template-columns:1fr}
  .rules-categories{position:relative;top:auto;grid-template-columns:repeat(3,minmax(0,1fr))}
  .rule-category{grid-template-columns:26px minmax(0,1fr);padding:13px 10px}
  .rule-category small{display:none}
}
@media(max-width:700px){
  .rules-section{margin-top:62px;padding:60px 0 44px}
  .rules-heading{margin-bottom:24px}
  .rules-heading h3{font-size:46px}
  .rules-categories{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
  .rule-category b{font-size:9px}
  .rule-panel-head{min-height:92px;padding:21px 18px}
  .rule-panel-head>span{font-size:38px}
  .rule-panel-head h4{font-size:18px}
  .rule-list{padding:7px;gap:6px}
  .rule-list article{grid-template-columns:52px minmax(0,1fr);gap:10px;padding:17px 15px}
  .rule-list h5{font-size:11px}
  .rule-list p{font-size:10px}
}
@media(max-width:440px){
  .rules-categories{grid-template-columns:1fr 1fr}
  .rule-category{grid-template-columns:22px 1fr;column-gap:7px;padding:11px 8px}
  .rule-category>span{font-size:8px}
  .rule-category b{font-size:8px;letter-spacing:.035em}
  .rule-list article{grid-template-columns:1fr}
  .rule-list article>span{padding:0}
}

/* Step 12 - compact right-side music player */
.music-player{position:fixed;right:20px;bottom:18px;left:auto;z-index:120;width:286px;padding:13px 14px 12px;border:1px solid rgba(255,255,255,.075);border-radius:13px;background:linear-gradient(145deg,rgba(8,8,8,.49),rgba(8,8,8,.23));-webkit-backdrop-filter:blur(18px) saturate(120%);backdrop-filter:blur(18px) saturate(120%);box-shadow:0 16px 44px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.035);transition:width .28s ease,padding .28s ease,border-radius .28s ease,background .28s ease;isolation:isolate}
.music-player:before{content:"";position:absolute;right:0;top:13px;bottom:13px;width:1px;background:linear-gradient(180deg,transparent,var(--accent),transparent);opacity:.48;transition:opacity .2s ease}
.music-player__content{opacity:1;max-height:150px;overflow:hidden;transition:opacity .18s ease,max-height .28s ease,visibility .18s ease;visibility:visible}
.music-player__collapse{position:absolute;right:9px;top:9px;z-index:3;width:28px;height:28px;padding:0;border:1px solid rgba(255,255,255,.07);border-radius:8px;background:rgba(255,255,255,.025);cursor:pointer;display:grid;place-items:center;transition:.18s ease}
.music-player__collapse:hover{background:rgba(255,255,255,.06);border-color:rgba(var(--accent-rgb),.23)}
.music-mini-wave{height:14px;display:flex;align-items:center;justify-content:center;gap:2px}
.music-mini-wave i{display:block;width:2px;height:6px;border-radius:3px;background:rgba(var(--accent-rgb),.82);box-shadow:0 0 7px rgba(var(--accent-rgb),.25);animation:musicMiniWave .78s ease-in-out infinite alternate;animation-play-state:paused}
.music-player.playing .music-mini-wave i{animation-play-state:running}
.music-mini-wave i:nth-child(2){height:11px;animation-delay:.14s}.music-mini-wave i:nth-child(3){height:8px;animation-delay:.28s}
@keyframes musicMiniWave{0%{transform:scaleY(.45);opacity:.42}100%{transform:scaleY(1.22);opacity:1}}
.music-player__header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;min-width:0;padding-right:34px}
.music-player__meta{min-width:0;display:flex;flex-direction:column;gap:1px}
.music-player__meta>span{font-size:6px;letter-spacing:.23em;color:rgba(255,255,255,.25)}
.music-player__meta strong{font-size:10px;line-height:1.3;letter-spacing:.065em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:rgba(255,255,255,.9)}
.music-player__meta small{font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:rgba(255,255,255,.36)}
.music-player__trackno{padding-top:2px;font-size:7px;letter-spacing:.13em;color:rgba(255,255,255,.23);white-space:nowrap}
.music-player__timeline{display:grid;grid-template-columns:25px minmax(0,1fr) 25px;gap:7px;align-items:center;margin:9px 0 7px}
.music-player__timeline>span{font-size:6px;color:rgba(255,255,255,.27);font-variant-numeric:tabular-nums}.music-player__timeline>span:last-child{text-align:right}
.music-player input[type="range"]{-webkit-appearance:none;appearance:none;width:100%;height:12px;margin:0;background:transparent;cursor:pointer}
.music-player input[type="range"]::-webkit-slider-runnable-track{height:2px;border-radius:4px;background:linear-gradient(90deg,var(--accent) 0 var(--range-progress,0%),rgba(255,255,255,.11) var(--range-progress,0%) 100%)}
.music-player input[type="range"]::-moz-range-track{height:2px;border-radius:4px;background:rgba(255,255,255,.11)}
.music-player input[type="range"]::-moz-range-progress{height:2px;border-radius:4px;background:var(--accent)}
.music-player input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:6px;height:6px;margin-top:-2px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 2px rgba(var(--accent-rgb),.1)}
.music-player input[type="range"]::-moz-range-thumb{width:6px;height:6px;border:0;border-radius:50%;background:#fff}
.music-player__bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:7px;border-top:1px solid rgba(255,255,255,.045)}
.music-player__controls{display:flex;align-items:center;gap:2px}
.music-control,.music-player__volume button{position:relative;width:25px;height:25px;padding:0;border:1px solid transparent;border-radius:7px;background:transparent;color:#fff;cursor:pointer;transition:.18s ease}
.music-control:hover,.music-player__volume button:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.055)}
.music-control--main{width:29px;height:29px;border-color:rgba(var(--accent-rgb),.2);background:rgba(var(--accent-rgb),.06)}
.music-control--main:hover{border-color:rgba(var(--accent-rgb),.38);background:rgba(var(--accent-rgb),.1)}
.music-play-glyph{position:absolute;left:10px;top:8px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:8px solid rgba(255,255,255,.88);transition:.16s ease}
.music-player.playing .music-play-glyph{left:8px;top:8px;width:11px;height:12px;border:0;background:linear-gradient(90deg,rgba(255,255,255,.88) 0 3px,transparent 3px 8px,rgba(255,255,255,.88) 8px 11px)}
.music-control--skip span:before,.music-control--skip span:after{content:"";position:absolute;top:8px;width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent}
.music-control--skip.prev span:before{left:7px;border-right:6px solid rgba(255,255,255,.5)}.music-control--skip.prev span:after{left:12px;border-right:6px solid rgba(255,255,255,.5)}
.music-control--skip.next span:before{left:7px;border-left:6px solid rgba(255,255,255,.5)}.music-control--skip.next span:after{left:12px;border-left:6px solid rgba(255,255,255,.5)}
.music-player__volume{display:grid;grid-template-columns:27px 62px;gap:2px;align-items:center;min-width:0}.music-player__volume button{width:27px}.volume-mark{font-size:5.5px;letter-spacing:.08em;color:rgba(255,255,255,.35)}.music-player.muted .volume-mark{color:rgba(var(--accent-rgb),.72)}
#musicVolume{--range-progress:30%}
.music-player.collapsed{width:44px;height:44px;padding:0;border-radius:12px;background:rgba(8,8,8,.34);overflow:hidden}
.music-player.collapsed:before{opacity:0}
.music-player.collapsed .music-player__content{opacity:0;max-height:0;visibility:hidden;pointer-events:none}
.music-player.collapsed .music-player__collapse{position:absolute;inset:0;width:44px;height:44px;border:0;border-radius:12px;background:transparent}
.music-player.collapsed .music-mini-wave{height:18px;gap:3px}.music-player.collapsed .music-mini-wave i{width:2px}.music-player.collapsed .music-mini-wave i:nth-child(2){height:14px}.music-player.collapsed .music-mini-wave i:nth-child(3){height:9px}
@media(max-width:700px){.music-player{right:12px;bottom:12px;width:min(276px,calc(100vw - 24px));padding:12px 13px 11px}.music-player.collapsed{width:44px;padding:0}.music-player__volume{grid-template-columns:25px 55px}.music-player__timeline{margin:8px 0 6px}}

/* Step 13 - fixed top navigation + navbar-integrated music player */
:root{--topbar-height:88px}
.page-shell{padding-top:var(--topbar-height)}
.topbar{
  position:fixed;
  top:0;
  left:50%;
  transform:translateX(-50%);
  z-index:150;
  width:min(1500px,calc(100% - 72px));
  height:var(--topbar-height);
  gap:24px;
  padding:0 2px;
  border-bottom:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg,rgba(5,5,5,.90),rgba(5,5,5,.72));
  -webkit-backdrop-filter:blur(18px) saturate(125%);
  backdrop-filter:blur(18px) saturate(125%);
  box-shadow:0 14px 34px rgba(0,0,0,.12);
}
.topbar:before{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.18),transparent);
  pointer-events:none;
}
.brand{min-width:214px;gap:12px}
.brand img{width:46px;height:46px}
.brand-copy strong{font-size:17px}
.brand-copy span{font-size:8px;margin-top:6px}
.nav{gap:22px;margin-left:auto;min-width:0;white-space:nowrap}
.nav a{font-size:10px;letter-spacing:.10em;padding:37px 0 34px}
.top-actions{gap:8px;min-width:0}
.discord-mini{height:42px;padding:0 12px;border-radius:9px}
.discord-mini img{width:19px;height:19px}.discord-mini span{font-size:9px}

/* Player now lives inside the topbar instead of the viewport corner. */
.topbar .music-player{
  position:relative;
  right:auto;bottom:auto;left:auto;top:auto;
  z-index:2;
  width:224px;
  height:52px;
  padding:7px 38px 7px 10px;
  border-radius:10px;
  box-shadow:none;
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.014));
  flex:0 0 auto;
}
.topbar .music-player:before{top:8px;bottom:8px;opacity:.34}
.topbar .music-player__collapse{right:6px;top:6px;width:28px;height:38px;border-radius:8px}
.topbar .music-player__content{
  height:100%;
  max-height:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  column-gap:8px;
  align-items:center;
  overflow:visible;
}
.topbar .music-player__header{display:block;min-width:0;padding:0;grid-column:1;grid-row:1}
.topbar .music-player__meta{gap:0}
.topbar .music-player__meta>span,.topbar .music-player__trackno{display:none}
.topbar .music-player__meta strong{font-size:8.5px;letter-spacing:.055em}
.topbar .music-player__meta small{font-size:7px;margin-top:1px}
.topbar .music-player__timeline{grid-column:1;grid-row:2;display:block;margin:1px 0 0}
.topbar .music-player__timeline>span{display:none}
.topbar .music-player__timeline input{height:9px}
.topbar .music-player__bottom{grid-column:2;grid-row:1 / span 2;padding:0;border:0;gap:3px}
.topbar .music-player__controls{gap:0}
.topbar .music-control{width:23px;height:23px;border-radius:6px}
.topbar .music-control--main{width:25px;height:25px}
.topbar .music-play-glyph{left:9px;top:7px;border-top-width:5px;border-bottom-width:5px;border-left-width:7px}
.topbar .music-player.playing .music-play-glyph{left:7px;top:7px;width:10px;height:11px;background:linear-gradient(90deg,rgba(255,255,255,.88) 0 3px,transparent 3px 7px,rgba(255,255,255,.88) 7px 10px)}
.topbar .music-control--skip span:before,.topbar .music-control--skip span:after{top:7px;border-top-width:4px;border-bottom-width:4px}
.topbar .music-control--skip.prev span:before{left:6px;border-right-width:5px}.topbar .music-control--skip.prev span:after{left:10px;border-right-width:5px}
.topbar .music-control--skip.next span:before{left:6px;border-left-width:5px}.topbar .music-control--skip.next span:after{left:10px;border-left-width:5px}
.topbar .music-player__volume{display:none}
.topbar .music-player.collapsed{width:42px;height:42px;padding:0;border-radius:10px}
.topbar .music-player.collapsed .music-player__collapse{inset:0;width:42px;height:42px;border-radius:10px}
.topbar .music-player.collapsed .music-player__content{display:none}

#home,#about,#gallery,#rules,#application{scroll-margin-top:calc(var(--topbar-height) + 20px)}
.hero{padding-top:58px}

@media(max-width:1320px){
  .topbar{gap:16px}
  .brand{min-width:176px}.brand-copy span{display:none}
  .nav{gap:16px}.nav a{font-size:9px}
  .topbar .music-player{width:194px}
  .discord-mini span{display:none}.discord-mini{padding:0 10px}
}

@media(max-width:1120px){
  :root{--topbar-height:78px}
  .topbar{width:calc(100% - 36px);gap:10px;height:var(--topbar-height)}
  .page-shell{width:calc(100% - 36px)}
  .brand{min-width:0;margin-right:auto}.brand img{width:42px;height:42px}.brand-copy strong{font-size:14px}.brand-copy span{display:none}
  .nav{position:fixed;top:var(--topbar-height);right:-100%;width:min(370px,88vw);height:calc(100vh - var(--topbar-height));background:rgba(8,8,8,.96);z-index:20;display:flex;flex-direction:column;padding:34px 32px;gap:0;transition:.3s;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
  .nav.open{right:-18px}
  .nav a{padding:14px 0;font-size:14px}.nav a.active:after{display:none}
  .menu{display:block;flex:0 0 42px}
  .topbar .music-player{width:42px;height:42px;padding:0;border-radius:10px}
  .topbar .music-player__collapse{inset:0;width:42px;height:42px;border-radius:10px}
  .topbar .music-player__content{position:absolute;right:0;top:50px;width:238px;height:auto;min-height:64px;padding:10px 40px 10px 11px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:rgba(8,8,8,.88);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 18px 46px rgba(0,0,0,.34)}
  .topbar .music-player.collapsed .music-player__content{display:none}
  .topbar .music-player:not(.collapsed) .music-player__collapse{background:rgba(var(--accent-rgb),.06);border-color:rgba(var(--accent-rgb),.18)}
}

@media(max-width:700px){
  .topbar{width:calc(100% - 24px)}
  .page-shell{width:calc(100% - 24px)}
  .discord-mini{display:none}
  .top-actions{gap:5px}
  .hero{padding-top:44px}
}


/* Step 14 - brighter background, refined fixed navbar and volume popover */
:root{--topbar-height:78px}
body{background:#090908}
body:before{
  background:
    linear-gradient(90deg,rgba(0,0,0,.54) 0%,rgba(0,0,0,.25) 43%,rgba(0,0,0,.38) 100%),
    linear-gradient(0deg,rgba(7,7,7,.84) 0%,rgba(7,7,7,.20) 31%,transparent 56%),
    url('assets/background.webp') center/cover no-repeat;
  filter:saturate(1.03) brightness(1.08);
}
body:after{
  background:
    radial-gradient(circle at 38% 38%,rgba(var(--accent-rgb),.085),transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.012),transparent 25%),
    repeating-linear-gradient(90deg,transparent 0 119px,rgba(255,255,255,.012) 120px);
}
.page-shell{padding-top:var(--topbar-height)}
.topbar{
  width:min(1520px,calc(100% - 32px));
  height:var(--topbar-height);
  gap:18px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.075);
  border-top:0;
  border-radius:0 0 13px 13px;
  background:linear-gradient(180deg,rgba(12,12,12,.58),rgba(8,8,8,.34));
  -webkit-backdrop-filter:blur(22px) saturate(132%);
  backdrop-filter:blur(22px) saturate(132%);
  box-shadow:0 10px 28px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.025);
}
.topbar:before{left:14px;right:14px;background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.23),transparent)}
.brand{min-width:190px;gap:10px}
.brand img{width:42px;height:42px}
.brand-copy strong{font-size:16px;letter-spacing:.16em}
.brand-copy span{font-size:7px;letter-spacing:.38em;margin-top:5px}
.nav{gap:20px}
.nav a{font-size:9.5px;letter-spacing:.095em;padding:31px 0 29px}
.nav a.active:after{height:1px;box-shadow:0 0 10px rgba(var(--accent-rgb),.55)}
.top-actions{gap:7px}
.discord-mini{height:40px;padding:0 11px;background:rgba(255,255,255,.018);border-color:rgba(255,255,255,.07)}
.discord-mini:hover{background:rgba(255,255,255,.035);border-color:rgba(var(--accent-rgb),.30)}

/* Compact player aligned as a native navbar item. */
.topbar .music-player{
  width:268px;
  height:46px;
  padding:6px 36px 6px 10px;
  border-color:rgba(255,255,255,.065);
  border-radius:9px;
  background:rgba(255,255,255,.016);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  overflow:visible;
}
.topbar .music-player:before{top:10px;bottom:10px;opacity:.22}
.topbar .music-player__collapse{right:5px;top:5px;width:27px;height:36px;border-radius:7px;border-color:rgba(255,255,255,.045);background:rgba(255,255,255,.012)}
.topbar .music-player__content{
  display:grid;
  grid-template-columns:minmax(88px,1fr) auto;
  grid-template-rows:1fr;
  gap:7px;
  align-items:center;
  overflow:visible;
}
.topbar .music-player__header{grid-column:1;grid-row:1;padding:0 0 6px;align-self:center}
.topbar .music-player__meta strong{font-size:8.4px;letter-spacing:.05em}
.topbar .music-player__meta small{font-size:6.8px;color:rgba(255,255,255,.32)}
.topbar .music-player__timeline{
  position:absolute;
  left:10px;
  right:133px;
  bottom:5px;
  margin:0;
  height:8px;
}
.topbar .music-player__timeline input{height:8px}
.topbar .music-player__bottom{grid-column:2;grid-row:1;display:flex;align-items:center;gap:2px;overflow:visible}
.topbar .music-player__controls{gap:0}
.topbar .music-control{width:21px;height:23px}
.topbar .music-control--main{width:25px;height:25px}

/* Volume trigger and floating control. */
.topbar .music-player__volume{position:relative;display:block;min-width:27px;width:27px;height:27px}
.topbar .music-player__volume button{width:27px;height:27px;border-radius:7px}
.volume-icon{position:absolute;inset:0;display:block}
.volume-icon i{position:absolute;left:6px;top:10px;width:5px;height:7px;border-radius:1px;background:rgba(255,255,255,.72)}
.volume-icon i:after{content:"";position:absolute;left:4px;top:-3px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:7px solid rgba(255,255,255,.72);transform:rotate(180deg)}
.volume-icon b,.volume-icon em{position:absolute;display:block;border:1px solid transparent;border-right-color:rgba(255,255,255,.55);border-radius:50%;font-style:normal}
.volume-icon b{left:13px;top:8px;width:6px;height:11px}
.volume-icon em{left:14px;top:5px;width:10px;height:17px;opacity:.5}
.music-player.muted .volume-icon b,.music-player.muted .volume-icon em{display:none}
.music-player.muted .volume-icon:after{content:"";position:absolute;left:15px;top:7px;width:1px;height:13px;background:var(--accent);transform:rotate(45deg)}
.music-volume-popover{
  position:absolute;
  right:-4px;
  top:36px;
  z-index:240;
  width:154px;
  padding:10px 11px 9px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:10px;
  background:rgba(10,10,10,.70);
  -webkit-backdrop-filter:blur(20px) saturate(130%);
  backdrop-filter:blur(20px) saturate(130%);
  box-shadow:0 15px 38px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.03);
  opacity:0;
  visibility:hidden;
  transform:translateY(-5px) scale(.98);
  transform-origin:top right;
  pointer-events:none;
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
}
.music-player.volume-open .music-volume-popover{opacity:1;visibility:visible;transform:translateY(0) scale(1);pointer-events:auto}
.music-volume-popover:before{content:"";position:absolute;right:11px;top:-5px;width:9px;height:9px;border-left:1px solid rgba(255,255,255,.08);border-top:1px solid rgba(255,255,255,.08);background:rgba(10,10,10,.72);transform:rotate(45deg)}
.music-volume-popover__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px}
.music-volume-popover__head span{font-size:6px;letter-spacing:.22em;color:rgba(255,255,255,.34)}
.music-volume-popover__head b{font-size:7px;letter-spacing:.08em;color:rgba(255,255,255,.68);font-weight:600}
.music-volume-popover #musicVolume{height:14px}

.topbar .music-player.collapsed{width:40px;height:40px;border-radius:9px}
.topbar .music-player.collapsed .music-player__collapse{width:40px;height:40px;border-radius:9px}
.topbar .music-player.collapsed .music-volume-popover{display:none}

#home,#about,#gallery,#rules,#application{scroll-margin-top:calc(var(--topbar-height) + 18px)}
.hero{padding-top:52px}

@media(max-width:1320px){
  .topbar{gap:12px}
  .brand{min-width:156px}.brand-copy span{display:none}
  .nav{gap:14px}.nav a{font-size:8.8px}
  .topbar .music-player{width:244px}
  .topbar .music-player__timeline{right:126px}
  .discord-mini span{display:none}.discord-mini{padding:0 9px}
}
@media(max-width:1120px){
  :root{--topbar-height:72px}
  .topbar{width:calc(100% - 24px);height:var(--topbar-height);border-radius:0 0 11px 11px;padding:0 10px}
  .page-shell{width:calc(100% - 30px)}
  .brand{min-width:0}.brand img{width:39px;height:39px}
  .nav{top:var(--topbar-height);height:calc(100vh - var(--topbar-height));background:rgba(9,9,9,.78);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
  .topbar .music-player{width:40px;height:40px;padding:0;border-radius:9px}
  .topbar .music-player__collapse{inset:0;width:40px;height:40px;border-radius:9px}
  .topbar .music-player__content{position:absolute;right:0;top:48px;width:250px;height:58px;padding:8px 38px 8px 10px;grid-template-columns:minmax(92px,1fr) auto;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(9,9,9,.72);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:0 16px 40px rgba(0,0,0,.26)}
  .topbar .music-player__timeline{left:10px;right:130px;bottom:7px}
  .topbar .music-player__volume{display:block}
  .music-volume-popover{top:34px;right:-2px}
}
@media(max-width:700px){
  .topbar{width:calc(100% - 16px);padding:0 8px}
  .page-shell{width:calc(100% - 24px)}
  .hero{padding-top:38px}
}

/* Step 15 - navbar / music player geometry cleanup */
@media (min-width:1121px){
  .topbar{
    display:flex;
    align-items:center;
    gap:clamp(10px,1.15vw,18px);
    padding-left:14px;
    padding-right:14px;
  }
  .brand{
    flex:0 0 auto;
    min-width:174px;
  }
  .nav{
    flex:1 1 auto;
    min-width:0;
    margin-left:0;
    justify-content:center;
    gap:clamp(13px,1.35vw,21px);
  }
  .nav a{
    flex:0 0 auto;
    padding-left:0;
    padding-right:0;
  }
  .top-actions{
    flex:0 0 auto;
    min-width:0;
    gap:7px;
  }

  .topbar .music-player{
    position:relative;
    display:flex;
    align-items:center;
    gap:6px;
    width:292px;
    height:44px;
    padding:5px 5px 5px 10px;
    border:1px solid rgba(255,255,255,.07);
    border-radius:9px;
    background:rgba(255,255,255,.015);
    overflow:visible;
    flex:0 0 292px;
  }
  .topbar .music-player:before{display:none}

  .topbar .music-player__content{
    position:relative;
    order:1;
    flex:1 1 auto;
    width:auto;
    min-width:0;
    height:34px;
    display:grid;
    grid-template-columns:minmax(84px,1fr) auto;
    grid-template-rows:28px 6px;
    column-gap:7px;
    row-gap:0;
    align-items:center;
    overflow:visible;
    opacity:1;
    visibility:visible;
    max-height:none;
  }
  .topbar .music-player__header{
    grid-column:1;
    grid-row:1;
    min-width:0;
    padding:0;
    align-self:center;
  }
  .topbar .music-player__meta{
    min-width:0;
    display:block;
  }
  .topbar .music-player__meta>span,
  .topbar .music-player__trackno{display:none}
  .topbar .music-player__meta strong{
    display:block;
    max-width:100%;
    margin:0;
    font-size:8.5px;
    line-height:1.15;
    letter-spacing:.045em;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .topbar .music-player__meta small{
    display:block;
    max-width:100%;
    margin-top:2px;
    font-size:6.6px;
    line-height:1.1;
    color:rgba(255,255,255,.34);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .topbar .music-player__timeline{
    position:static;
    grid-column:1;
    grid-row:2;
    align-self:center;
    width:100%;
    height:6px;
    margin:0;
    display:block;
  }
  .topbar .music-player__timeline>span{display:none}
  .topbar .music-player__timeline input{
    display:block;
    width:100%;
    height:6px;
    margin:0;
  }

  .topbar .music-player__bottom{
    grid-column:2;
    grid-row:1 / span 2;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:2px;
    min-width:max-content;
    padding:0;
    border:0;
    overflow:visible;
  }
  .topbar .music-player__controls{
    display:flex;
    align-items:center;
    gap:1px;
  }
  .topbar .music-control,
  .topbar .music-player__volume button{
    flex:0 0 auto;
    width:26px;
    height:26px;
    padding:0;
    border-radius:7px;
  }
  .topbar .music-control--main{
    width:28px;
    height:28px;
  }

  /* Previous / next: one triangle + one stop bar, never overlapping. */
  .topbar .music-control--skip span:before,
  .topbar .music-control--skip span:after{
    content:"";
    position:absolute;
    display:block;
    top:50%;
    transform:translateY(-50%);
  }
  .topbar .music-control--skip.prev span:before{
    left:9px;
    width:0;
    height:0;
    border-top:5px solid transparent;
    border-bottom:5px solid transparent;
    border-right:7px solid rgba(255,255,255,.65);
    border-left:0;
  }
  .topbar .music-control--skip.prev span:after{
    left:7px;
    width:2px;
    height:10px;
    border:0;
    border-radius:1px;
    background:rgba(255,255,255,.65);
  }
  .topbar .music-control--skip.next span:before{
    left:10px;
    width:0;
    height:0;
    border-top:5px solid transparent;
    border-bottom:5px solid transparent;
    border-left:7px solid rgba(255,255,255,.65);
    border-right:0;
  }
  .topbar .music-control--skip.next span:after{
    left:18px;
    width:2px;
    height:10px;
    border:0;
    border-radius:1px;
    background:rgba(255,255,255,.65);
  }

  .topbar .music-play-glyph{
    left:10px;
    top:8px;
    border-top-width:6px;
    border-bottom-width:6px;
    border-left-width:8px;
  }
  .topbar .music-player.playing .music-play-glyph{
    left:8px;
    top:8px;
    width:12px;
    height:12px;
    border:0;
    background:linear-gradient(90deg,rgba(255,255,255,.88) 0 3px,transparent 3px 9px,rgba(255,255,255,.88) 9px 12px);
  }

  .topbar .music-player__volume{
    position:relative;
    display:block;
    flex:0 0 28px;
    width:28px;
    min-width:28px;
    height:28px;
  }
  .topbar .music-player__volume button{
    position:relative;
    display:block;
    width:28px;
    height:28px;
  }
  .volume-icon{
    position:absolute;
    inset:0;
    display:block;
  }
  .volume-icon i{
    position:absolute;
    left:7px;
    top:11px;
    width:5px;
    height:6px;
    border-radius:1px;
    background:rgba(255,255,255,.72);
  }
  .volume-icon i:after{
    content:"";
    position:absolute;
    left:4px;
    top:-3px;
    width:0;
    height:0;
    border-top:6px solid transparent;
    border-bottom:6px solid transparent;
    border-right:7px solid rgba(255,255,255,.72);
    transform:rotate(180deg);
  }
  .volume-icon b,
  .volume-icon em{
    position:absolute;
    display:block;
    font-style:normal;
    border:0;
    border-right:1px solid rgba(255,255,255,.58);
    border-radius:0 50% 50% 0;
  }
  .volume-icon b{
    left:15px;
    top:9px;
    width:5px;
    height:10px;
  }
  .volume-icon em{
    left:16px;
    top:7px;
    width:7px;
    height:14px;
    opacity:.5;
  }
  .music-player.muted .volume-icon b,
  .music-player.muted .volume-icon em{display:none}
  .music-player.muted .volume-icon:after{
    content:"";
    position:absolute;
    left:16px;
    top:8px;
    width:1px;
    height:13px;
    background:var(--accent);
    transform:rotate(45deg);
  }

  /* Collapse is in normal flex flow, so it can never sit on the volume icon. */
  .topbar .music-player__collapse{
    position:relative;
    inset:auto;
    order:2;
    flex:0 0 30px;
    width:30px;
    height:32px;
    margin:0;
    border-radius:7px;
    background:rgba(255,255,255,.012);
  }
  .topbar .music-mini-wave{
    width:16px;
    height:14px;
    gap:2px;
  }

  .topbar .music-player.collapsed{
    width:38px;
    height:38px;
    flex-basis:38px;
    padding:0;
    gap:0;
    border-radius:9px;
    overflow:hidden;
  }
  .topbar .music-player.collapsed .music-player__content{display:none}
  .topbar .music-player.collapsed .music-player__collapse{
    position:absolute;
    inset:0;
    width:38px;
    height:38px;
    margin:0;
    border:0;
    border-radius:9px;
  }
}

@media (min-width:1121px) and (max-width:1320px){
  .brand{min-width:148px}
  .brand-copy span{display:none}
  .nav{gap:12px}
  .nav a{font-size:8.6px;letter-spacing:.075em}
  .discord-mini span{display:none}
  .discord-mini{width:38px;padding:0;justify-content:center}
  .topbar .music-player{width:262px;flex-basis:262px}
  .topbar .music-player__content{grid-template-columns:minmax(70px,1fr) auto;column-gap:5px}
}

/* Mobile/tablet player popup stays compact and uses the same clean icon geometry. */
@media (max-width:1120px){
  .topbar .music-player{overflow:visible}
  .topbar .music-player__content{
    right:0;
    top:48px;
    width:min(258px,calc(100vw - 28px));
    min-height:62px;
    padding:9px 10px;
    grid-template-columns:minmax(88px,1fr) auto;
    grid-template-rows:1fr 9px;
    column-gap:7px;
  }
  .topbar .music-player__header{grid-column:1;grid-row:1;padding:0}
  .topbar .music-player__timeline{position:static;grid-column:1;grid-row:2;width:100%;height:8px;margin:0}
  .topbar .music-player__bottom{grid-column:2;grid-row:1 / span 2;gap:2px}
  .topbar .music-player__collapse{z-index:4}
  .music-volume-popover{right:0;top:34px}
}


/* Step 16: custom uploaded volume icon */
.music-volume-button{
  display:grid;
  place-items:center;
}
.music-volume-button .volume-icon-image{
  width:15px;
  height:15px;
  object-fit:contain;
  display:block;
  filter:var(--accent-icon-filter);
  opacity:.84;
  pointer-events:none;
}
.topbar .music-player__volume button:hover .volume-icon-image,
.music-volume-button:hover .volume-icon-image{
  opacity:1;
}
.music-player.muted .music-volume-button .volume-icon-image{
  opacity:.34;
}
.music-player.muted .music-volume-button::after{
  content:"";
  position:absolute;
  width:2px;
  height:15px;
  right:8px;
  top:5px;
  border-radius:2px;
  background:var(--accent);
  transform:rotate(45deg);
  box-shadow:0 0 10px rgba(var(--accent-rgb),.32);
}
/* disable previous drawn speaker for the uploaded-icon version */
.volume-icon{display:none !important;}


/* Step 18 — separate store view */
.store-view{display:none;min-height:calc(100vh - var(--topbar-height));padding:54px 2vw 72px;animation:storeReveal .32s ease both}
body.store-open .store-view{display:block}
body.store-open .hero,body.store-open .about-section,body.store-open .rules-section{display:none}
@keyframes storeReveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.store-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.5fr);gap:64px;align-items:end;padding:56px 0 42px;border-bottom:1px solid rgba(255,255,255,.085)}
.store-kicker{display:block;margin-bottom:18px;color:var(--accent);font-size:8px;letter-spacing:.34em}
.store-hero h2{max-width:820px;margin:0;font-size:clamp(54px,6.2vw,104px);line-height:.84;letter-spacing:-.06em;text-transform:uppercase}
.store-hero h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.58)}
.store-hero__copy>p{max-width:620px;margin:28px 0 0;padding-left:17px;border-left:1px solid rgba(var(--accent-rgb),.65);color:rgba(255,255,255,.43);font-size:12px;line-height:1.75}
.store-hero__meta{justify-self:end;width:min(100%,330px);padding:20px 0 2px;border-top:1px solid rgba(255,255,255,.09)}
.store-hero__meta>span{display:block;margin-bottom:11px;font-size:7px;letter-spacing:.28em;color:rgba(255,255,255,.28)}
.store-hero__meta strong{display:flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.12em;font-weight:600}
.store-hero__meta strong i{width:7px;height:7px;border-radius:50%;background:#35d977;box-shadow:0 0 15px rgba(53,217,119,.45)}
.store-hero__meta small{display:block;margin-top:12px;color:rgba(255,255,255,.28);font-size:9px;line-height:1.6}
.store-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0}
.store-categories{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.store-category{height:36px;padding:0 15px;border:1px solid rgba(255,255,255,.075);border-radius:7px;background:rgba(255,255,255,.018);color:rgba(255,255,255,.42);font-size:8px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:.2s ease}
.store-category:hover{color:#fff;border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.035)}
.store-category.active{color:#fff;border-color:rgba(var(--accent-rgb),.34);background:rgba(var(--accent-rgb),.07);box-shadow:inset 0 -1px 0 rgba(var(--accent-rgb),.4)}
.store-count{font-size:7px;letter-spacing:.2em;color:rgba(255,255,255,.25);white-space:nowrap}.store-count span{color:var(--accent);font-size:10px;margin-right:7px}
.store-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.store-card{position:relative;min-width:0;overflow:hidden;border:1px solid rgba(255,255,255,.075);border-radius:12px;background:linear-gradient(145deg,rgba(12,12,12,.40),rgba(8,8,8,.18));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .25s ease,border-color .25s ease,background .25s ease}
.store-card[hidden]{display:none}
.store-card:hover{transform:translateY(-3px);border-color:rgba(var(--accent-rgb),.22);background:linear-gradient(145deg,rgba(16,16,16,.48),rgba(8,8,8,.20))}
.store-card--featured:before{content:"ÖNERİLEN";position:absolute;right:12px;top:12px;z-index:3;padding:5px 7px;border:1px solid rgba(var(--accent-rgb),.28);border-radius:4px;background:rgba(var(--accent-rgb),.08);color:#ff9a36;font-size:6px;letter-spacing:.18em}
.store-card__top{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;border-bottom:1px solid rgba(255,255,255,.055)}
.store-card__top span{font-size:8px;color:var(--accent);letter-spacing:.2em}.store-card__top small{font-size:6px;letter-spacing:.18em;color:rgba(255,255,255,.25)}
.store-card__visual{position:relative;height:145px;display:flex;align-items:flex-end;justify-content:space-between;padding:18px;overflow:hidden;background:radial-gradient(circle at 68% 20%,rgba(var(--accent-rgb),.10),transparent 34%),linear-gradient(115deg,rgba(255,255,255,.025),transparent 55%)}
.store-card__visual:before{content:"";position:absolute;left:-14%;bottom:-62%;width:72%;aspect-ratio:1;border:1px solid rgba(255,255,255,.055);border-radius:50%}
.store-card__visual:after{content:"";position:absolute;right:-11%;top:-48%;width:62%;aspect-ratio:1;border:1px solid rgba(var(--accent-rgb),.11);border-radius:50%}
.store-card__visual b{position:relative;z-index:1;font-size:clamp(28px,3vw,48px);letter-spacing:-.055em;line-height:.8;color:rgba(255,255,255,.82)}
.store-card__visual span{position:relative;z-index:1;font-size:8px;letter-spacing:.3em;color:rgba(var(--accent-rgb),.66);writing-mode:vertical-rl}
.store-card__body{padding:18px 18px 16px;border-top:1px solid rgba(255,255,255,.055)}
.store-card__body>div:first-child small{display:block;margin-bottom:5px;color:rgba(255,255,255,.25);font-size:6px;letter-spacing:.22em}
.store-card__body h3{margin:0;font-size:15px;letter-spacing:.02em;font-weight:600}
.store-card__body>p{min-height:42px;margin:11px 0 17px;color:rgba(255,255,255,.34);font-size:9.5px;line-height:1.55}
.store-card__footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;border-top:1px solid rgba(255,255,255,.055)}
.store-card__footer strong{font-size:18px;letter-spacing:-.03em;font-weight:600}
.store-card__footer button{height:31px;padding:0 10px;border:1px solid rgba(255,255,255,.08);border-radius:6px;background:rgba(255,255,255,.02);color:rgba(255,255,255,.58);font-size:7px;letter-spacing:.13em;cursor:pointer;transition:.18s ease}.store-card__footer button span{color:var(--accent);margin-left:4px}.store-card__footer button:hover{color:#fff;border-color:rgba(var(--accent-rgb),.25);background:rgba(var(--accent-rgb),.055)}
.store-drawer{position:fixed;left:50%;bottom:22px;z-index:150;width:min(560px,calc(100% - 32px));transform:translate(-50%,18px);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 15px 14px 18px;border:1px solid rgba(var(--accent-rgb),.22);border-radius:10px;background:rgba(9,9,9,.88);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:0 18px 50px rgba(0,0,0,.34);opacity:0;visibility:hidden;pointer-events:none;transition:.22s ease}
.store-drawer.open{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.store-drawer>div{min-width:0;display:grid;grid-template-columns:auto 1fr;column-gap:10px;row-gap:2px;align-items:baseline}.store-drawer small{grid-column:1;font-size:6px;letter-spacing:.18em;color:var(--accent)}.store-drawer strong{grid-column:2;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.store-drawer span{grid-column:1 / -1;margin-top:4px;color:rgba(255,255,255,.34);font-size:8px}.store-drawer button{height:31px;padding:0 10px;border:1px solid rgba(255,255,255,.09);border-radius:6px;background:transparent;color:rgba(255,255,255,.5);font-size:7px;letter-spacing:.12em;cursor:pointer}
body.store-open{overflow-y:auto}
body.store-open .nav a[href="#store"]{color:#fff}
body.store-open .nav a[href="#store"]:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent);box-shadow:0 0 14px rgba(var(--accent-rgb),.7)}
@media(max-width:1050px){.store-hero{grid-template-columns:1fr;gap:34px;padding-top:42px}.store-hero__meta{justify-self:start}.store-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body.store-open .nav a[href="#store"]:after{display:none}}
@media(max-width:700px){.store-view{padding:32px 0 52px}.store-hero{padding:34px 0 30px}.store-hero h2{font-size:52px}.store-hero__copy>p{font-size:11px}.store-toolbar{align-items:flex-start;flex-direction:column;padding:18px 0}.store-categories{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.store-category{width:100%;padding:0 8px}.store-grid{grid-template-columns:1fr}.store-card__visual{height:126px}.store-drawer{bottom:12px}}


/* Step 19 — store title, product imagery and detail modal */
.store-title{display:flex;align-items:center;gap:24px;max-width:none!important}
.store-title img{width:clamp(50px,5vw,84px);height:clamp(50px,5vw,84px);object-fit:contain;filter:var(--accent-icon-filter);opacity:.93;flex:0 0 auto}
.store-title span{display:block}
.store-card__visual--image{height:178px;padding:0;background:#0a0a0a}
.store-card__visual--image:before,.store-card__visual--image:after{z-index:2;pointer-events:none}
.store-card__visual--image>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.68) contrast(1.05) brightness(.72);transition:transform .38s ease,filter .38s ease}
.store-card:hover .store-card__visual--image>img{transform:scale(1.035);filter:saturate(.78) contrast(1.05) brightness(.78)}
.store-card__visual--image:after{content:"";position:absolute!important;inset:0!important;width:auto!important;aspect-ratio:auto!important;border:0!important;border-radius:0!important;background:linear-gradient(180deg,rgba(5,5,5,.03) 22%,rgba(5,5,5,.84) 100%)}
.store-card__visual-label{position:absolute;z-index:3;left:16px;right:16px;bottom:14px;display:flex;align-items:flex-end;justify-content:space-between;gap:14px}
.store-card__visual-label b{font-size:28px;line-height:.9;letter-spacing:-.04em;text-shadow:0 2px 16px rgba(0,0,0,.65)}
.store-card__visual-label span{writing-mode:horizontal-tb;font-size:7px;letter-spacing:.28em;color:rgba(255,150,55,.86)}

.product-modal{position:fixed;inset:0;z-index:260;display:grid;place-items:center;padding:24px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,visibility .2s ease}
.product-modal.open{opacity:1;visibility:visible;pointer-events:auto}
.product-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.58);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.product-modal__dialog{position:relative;z-index:1;width:min(820px,100%);display:grid;grid-template-columns:minmax(0,1.04fr) minmax(300px,.96fr);overflow:hidden;border:1px solid rgba(255,255,255,.10);border-radius:15px;background:linear-gradient(145deg,rgba(14,14,14,.94),rgba(7,7,7,.91));box-shadow:0 28px 80px rgba(0,0,0,.48);transform:translateY(10px) scale(.985);transition:transform .22s ease}
.product-modal.open .product-modal__dialog{transform:none}
.product-modal__close{position:absolute;right:12px;top:12px;z-index:5;width:34px;height:34px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:rgba(5,5,5,.48);color:#fff;font-size:20px;line-height:1;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.product-modal__close:hover{border-color:rgba(var(--accent-rgb),.36);background:rgba(var(--accent-rgb),.08)}
.product-modal__media{position:relative;min-height:380px;background:#080808;overflow:hidden}
.product-modal__media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,rgba(7,7,7,.5)),linear-gradient(0deg,rgba(6,6,6,.32),transparent 55%);pointer-events:none}
.product-modal__media img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;filter:saturate(.74) contrast(1.04) brightness(.82)}
.product-modal__content{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:42px 38px 34px}
.product-modal__eyebrow{font-size:7px;letter-spacing:.28em;color:var(--accent);text-transform:uppercase}
.product-modal__content h3{margin:12px 0 13px;font-size:34px;line-height:1.02;letter-spacing:-.045em}
.product-modal__content>p{margin:0;color:rgba(255,255,255,.48);font-size:11px;line-height:1.75}
.product-modal__line{height:1px;margin:28px 0 19px;background:linear-gradient(90deg,rgba(var(--accent-rgb),.35),rgba(255,255,255,.06),transparent)}
.product-modal__footer{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.product-modal__footer>div{display:flex;flex-direction:column;gap:4px}.product-modal__footer small{font-size:6px;letter-spacing:.2em;color:rgba(255,255,255,.28)}.product-modal__footer strong{font-size:25px;font-weight:650}.product-modal__footer>span{max-width:140px;text-align:right;font-size:7px;line-height:1.5;color:rgba(255,255,255,.25)}
body.product-modal-open{overflow:hidden}

@media(max-width:700px){
  .store-title{gap:14px}.store-title img{width:48px;height:48px}
  .store-card__visual--image{height:160px}
  .product-modal{padding:14px}.product-modal__dialog{grid-template-columns:1fr;max-height:calc(100vh - 28px);overflow:auto}.product-modal__media{min-height:230px}.product-modal__content{padding:26px 22px 24px}.product-modal__content h3{font-size:28px}.product-modal__footer{align-items:flex-start;flex-direction:column}.product-modal__footer>span{text-align:left;max-width:none}
}

/* Step 20 — refined store categories, cards and product detail */
.store-view{padding-top:42px}
.store-hero{padding:42px 0 34px;gap:48px}
.store-hero__copy>p{max-width:560px;margin-top:22px}

.store-toolbar{align-items:stretch;padding:22px 0 18px;border-bottom:1px solid rgba(255,255,255,.055);margin-bottom:16px}
.store-categories{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;flex:1;min-width:0}
.store-category{
  position:relative;height:62px;padding:0 13px;display:flex;align-items:center;gap:11px;text-align:left;
  border:1px solid rgba(255,255,255,.065);border-radius:10px;background:linear-gradient(145deg,rgba(255,255,255,.018),rgba(255,255,255,.006));
  color:rgba(255,255,255,.46);overflow:hidden
}
.store-category:before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:2px;border-radius:2px;background:var(--accent);opacity:0;transform:scaleY(.4);transition:.2s ease}
.store-category:hover{transform:translateY(-1px);background:rgba(255,255,255,.03);border-color:rgba(255,255,255,.13)}
.store-category.active{background:linear-gradient(145deg,rgba(var(--accent-rgb),.075),rgba(255,255,255,.012));border-color:rgba(var(--accent-rgb),.25);box-shadow:none}
.store-category.active:before{opacity:1;transform:scaleY(1)}
.store-category__index{font-size:8px!important;letter-spacing:.14em;color:rgba(255,255,255,.24)!important;flex:0 0 auto}
.store-category.active .store-category__index{color:var(--accent)!important}
.store-category__copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.store-category__copy b{font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.72);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.store-category.active .store-category__copy b{color:#fff}
.store-category__copy small{font-size:6px;letter-spacing:.12em;color:rgba(255,255,255,.24)}
.store-count{width:95px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-content:center;justify-content:end;gap:2px 6px;padding-left:18px;border-left:1px solid rgba(255,255,255,.06);text-align:right}
.store-count small{grid-column:1/-1;font-size:5.5px;letter-spacing:.18em;color:rgba(255,255,255,.23)}
.store-count span{margin:0;font-size:13px;line-height:1;color:var(--accent)}
.store-count b{font-size:7px;letter-spacing:.13em;color:rgba(255,255,255,.38);font-weight:500;align-self:end}

.store-grid{gap:14px}
.store-card{border-radius:13px;background:linear-gradient(150deg,rgba(13,13,13,.34),rgba(8,8,8,.13));border-color:rgba(255,255,255,.065)}
.store-card:hover{transform:translateY(-4px);border-color:rgba(var(--accent-rgb),.24);background:linear-gradient(150deg,rgba(16,16,16,.42),rgba(8,8,8,.16))}
.store-card--featured:before{right:13px;top:13px;padding:6px 8px;border-radius:5px;background:rgba(8,8,8,.66);border-color:rgba(var(--accent-rgb),.32);backdrop-filter:blur(10px)}
.store-card__visual--image{height:196px}
.store-card__visual--image>img{filter:saturate(.72) contrast(1.03) brightness(.78)}
.store-card:hover .store-card__visual--image>img{transform:scale(1.045);filter:saturate(.84) contrast(1.04) brightness(.84)}
.store-card__visual--image:after{background:linear-gradient(180deg,rgba(4,4,4,.01) 25%,rgba(5,5,5,.18) 56%,rgba(5,5,5,.92) 100%)!important}
.store-card__overlay{position:absolute;z-index:3;left:15px;right:15px;bottom:14px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.store-card__overlay>span{writing-mode:horizontal-tb!important;font-size:6px;letter-spacing:.18em;color:rgba(255,255,255,.45)}
.store-card__overlay>b{font-size:25px!important;line-height:.9!important;letter-spacing:-.045em!important;text-shadow:0 4px 18px rgba(0,0,0,.55)}
.store-card__body{padding:16px 16px 15px}
.store-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.store-card__head>div{min-width:0}
.store-card__head small{display:block;margin-bottom:5px;color:rgba(255,255,255,.26);font-size:5.8px;letter-spacing:.18em}
.store-card__head h3{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.store-card__tag{flex:0 0 auto;padding:5px 6px;border:1px solid rgba(255,255,255,.07);border-radius:5px;background:rgba(255,255,255,.018);font-size:5.5px;letter-spacing:.12em;color:rgba(255,255,255,.34)}
.store-card__tag--accent{color:var(--accent2);border-color:rgba(var(--accent-rgb),.24);background:rgba(var(--accent-rgb),.055)}
.store-card__body>p{min-height:35px;margin:10px 0 12px;font-size:9px;line-height:1.55}
.store-card__micro{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-bottom:14px}
.store-card__micro span{padding:4px 6px;border-radius:4px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.045);font-size:5.5px;letter-spacing:.1em;color:rgba(255,255,255,.26)}
.store-card__footer{padding-top:12px}
.store-card__footer>div{display:flex;flex-direction:column;gap:2px}
.store-card__footer>div small{font-size:5px;letter-spacing:.16em;color:rgba(255,255,255,.22)}
.store-card__footer strong{font-size:19px}
.store-card__footer button{height:34px;padding:0 12px;border-radius:7px;color:rgba(255,255,255,.62)}

.product-modal{padding:22px}
.product-modal__backdrop{background:rgba(0,0,0,.50);backdrop-filter:blur(11px)}
.product-modal__dialog{width:min(960px,100%);grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr);border-radius:16px;background:linear-gradient(145deg,rgba(14,14,14,.91),rgba(7,7,7,.88));border-color:rgba(255,255,255,.095)}
.product-modal__gallery{min-width:0;padding:12px;border-right:1px solid rgba(255,255,255,.055);background:rgba(0,0,0,.12)}
.product-modal__media{min-height:410px;border-radius:11px;overflow:hidden}
.product-modal__media:after{background:linear-gradient(0deg,rgba(5,5,5,.28),transparent 48%)}
.product-modal__media img{filter:saturate(.80) contrast(1.04) brightness(.87);transition:opacity .18s ease,transform .25s ease}
.product-modal__thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:8px}
.product-modal__thumb{position:relative;height:67px;padding:0;overflow:hidden;border:1px solid rgba(255,255,255,.065);border-radius:7px;background:#090909;cursor:pointer;transition:.18s ease}
.product-modal__thumb img{width:100%;height:100%;object-fit:cover;filter:saturate(.62) brightness(.62);transition:.18s ease}
.product-modal__thumb:hover,.product-modal__thumb.active{border-color:rgba(var(--accent-rgb),.38)}
.product-modal__thumb.active:after{content:"";position:absolute;left:8px;right:8px;bottom:4px;height:1px;background:var(--accent)}
.product-modal__thumb.active img{filter:saturate(.8) brightness(.82)}
.product-modal__content{justify-content:flex-start;padding:34px 34px 26px}
.product-modal__topline{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-right:34px}
.product-modal__badge{padding:5px 7px;border:1px solid rgba(var(--accent-rgb),.24);border-radius:5px;background:rgba(var(--accent-rgb),.05);font-size:5.5px;letter-spacing:.15em;color:var(--accent2)}
.product-modal__content h3{margin:15px 0 11px;font-size:36px}
.product-modal__content>p{font-size:10.5px;line-height:1.72}
.product-modal__section{margin-top:23px;padding-top:17px;border-top:1px solid rgba(255,255,255,.055)}
.product-modal__section>small{display:block;margin-bottom:10px;font-size:5.8px;letter-spacing:.2em;color:rgba(255,255,255,.25)}
.product-modal__features{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.product-modal__features li{position:relative;padding:8px 10px 8px 24px;border:1px solid rgba(255,255,255,.045);border-radius:7px;background:rgba(255,255,255,.014);font-size:8px;letter-spacing:.02em;color:rgba(255,255,255,.55)}
.product-modal__features li:before{content:"";position:absolute;left:10px;top:50%;width:5px;height:5px;border-radius:50%;background:var(--accent);transform:translateY(-50%);box-shadow:0 0 8px rgba(var(--accent-rgb),.32)}
.product-modal__delivery{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.product-modal__delivery>div{padding:10px;border:1px solid rgba(255,255,255,.045);border-radius:7px;background:rgba(255,255,255,.012)}
.product-modal__delivery small{display:block;margin-bottom:4px;font-size:5px;letter-spacing:.15em;color:rgba(255,255,255,.22)}
.product-modal__delivery strong{font-size:7.5px;color:rgba(255,255,255,.5);font-weight:500}
.product-modal__purchase{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:auto;padding-top:22px}
.product-modal__price{display:flex;flex-direction:column;gap:2px}
.product-modal__price small{font-size:5.5px;letter-spacing:.18em;color:rgba(255,255,255,.24)}
.product-modal__price strong{font-size:27px;letter-spacing:-.04em}
.product-modal__buy{height:42px;min-width:132px;padding:0 15px;border:1px solid rgba(var(--accent-rgb),.32);border-radius:8px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.16),rgba(var(--accent-rgb),.07));color:#fff;font-size:7px;letter-spacing:.16em;font-weight:650;cursor:pointer;transition:.18s ease}
.product-modal__buy span{margin-left:6px;color:#ff9a36}
.product-modal__buy:hover{transform:translateY(-1px);border-color:rgba(var(--accent-rgb),.55);background:linear-gradient(135deg,rgba(var(--accent-rgb),.23),rgba(var(--accent-rgb),.10))}
.product-modal__note{margin-top:9px!important;font-size:6.5px!important;line-height:1.45!important;color:rgba(255,255,255,.20)!important}
.store-toast{position:fixed;left:50%;bottom:24px;z-index:300;transform:translate(-50%,12px);padding:10px 13px;border:1px solid rgba(var(--accent-rgb),.22);border-radius:8px;background:rgba(9,9,9,.9);backdrop-filter:blur(16px);font-size:7px;letter-spacing:.08em;color:rgba(255,255,255,.65);opacity:0;visibility:hidden;pointer-events:none;transition:.2s ease}
.store-toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}

@media(max-width:1050px){
  .store-categories{grid-template-columns:repeat(2,minmax(0,1fr))}
  .store-count{align-self:stretch}
  .product-modal__dialog{grid-template-columns:1fr 360px}
  .product-modal__media{min-height:360px}
}
@media(max-width:760px){
  .store-toolbar{flex-direction:column;gap:10px}
  .store-count{width:auto;display:flex;align-items:baseline;justify-content:flex-start;gap:6px;padding:8px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.045)}
  .store-count small{margin-right:auto}
  .store-category{height:56px}
  .store-card__visual--image{height:190px}
  .product-modal{padding:10px;align-items:start;padding-top:calc(var(--topbar-height) + 10px)}
  .product-modal__dialog{grid-template-columns:1fr;max-height:calc(100vh - var(--topbar-height) - 20px);overflow:auto}
  .product-modal__gallery{border-right:0;border-bottom:1px solid rgba(255,255,255,.055)}
  .product-modal__media{min-height:245px}
  .product-modal__thumb{height:54px}
  .product-modal__content{padding:24px 20px 20px}
  .product-modal__content h3{font-size:29px}
  .product-modal__purchase{margin-top:22px}
}
@media(max-width:500px){
  .store-categories{grid-template-columns:1fr 1fr;gap:6px}
  .store-category{padding:0 9px;gap:8px}
  .store-category__copy b{font-size:7.5px}
  .store-card__visual--image{height:170px}
  .product-modal__delivery{grid-template-columns:1fr}
  .product-modal__purchase{align-items:stretch;flex-direction:column}
  .product-modal__buy{width:100%}
}

/* STEP 21 — Store category rail + premium listing cards */
.store-toolbar{
  position:relative;
  display:grid;
  grid-template-columns:190px minmax(0,1fr) 76px;
  align-items:stretch;
  gap:12px;
  margin:24px 0 20px;
  padding:10px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(255,255,255,.024),rgba(255,255,255,.009));
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  overflow:visible;
}
.store-filter-head{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding:2px 14px;
  border-right:1px solid rgba(255,255,255,.055);
}
.store-filter-head>div{display:flex;flex-direction:column;gap:3px}
.store-filter-head small{font-size:5.5px;letter-spacing:.23em;color:rgba(255,255,255,.24)}
.store-filter-head strong{font-size:10px;letter-spacing:.14em;font-weight:650;color:rgba(255,255,255,.86)}
.store-filter-head>span{margin-top:7px;font-size:6.5px;line-height:1.45;color:rgba(255,255,255,.24)}
.store-categories{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px;
  min-width:0;
}
.store-category{
  position:relative;
  height:58px;
  min-width:0;
  display:grid;
  grid-template-columns:28px minmax(0,1fr) 12px;
  align-items:center;
  gap:8px;
  padding:0 11px;
  border:1px solid transparent;
  border-radius:9px;
  background:transparent;
  color:rgba(255,255,255,.46);
  cursor:pointer;
  overflow:hidden;
  text-align:left;
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease;
}
.store-category:before{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.9),transparent);
  opacity:0;
  transform:scaleX(.3);
  transition:.22s ease;
}
.store-category:hover{
  transform:none;
  color:#fff;
  border-color:rgba(255,255,255,.065);
  background:rgba(255,255,255,.022);
}
.store-category.active{
  color:#fff;
  border-color:rgba(var(--accent-rgb),.16);
  background:linear-gradient(135deg,rgba(var(--accent-rgb),.075),rgba(255,255,255,.012));
  box-shadow:inset 0 0 24px rgba(var(--accent-rgb),.025);
}
.store-category.active:before{opacity:1;transform:scaleX(1)}
.store-category__index{
  display:grid;
  place-items:center;
  width:27px;
  height:27px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:7px;
  background:rgba(255,255,255,.018);
  font-size:6px!important;
  letter-spacing:.08em!important;
  color:rgba(255,255,255,.25)!important;
}
.store-category.active .store-category__index{
  border-color:rgba(var(--accent-rgb),.22);
  color:var(--accent2)!important;
  background:rgba(var(--accent-rgb),.055);
}
.store-category__copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.store-category__copy b{font-size:8px;letter-spacing:.06em;font-weight:600;color:rgba(255,255,255,.68);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.store-category.active .store-category__copy b{color:#fff}
.store-category__copy small{font-size:5.5px;letter-spacing:.09em;color:rgba(255,255,255,.22)}
.store-category>i{
  position:relative;
  width:10px;
  height:10px;
  opacity:.26;
}
.store-category>i:before,.store-category>i:after{content:"";position:absolute;background:currentColor;border-radius:2px}
.store-category>i:before{width:8px;height:1px;left:1px;top:4px}
.store-category>i:after{width:1px;height:8px;left:4px;top:1px}
.store-category.active>i{color:var(--accent);opacity:.9;transform:rotate(45deg)}
.store-count{
  min-width:0;
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto auto;
  align-content:center;
  padding:0 10px;
  border-left:1px solid rgba(255,255,255,.055);
  text-align:right;
}
.store-count small{grid-column:1/-1;font-size:5px;letter-spacing:.16em;color:rgba(255,255,255,.22)}
.store-count span{align-self:end;font-size:22px;line-height:1;color:#fff;letter-spacing:-.04em}
.store-count b{align-self:end;margin:0 0 2px 4px;font-size:5px;letter-spacing:.12em;color:rgba(255,255,255,.3)}

.store-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.store-card{
  position:relative;
  min-width:0;
  min-height:224px;
  display:grid;
  grid-template-columns:minmax(210px,42%) minmax(0,1fr);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.065);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(12,12,12,.30),rgba(5,5,5,.10));
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  transition:transform .24s ease,border-color .24s ease,background .24s ease;
}
.store-card:after{
  content:"";
  position:absolute;
  left:42%;
  top:18px;
  bottom:18px;
  width:1px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.065),transparent);
  pointer-events:none;
}
.store-card:hover{
  transform:translateY(-2px);
  border-color:rgba(var(--accent-rgb),.20);
  background:linear-gradient(135deg,rgba(15,15,15,.37),rgba(6,6,6,.13));
}
.store-card--featured:before{
  content:"POPÜLER";
  right:auto;
  left:12px;
  top:12px;
  z-index:6;
  padding:5px 8px;
  border:1px solid rgba(var(--accent-rgb),.26);
  border-radius:6px;
  background:rgba(5,5,5,.56);
  color:var(--accent2);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  font-size:5.5px;
  letter-spacing:.16em;
}
.store-card__visual--image{
  height:100%;
  min-height:224px;
  padding:0;
  border-radius:0;
  background:#090909;
}
.store-card__visual--image>img{
  filter:saturate(.74) contrast(1.03) brightness(.70);
  transition:transform .4s ease,filter .4s ease;
}
.store-card:hover .store-card__visual--image>img{
  transform:scale(1.04);
  filter:saturate(.84) contrast(1.04) brightness(.78);
}
.store-card__visual--image:after{
  background:linear-gradient(90deg,rgba(4,4,4,.02) 45%,rgba(4,4,4,.20) 100%),linear-gradient(0deg,rgba(4,4,4,.82),transparent 58%)!important;
}
.store-card__overlay{
  left:15px;
  right:15px;
  bottom:14px;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}
.store-card__overlay>span{font-size:5.5px;letter-spacing:.19em;color:rgba(255,255,255,.5)}
.store-card__overlay>b{font-size:25px!important;letter-spacing:-.045em!important;text-shadow:0 5px 20px rgba(0,0,0,.65)}
.store-card__body{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:19px 18px 17px;
  border-top:0;
}
.store-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.store-card__head small{margin-bottom:6px!important;font-size:5.5px!important;letter-spacing:.18em!important;color:rgba(var(--accent-rgb),.58)!important}
.store-card__head h3{font-size:17px!important;line-height:1.1;letter-spacing:-.015em!important}
.store-card__tag{padding:5px 7px;border-radius:5px;background:transparent;border-color:rgba(255,255,255,.07);font-size:5px;color:rgba(255,255,255,.32)}
.store-card__body>p{
  min-height:0;
  margin:11px 0 13px;
  max-width:95%;
  font-size:8.7px;
  line-height:1.65;
  color:rgba(255,255,255,.34);
}
.store-card__micro{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 15px;
  padding:10px 0;
  border-top:1px solid rgba(255,255,255,.045);
  border-bottom:1px solid rgba(255,255,255,.045);
}
.store-card__micro span{
  position:relative;
  padding:0 0 0 8px;
  border:0;
  border-radius:0;
  background:transparent;
  font-size:5px;
  letter-spacing:.12em;
  color:rgba(255,255,255,.27);
}
.store-card__micro span:before{content:"";position:absolute;left:0;top:50%;width:3px;height:3px;border-radius:50%;background:rgba(var(--accent-rgb),.65);transform:translateY(-50%)}
.store-card__footer{
  margin-top:auto;
  padding-top:0;
  border-top:0;
}
.store-card__footer>div small{font-size:5px;letter-spacing:.15em;color:rgba(255,255,255,.22)}
.store-card__footer strong{font-size:21px;letter-spacing:-.04em}
.store-card__footer button{
  height:34px;
  min-width:92px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:7px;
  background:rgba(255,255,255,.018);
  color:rgba(255,255,255,.62);
  font-size:6.3px;
  letter-spacing:.13em;
}
.store-card__footer button:hover{
  border-color:rgba(var(--accent-rgb),.28);
  background:rgba(var(--accent-rgb),.055);
  color:#fff;
}

@media(max-width:1180px){
  .store-toolbar{grid-template-columns:150px minmax(0,1fr) 70px}
  .store-category{grid-template-columns:24px minmax(0,1fr);padding:0 9px}
  .store-category>i{display:none}
  .store-card{grid-template-columns:minmax(180px,39%) minmax(0,1fr)}
  .store-card:after{left:39%}
}
@media(max-width:930px){
  .store-toolbar{grid-template-columns:1fr auto;gap:8px}
  .store-filter-head{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between;border-right:0;border-bottom:1px solid rgba(255,255,255,.05);padding:6px 8px 11px}
  .store-filter-head>span{margin:0}
  .store-categories{grid-column:1;grid-template-columns:repeat(4,minmax(120px,1fr));overflow-x:auto;padding-bottom:2px}
  .store-count{grid-column:2;border-left:0;padding-left:4px}
  .store-grid{grid-template-columns:1fr}
  .store-card{grid-template-columns:minmax(200px,38%) minmax(0,1fr)}
  .store-card:after{left:38%}
}
@media(max-width:620px){
  .store-toolbar{display:block;padding:8px;margin:18px 0 16px}
  .store-filter-head{display:none}
  .store-categories{display:grid;grid-template-columns:1fr 1fr;gap:6px;overflow:visible}
  .store-category{height:50px;grid-template-columns:25px minmax(0,1fr);padding:0 8px}
  .store-count{display:none}
  .store-card{display:block;min-height:0}
  .store-card:after{display:none}
  .store-card__visual--image{height:180px;min-height:180px}
  .store-card__body{padding:16px}
  .store-card__overlay{flex-direction:row;align-items:flex-end}
  .store-card__body>p{max-width:none}
}

/* STEP 23 — 3-column market cards + redesigned category dock */
.store-toolbar{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:16px;
  margin:26px 0 18px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  overflow:visible;
}
.store-filter-head{
  min-width:148px;
  padding:0 16px 0 0;
  border-right:1px solid rgba(255,255,255,.07);
}
.store-filter-head>div{gap:4px}
.store-filter-head small{font-size:5.5px;letter-spacing:.24em;color:rgba(255,255,255,.22)}
.store-filter-head strong{font-size:10px;letter-spacing:.16em;color:rgba(255,255,255,.88)}
.store-filter-head>span{display:none}
.store-categories{
  position:relative;
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  padding:5px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px;
  background:rgba(255,255,255,.012);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
}
.store-category{
  position:relative;
  flex:1 1 0;
  height:46px;
  min-width:0;
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  align-items:center;
  gap:8px;
  padding:0 12px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:rgba(255,255,255,.43);
  overflow:hidden;
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.store-category:before{
  left:12px;
  right:12px;
  bottom:3px;
  height:1px;
  background:var(--accent);
  opacity:0;
  transform:scaleX(.35);
  box-shadow:0 0 10px rgba(var(--accent-rgb),.28);
}
.store-category:hover{
  transform:none;
  color:#fff;
  border-color:rgba(255,255,255,.055);
  background:rgba(255,255,255,.022);
}
.store-category.active{
  color:#fff;
  border-color:rgba(var(--accent-rgb),.14);
  background:linear-gradient(110deg,rgba(var(--accent-rgb),.07),rgba(255,255,255,.018));
  box-shadow:none;
}
.store-category.active:before{opacity:.9;transform:scaleX(1)}
.store-category__index{
  width:22px;
  height:22px;
  border:0;
  border-radius:6px;
  background:rgba(255,255,255,.035);
  font-size:5.5px!important;
  color:rgba(255,255,255,.28)!important;
}
.store-category.active .store-category__index{
  border:0;
  background:rgba(var(--accent-rgb),.09);
  color:var(--accent2)!important;
}
.store-category__copy{gap:2px}
.store-category__copy b{
  font-size:7.4px;
  letter-spacing:.055em;
  color:rgba(255,255,255,.64);
}
.store-category__copy small{
  font-size:5px;
  letter-spacing:.08em;
  color:rgba(255,255,255,.20);
}
.store-category>i{display:none}
.store-count{
  min-width:74px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:5px;
  padding:0 0 0 14px;
  border-left:1px solid rgba(255,255,255,.07);
  text-align:right;
}
.store-count small{display:none}
.store-count span{font-size:18px;line-height:1;color:#fff}
.store-count b{margin:1px 0 0;font-size:5px;letter-spacing:.14em;color:rgba(255,255,255,.28)}

.store-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
}
.store-card{
  position:relative;
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.065);
  border-radius:12px;
  background:linear-gradient(150deg,rgba(13,13,13,.34),rgba(5,5,5,.12));
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  transition:transform .22s ease,border-color .22s ease,background .22s ease;
}
.store-card:after{display:none}
.store-card:hover{
  transform:translateY(-2px);
  border-color:rgba(var(--accent-rgb),.20);
  background:linear-gradient(150deg,rgba(16,16,16,.40),rgba(6,6,6,.15));
}
.store-card--featured:before{
  left:10px;
  top:10px;
  padding:4px 7px;
  border-radius:5px;
  font-size:5px;
}
.store-card__visual--image{
  position:relative;
  width:100%;
  height:auto;
  min-height:0;
  aspect-ratio:16 / 8.3;
  border-radius:0;
  flex:0 0 auto;
}
.store-card__visual--image>img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.72) contrast(1.04) brightness(.72);
}
.store-card__visual--image:after{
  background:linear-gradient(0deg,rgba(5,5,5,.78),transparent 52%)!important;
}
.store-card__overlay{
  left:12px;
  right:12px;
  bottom:10px;
  flex-direction:row;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
}
.store-card__overlay>span{font-size:5px;letter-spacing:.16em;color:rgba(255,255,255,.46)}
.store-card__overlay>b{
  max-width:72%;
  font-size:19px!important;
  line-height:.95;
  letter-spacing:-.035em!important;
  text-align:right;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.store-card__body{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  flex:1 1 auto;
  padding:14px 14px 13px;
  border-top:1px solid rgba(255,255,255,.045);
}
.store-card__head{gap:8px}
.store-card__head small{margin-bottom:4px!important;font-size:5px!important;letter-spacing:.14em!important}
.store-card__head h3{
  font-size:14px!important;
  line-height:1.15;
  letter-spacing:-.01em!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.store-card__tag{
  flex:0 0 auto;
  padding:4px 6px;
  border-radius:5px;
  font-size:4.7px;
}
.store-card__body>p{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  min-height:26px;
  max-width:none;
  margin:9px 0 10px;
  font-size:7.8px;
  line-height:1.55;
}
.store-card__micro{
  gap:7px;
  margin:0 0 11px;
  padding:8px 0;
  overflow:hidden;
}
.store-card__micro span{
  flex:0 1 auto;
  min-width:0;
  padding-left:7px;
  font-size:4.6px;
  letter-spacing:.09em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.store-card__footer{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
  margin-top:auto;
}
.store-card__footer>div small{font-size:4.7px}
.store-card__footer strong{font-size:17px}
.store-card__footer button{
  height:30px;
  min-width:78px;
  padding:0 9px;
  border-radius:6px;
  font-size:5.7px;
}

@media(max-width:1180px){
  .store-toolbar{grid-template-columns:130px minmax(0,1fr) 66px;gap:10px}
  .store-filter-head{min-width:0;padding-right:10px}
  .store-category{padding:0 9px;grid-template-columns:20px minmax(0,1fr);gap:6px}
  .store-category__index{width:20px;height:20px}
  .store-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .store-card__overlay>b{font-size:17px!important}
}
@media(max-width:980px){
  .store-toolbar{grid-template-columns:1fr auto;gap:8px}
  .store-filter-head{display:none}
  .store-categories{grid-column:1;overflow-x:auto;scrollbar-width:none}
  .store-categories::-webkit-scrollbar{display:none}
  .store-category{flex:0 0 132px}
  .store-count{grid-column:2;border-left:0;padding-left:4px}
  .store-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .store-toolbar{display:block;margin:18px 0 14px}
  .store-categories{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:5px;overflow:visible}
  .store-category{width:100%;height:44px;min-width:0;flex:none;padding:0 8px}
  .store-count{display:none}
  .store-grid{grid-template-columns:1fr;gap:10px}
  .store-card__visual--image{aspect-ratio:16 / 8.6}
  .store-card__body{padding:13px}
  .store-card__body>p{font-size:8px}
}

/* Step 25 — announcement center + staff hierarchy */
#announcements{scroll-margin-top:calc(var(--topbar-height) + 18px)}
body.store-open .announcements-section{display:none}

.announcements-section{
  position:relative;
  margin:10px 2vw 36px;
  padding:18px 0 0;
  border-top:1px solid rgba(255,255,255,.07);
}
.announcements-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:12px;
}
.announcements-titleline{display:flex;align-items:center;gap:12px;min-width:0}
.announcement-broadcast{
  position:relative;
  width:35px;height:35px;flex:0 0 35px;
  border:1px solid rgba(var(--accent-rgb),.24);
  border-radius:9px;
  background:rgba(var(--accent-rgb),.055);
}
.announcement-broadcast i{
  position:absolute;left:9px;top:13px;width:8px;height:8px;
  border:1px solid rgba(255,255,255,.62);border-radius:2px;
}
.announcement-broadcast i:after{
  content:"";position:absolute;right:-7px;top:-4px;width:7px;height:14px;
  border-right:1px solid var(--accent);border-radius:0 12px 12px 0;
}
.announcement-broadcast b{
  position:absolute;left:6px;bottom:6px;width:10px;height:1px;background:rgba(255,255,255,.34);transform:rotate(52deg);transform-origin:left center
}
.announcements-kicker{display:block;margin-bottom:5px;color:rgba(255,255,255,.31);font-size:6px;letter-spacing:.24em}
.announcements-head h2{margin:0;font-size:clamp(22px,2.1vw,32px);line-height:.96;letter-spacing:-.035em;text-transform:uppercase;font-weight:580}
.announcements-head h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.50)}
.announcements-state{display:flex;align-items:center;gap:6px;color:rgba(255,255,255,.32);font-size:5.5px;letter-spacing:.17em;white-space:nowrap;padding-bottom:3px}
.announcements-state b{color:rgba(255,255,255,.78);font-size:8px}
.pulse-dot{width:5px;height:5px;border-radius:50%;background:#35d977;box-shadow:0 0 12px rgba(53,217,119,.55)}

.announcement-board{
  display:grid;
  grid-template-columns:minmax(0,1.52fr) minmax(310px,.9fr);
  min-height:146px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:12px;
  overflow:hidden;
  background:rgba(7,7,7,.13);
  -webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);
}
.announcement-featured{
  position:relative;min-width:0;padding:14px 17px 12px;
  border-right:1px solid rgba(255,255,255,.06);
  background:linear-gradient(120deg,rgba(var(--accent-rgb),.04),rgba(255,255,255,.012) 48%,transparent);
}
.announcement-featured:before{content:"";position:absolute;left:0;top:17px;bottom:17px;width:2px;background:var(--accent);box-shadow:0 0 16px rgba(var(--accent-rgb),.3)}
.announcement-featured__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px;padding-left:4px}
.announcement-priority{padding:5px 7px;border:1px solid rgba(var(--accent-rgb),.20);border-radius:5px;background:rgba(var(--accent-rgb),.055);color:var(--accent);font-size:5px;letter-spacing:.18em}
.announcement-featured__top time{color:rgba(255,255,255,.28);font-size:5.5px;letter-spacing:.16em}
.announcement-featured__body{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:start}
.announcement-number{font-size:34px;line-height:.9;font-weight:250;letter-spacing:-.06em;color:rgba(255,255,255,.10);font-variant-numeric:tabular-nums}
.announcement-featured__copy>span{display:block;margin-bottom:5px;color:rgba(255,255,255,.32);font-size:5px;letter-spacing:.18em}
.announcement-featured__copy h3{margin:0;font-size:14px;line-height:1.15;font-weight:620;letter-spacing:-.015em}
.announcement-featured__copy p{max-width:760px;margin:7px 0 0;color:rgba(255,255,255,.34);font-size:7px;line-height:1.55}
.announcement-featured__footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:13px;padding-top:9px;border-top:1px solid rgba(255,255,255,.045);color:rgba(255,255,255,.22);font-size:5px;letter-spacing:.14em}
.announcement-featured__footer span{display:flex;align-items:center;gap:6px}.announcement-featured__footer span i{width:4px;height:4px;border-radius:50%;background:#35d977}
.announcement-featured__footer strong{color:rgba(255,255,255,.35);font-size:5px;font-weight:500}

.announcement-feed{display:grid;grid-template-rows:1fr 1fr;min-width:0}
.announcement-feed-item{position:relative;display:grid;grid-template-columns:38px minmax(0,1fr) 20px;gap:10px;align-items:center;min-width:0;padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.055);background:linear-gradient(110deg,rgba(255,255,255,.012),transparent);transition:background .2s ease}
.announcement-feed-item:last-child{border-bottom:0}.announcement-feed-item:hover{background:linear-gradient(110deg,rgba(255,255,255,.027),rgba(var(--accent-rgb),.014))}
.announcement-feed-date{width:38px;height:45px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.055);border-radius:7px;background:rgba(255,255,255,.015)}
.announcement-feed-date b{font-size:12px;line-height:1;font-weight:580}.announcement-feed-date span{margin-top:4px;color:rgba(255,255,255,.28);font-size:4.5px;letter-spacing:.14em}
.announcement-feed-copy{min-width:0}.announcement-feed-copy>div{display:flex;justify-content:space-between;gap:8px;margin-bottom:4px}.announcement-feed-copy>div span{color:var(--accent);font-size:4.5px;letter-spacing:.17em}.announcement-feed-copy time{color:rgba(255,255,255,.18);font-size:4.5px;letter-spacing:.11em;white-space:nowrap}
.announcement-feed-copy h3{margin:0;font-size:9px;line-height:1.25;font-weight:590;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.announcement-feed-copy p{margin:4px 0 0;color:rgba(255,255,255,.27);font-size:6.3px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.announcement-feed-index{color:rgba(255,255,255,.10);font-size:9px;text-align:right;font-variant-numeric:tabular-nums}

.team-section{padding:74px 0 12px;border-bottom:1px solid rgba(255,255,255,.07)}
.team-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,430px);gap:44px;align-items:end;margin-bottom:28px}
.team-heading h3{margin:0;font-size:clamp(40px,4.7vw,72px);line-height:.9;letter-spacing:-.052em;text-transform:uppercase}
.team-heading h3 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.56)}
.team-heading>p{margin:0;max-width:430px;color:rgba(255,255,255,.36);font-size:10.5px;line-height:1.72}

.team-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(410px,.88fr);gap:12px}
.team-lead{position:relative;min-height:310px;display:grid;grid-template-columns:minmax(190px,.62fr) minmax(0,1fr);overflow:hidden;border:1px solid rgba(255,255,255,.065);border-radius:12px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.035),rgba(255,255,255,.015) 42%,rgba(5,5,5,.10));-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}
.team-lead:before{content:"";position:absolute;left:0;top:24px;bottom:24px;width:2px;background:linear-gradient(180deg,var(--accent),rgba(var(--accent-rgb),.12));box-shadow:0 0 16px rgba(var(--accent-rgb),.25)}
.team-lead__visual{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;border-right:1px solid rgba(255,255,255,.05);overflow:hidden;background:radial-gradient(circle at 50% 38%,rgba(var(--accent-rgb),.07),transparent 58%)}
.team-lead__ghost{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:190px;line-height:1;font-weight:700;color:rgba(255,255,255,.018);pointer-events:none}
.team-lead__avatar{position:relative;z-index:1;width:96px;height:96px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.10);border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:inset 0 1px 0 rgba(255,255,255,.04);font-size:31px;font-weight:650;letter-spacing:.02em;color:rgba(255,255,255,.82)}
.team-lead__online{position:absolute;left:17px;bottom:16px;display:flex;align-items:center;gap:6px;color:rgba(255,255,255,.25);font-size:5px;letter-spacing:.17em}.team-lead__online i{width:5px;height:5px;border-radius:50%;background:#35d977;box-shadow:0 0 9px rgba(53,217,119,.45)}
.team-lead__content{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:30px 30px 26px}
.team-lead__eyebrow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px}.team-lead__eyebrow span{color:rgba(255,255,255,.25);font-size:5px;letter-spacing:.18em}.team-lead__eyebrow b{padding:5px 8px;border:1px solid rgba(var(--accent-rgb),.18);border-radius:5px;background:rgba(var(--accent-rgb),.05);color:var(--accent);font-size:5px;letter-spacing:.16em;font-weight:600}
.team-lead__content h4{margin:0 0 7px;font-size:29px;line-height:1;letter-spacing:-.035em}.team-lead__content>strong{color:rgba(255,255,255,.45);font-size:6px;letter-spacing:.18em;font-weight:500}.team-lead__content>p{max-width:520px;margin:17px 0 0;color:rgba(255,255,255,.34);font-size:8px;line-height:1.68}
.team-lead__tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:25px}.team-lead__tags span{padding:6px 8px;border:1px solid rgba(255,255,255,.055);border-radius:5px;background:rgba(255,255,255,.015);color:rgba(255,255,255,.28);font-size:4.5px;letter-spacing:.13em}

.team-roster{border:1px solid rgba(255,255,255,.06);border-radius:12px;overflow:hidden;background:rgba(7,7,7,.11);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.team-roster__head{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;border-bottom:1px solid rgba(255,255,255,.055);background:rgba(255,255,255,.012)}.team-roster__head span{color:rgba(255,255,255,.38);font-size:5px;letter-spacing:.18em}.team-roster__head b{color:rgba(255,255,255,.18);font-size:5px;letter-spacing:.14em;font-weight:500}
.team-member{position:relative;min-height:89px;display:grid;grid-template-columns:45px minmax(0,1fr) 52px;gap:12px;align-items:center;padding:13px 14px;border-bottom:1px solid rgba(255,255,255,.05);transition:background .2s ease}.team-member:last-child{border-bottom:0}.team-member:hover{background:linear-gradient(90deg,rgba(255,255,255,.024),rgba(var(--accent-rgb),.012))}
.team-member__avatar{width:43px;height:43px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.02);color:rgba(255,255,255,.65);font-size:13px;font-weight:620}
.team-member__copy{min-width:0}.team-member__copy small{display:block;margin-bottom:4px;color:var(--accent);font-size:4.7px;letter-spacing:.15em}.team-member__copy h4{margin:0 0 5px;font-size:12px;line-height:1.1}.team-member__copy p{margin:0;color:rgba(255,255,255,.27);font-size:6.5px;line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-member__meta{height:100%;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between}.team-member__meta span{display:flex;align-items:center;gap:5px;color:rgba(255,255,255,.22);font-size:4.5px;letter-spacing:.13em}.team-member__meta span i{width:4px;height:4px;border-radius:50%;background:#35d977}.team-member__meta b{color:rgba(255,255,255,.09);font-size:13px;font-weight:500}

/* keep the denser nav balanced after Duyurular */
@media(min-width:1051px){.nav{gap:20px}.nav a{font-size:10.5px;letter-spacing:.09em}}
@media(max-width:1120px){
  .announcement-board{grid-template-columns:1fr}.announcement-featured{border-right:0;border-bottom:1px solid rgba(255,255,255,.06)}.announcement-feed{grid-template-columns:1fr 1fr;grid-template-rows:none}.announcement-feed-item{border-bottom:0;border-right:1px solid rgba(255,255,255,.055)}.announcement-feed-item:last-child{border-right:0}
  .team-heading{grid-template-columns:1fr;gap:14px}.team-layout{grid-template-columns:1fr}.team-lead{min-height:270px}.team-roster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));}.team-roster__head{grid-column:1/-1}.team-member{grid-template-columns:40px minmax(0,1fr);min-height:110px;border-bottom:0;border-right:1px solid rgba(255,255,255,.05)}.team-member:last-child{border-right:0}.team-member__meta{position:absolute;right:10px;top:10px;bottom:10px}.team-member__copy p{white-space:normal}
}
@media(max-width:700px){
  .announcements-section{margin:2px 0 26px;padding-top:15px}.announcement-broadcast{width:31px;height:31px;flex-basis:31px}.announcements-head{align-items:center}.announcements-head h2{font-size:22px}.announcements-state{display:none}.announcement-featured{padding:12px 12px 10px}.announcement-featured__body{grid-template-columns:36px minmax(0,1fr);gap:9px}.announcement-number{font-size:27px}.announcement-featured__copy h3{font-size:11px}.announcement-featured__copy p{font-size:6.5px;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}.announcement-featured__footer strong{display:none}.announcement-feed{grid-template-columns:1fr}.announcement-feed-item{border-right:0;border-bottom:1px solid rgba(255,255,255,.05)}.announcement-feed-item:last-child{border-bottom:0}.announcement-feed-copy p{display:none}
  .team-section{padding-top:52px}.team-heading h3{font-size:43px}.team-lead{grid-template-columns:1fr;min-height:0}.team-lead__visual{min-height:150px;border-right:0;border-bottom:1px solid rgba(255,255,255,.05)}.team-lead__ghost{font-size:145px}.team-lead__avatar{width:76px;height:76px;border-radius:18px;font-size:25px}.team-lead__content{padding:21px 18px 19px}.team-lead__eyebrow{margin-bottom:17px}.team-lead__content h4{font-size:24px}.team-lead__content>p{margin-top:13px}.team-lead__tags{margin-top:18px}.team-roster{display:block}.team-member{grid-template-columns:42px minmax(0,1fr) 42px;min-height:86px;border-right:0;border-bottom:1px solid rgba(255,255,255,.05)}.team-member:last-child{border-bottom:0}.team-member__meta{position:static}.team-member__copy p{white-space:nowrap}
}


/* Step 26 - announcements & team redesign */
.announcements-titleicon,
.bulletin-card__icon,
.team-heading__icon,
.team-command__overview-icon{display:grid;place-items:center;flex:0 0 auto}
.announcements-titleicon{width:52px;height:52px;border:1px solid rgba(255,255,255,.06);border-radius:14px;background:rgba(255,255,255,.018)}
.announcements-titleicon img,.bulletin-card__icon img,.team-heading__icon img,.team-command__overview-icon img{width:22px;height:22px;object-fit:contain;filter:var(--accent-icon-filter);opacity:.82}
.announcements-head--enhanced{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px}
.announcements-titleline--enhanced{display:flex;align-items:center;gap:14px}
.announcements-titleline--enhanced h2{margin:4px 0 0;font-size:clamp(28px,3.2vw,52px);line-height:.92;text-transform:uppercase;letter-spacing:-.04em}
.announcements-titleline--enhanced h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.56)}
.bulletin-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:12px}
.bulletin-card{position:relative;padding:18px 18px 16px;border:1px solid rgba(255,255,255,.065);border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.018),rgba(255,255,255,.01));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden}
.bulletin-card:before{content:"";position:absolute;left:0;top:22px;bottom:22px;width:2px;background:linear-gradient(180deg,rgba(var(--accent-rgb),.78),rgba(var(--accent-rgb),.06));box-shadow:0 0 16px rgba(var(--accent-rgb),.18)}
.bulletin-card--updates:before{background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,.04));box-shadow:none}
.bulletin-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.bulletin-card__title{display:flex;align-items:center;gap:11px;min-width:0}
.bulletin-card__icon{width:40px;height:40px;border:1px solid rgba(255,255,255,.06);border-radius:12px;background:rgba(255,255,255,.02)}
.bulletin-card__title small{display:block;color:rgba(255,255,255,.28);font-size:5.2px;letter-spacing:.24em}
.bulletin-card__title h3{margin:5px 0 0;font-size:15px;line-height:1.15}
.bulletin-card__badge{padding:6px 9px;border:1px solid rgba(var(--accent-rgb),.18);border-radius:999px;background:rgba(var(--accent-rgb),.06);color:var(--accent);font-size:5px;letter-spacing:.18em;white-space:nowrap}
.bulletin-card__badge--muted{border-color:rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:rgba(255,255,255,.54)}
.bulletin-list,.update-stack{display:grid;gap:10px}
.bulletin-item,.update-item{display:grid;grid-template-columns:46px minmax(0,1fr);gap:12px;align-items:start;padding:12px;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:rgba(255,255,255,.015)}
.bulletin-item--priority{background:linear-gradient(145deg,rgba(var(--accent-rgb),.045),rgba(255,255,255,.016))}
.bulletin-item__date{width:46px;height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.06);border-radius:10px;background:rgba(255,255,255,.02)}
.bulletin-item__date b{font-size:14px;line-height:1;font-weight:620}.bulletin-item__date span{margin-top:5px;color:rgba(255,255,255,.3);font-size:4.8px;letter-spacing:.15em}
.bulletin-item__copy{min-width:0}.bulletin-item__meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:5px}.bulletin-item__meta span{color:var(--accent);font-size:4.8px;letter-spacing:.18em}.bulletin-item__meta time{color:rgba(255,255,255,.22);font-size:4.6px;letter-spacing:.12em}.bulletin-item__copy h4,.update-item h4{margin:0;font-size:10px;line-height:1.28}.bulletin-item__copy p,.update-item p{margin:6px 0 0;color:rgba(255,255,255,.31);font-size:6.7px;line-height:1.55}
.update-item{grid-template-columns:1fr;padding:13px 14px}
.update-item__tag{display:flex;align-items:center;gap:7px;margin-bottom:7px}.update-item__tag img{width:12px;height:12px;object-fit:contain;filter:var(--accent-icon-filter);opacity:.74}.update-item__tag span{color:rgba(255,255,255,.3);font-size:4.7px;letter-spacing:.18em}

.team-heading--enhanced{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,420px);gap:34px;align-items:end;margin-bottom:24px}
.team-heading__titleline{display:flex;align-items:flex-start;gap:14px}
.team-heading__icon{width:52px;height:52px;border:1px solid rgba(255,255,255,.06);border-radius:14px;background:rgba(255,255,255,.018)}
.team-heading__titleline h3{margin:6px 0 0;font-size:clamp(36px,4.4vw,66px);line-height:.9;letter-spacing:-.05em;text-transform:uppercase}
.team-heading__titleline h3 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.55)}
.team-heading--enhanced>p{margin:0;color:rgba(255,255,255,.36);font-size:10px;line-height:1.72;max-width:420px}
.team-command{display:grid;grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr);gap:12px}
.team-command__overview{padding:20px;border:1px solid rgba(255,255,255,.065);border-radius:14px;background:linear-gradient(145deg,rgba(var(--accent-rgb),.03),rgba(255,255,255,.012));-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}
.team-command__overview-top{display:flex;align-items:center;gap:11px;margin-bottom:16px}.team-command__overview-icon{width:42px;height:42px;border:1px solid rgba(255,255,255,.06);border-radius:12px;background:rgba(255,255,255,.02)}.team-command__overview-top small{display:block;color:rgba(255,255,255,.28);font-size:5px;letter-spacing:.2em}.team-command__overview-top h4{margin:5px 0 0;font-size:18px;line-height:1.1}
.team-command__overview>p{margin:0;color:rgba(255,255,255,.34);font-size:8px;line-height:1.72}
.team-command__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:18px 0}.team-command__stats div{padding:12px 10px;border:1px solid rgba(255,255,255,.055);border-radius:10px;background:rgba(255,255,255,.014)}.team-command__stats b{display:block;font-size:18px;line-height:1;font-weight:620}.team-command__stats span{display:block;margin-top:6px;color:rgba(255,255,255,.26);font-size:4.8px;letter-spacing:.16em}
.team-command__note{padding:12px 13px;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:rgba(255,255,255,.016)}.team-command__note span{display:flex;align-items:center;gap:6px;color:rgba(255,255,255,.24);font-size:4.8px;letter-spacing:.16em}.team-command__note span i{width:5px;height:5px;border-radius:50%;background:#35d977;box-shadow:0 0 8px rgba(53,217,119,.34)}.team-command__note strong{display:block;margin-top:7px;color:rgba(255,255,255,.58);font-size:7px;line-height:1.55;font-weight:500}
.team-command__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.staff-card{position:relative;min-height:208px;padding:17px;border:1px solid rgba(255,255,255,.06);border-radius:14px;background:linear-gradient(150deg,rgba(255,255,255,.018),rgba(255,255,255,.01));-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow:hidden}.staff-card:before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:2px;background:linear-gradient(180deg,rgba(255,255,255,.22),transparent)}.staff-card--lead:before{background:linear-gradient(180deg,var(--accent),rgba(var(--accent-rgb),.08))}
.staff-card__head{display:flex;align-items:center;justify-content:space-between;gap:10px}.staff-card__head small{color:rgba(255,255,255,.28);font-size:5px;letter-spacing:.18em}.staff-card__head span{color:rgba(255,255,255,.12);font-size:18px;font-weight:520}
.staff-card__avatar{width:54px;height:54px;display:grid;place-items:center;margin:18px 0 14px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.02));font-size:18px;font-weight:620;color:rgba(255,255,255,.78)}
.staff-card h4{margin:0 0 6px;font-size:17px;line-height:1.1}.staff-card strong{display:block;color:var(--accent);font-size:5.2px;letter-spacing:.2em;font-weight:600}.staff-card p{margin:11px 0 0;color:rgba(255,255,255,.31);font-size:7px;line-height:1.62}

@media(max-width:1080px){
  .bulletin-grid,.team-command,.team-heading--enhanced{grid-template-columns:1fr}
  .team-command__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .announcements-head--enhanced{align-items:flex-start}.announcements-state{display:none}.announcements-titleicon,.team-heading__icon{width:42px;height:42px}.announcements-titleicon img,.team-heading__icon img{width:18px;height:18px}
  .bulletin-card{padding:14px}.bulletin-item{grid-template-columns:40px minmax(0,1fr);gap:10px;padding:10px}.bulletin-item__date{width:40px;height:48px}.bulletin-item__date b{font-size:12px}.bulletin-card__title h3{font-size:13px}.bulletin-item__copy h4,.update-item h4{font-size:9px}.bulletin-item__copy p,.update-item p{font-size:6.3px}
  .team-heading__titleline{align-items:center}.team-heading__titleline h3{font-size:38px}.team-command__overview{padding:15px}.team-command__stats{grid-template-columns:1fr 1fr}.team-command__grid{grid-template-columns:1fr}.staff-card{min-height:0}
}


/* Step 27 - readability refinements */
.hero{
  min-height:calc(100svh - var(--topbar-height) - 18px) !important;
  padding-top:42px !important;
  padding-bottom:28px !important;
  align-items:center;
}
@media (max-width:700px){
  .hero{
    min-height:calc(100svh - var(--topbar-height) - 12px) !important;
    padding-top:26px !important;
    padding-bottom:20px !important;
  }
}

.announcements-section{
  margin:22px 0 36px;
  padding-top:18px;
}
.announcements-head--enhanced{
  margin-bottom:20px;
  gap:24px;
}
.announcements-titleline--enhanced{gap:16px}
.announcements-kicker{
  display:block;
  margin-bottom:6px;
  color:rgba(255,255,255,.40);
  font-size:10px;
  letter-spacing:.22em;
}
.announcements-titleline--enhanced h2{
  font-size:clamp(32px,3.5vw,56px);
  letter-spacing:-.045em;
}
.announcements-state{
  padding:10px 14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  background:rgba(255,255,255,.03);
  font-size:11px;
  letter-spacing:.16em;
  color:rgba(255,255,255,.56);
}
.announcements-state b{color:#fff;font-size:14px;margin-right:6px}
.bulletin-grid{
  grid-template-columns:1.08fr .92fr;
  gap:14px;
}
.bulletin-card{
  padding:24px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(145deg,rgba(255,255,255,.022),rgba(255,255,255,.012));
}
.bulletin-card:before{top:24px;bottom:24px}
.bulletin-card__head{margin-bottom:18px;gap:14px}
.bulletin-card__icon{width:44px;height:44px;border-radius:13px}
.bulletin-card__icon img{width:18px;height:18px}
.bulletin-card__title small{font-size:10px;letter-spacing:.22em}
.bulletin-card__title h3{font-size:20px;line-height:1.15;margin-top:6px;font-weight:620;letter-spacing:-.02em}
.bulletin-card__badge{padding:7px 11px;font-size:10px;letter-spacing:.15em}
.bulletin-list,.update-stack{gap:12px}
.bulletin-item{
  grid-template-columns:56px minmax(0,1fr);
  gap:14px;
  padding:15px;
  border-radius:13px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.018);
}
.bulletin-item__date{width:56px;height:64px;border-radius:12px}
.bulletin-item__date b{font-size:19px}
.bulletin-item__date span{font-size:9px;letter-spacing:.18em}
.bulletin-item__meta{margin-bottom:8px}
.bulletin-item__meta span{font-size:10px;letter-spacing:.18em}
.bulletin-item__meta time{font-size:9px;letter-spacing:.12em;color:rgba(255,255,255,.34)}
.bulletin-item__copy h4,.update-item h4{
  font-size:18px;
  line-height:1.25;
  letter-spacing:-.02em;
}
.bulletin-item__copy p,.update-item p{
  margin-top:8px;
  font-size:13px;
  line-height:1.65;
  color:rgba(255,255,255,.48);
}
.update-item{
  padding:15px 16px;
  border-radius:13px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.018);
}
.update-item__tag{margin-bottom:9px;gap:8px}
.update-item__tag img{width:14px;height:14px}
.update-item__tag span{font-size:10px;letter-spacing:.18em;color:rgba(255,255,255,.40)}

.team-heading--enhanced{
  gap:26px;
  margin-bottom:22px;
}
.team-heading__titleline{gap:16px;align-items:flex-start}
.team-heading__titleline h3{font-size:clamp(38px,4.2vw,64px)}
.team-heading--enhanced>p{font-size:14px;line-height:1.75;color:rgba(255,255,255,.46)}
.team-command{grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr);gap:16px}
.team-command__overview{
  padding:22px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(145deg,rgba(var(--accent-rgb),.035),rgba(255,255,255,.015));
}
.team-command__overview-top{gap:12px;margin-bottom:18px}
.team-command__overview-top small{font-size:10px;letter-spacing:.20em}
.team-command__overview-top h4{font-size:22px;margin-top:6px}
.team-command__overview>p{font-size:14px;line-height:1.8;color:rgba(255,255,255,.48)}
.team-command__stats div{padding:14px 12px;border-radius:12px}
.team-command__stats b{font-size:22px}
.team-command__stats span{font-size:9px;letter-spacing:.16em}
.team-command__note{padding:14px 15px;border-radius:12px}
.team-command__note span{font-size:9px;letter-spacing:.16em}
.team-command__note strong{font-size:12px;line-height:1.6;color:rgba(255,255,255,.62)}
.team-command__grid{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.staff-card{
  min-height:0;
  display:grid;
  grid-template-columns:72px minmax(0,1fr) 42px;
  align-items:center;
  gap:16px;
  padding:16px 18px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(145deg,rgba(255,255,255,.024),rgba(255,255,255,.012));
}
.staff-card:before{top:20px;bottom:20px}
.staff-card__head{
  grid-column:2 / 4;
  grid-row:1;
  margin-bottom:2px;
}
.staff-card__head small{font-size:10px;letter-spacing:.18em;color:rgba(255,255,255,.38)}
.staff-card__head span{font-size:18px;color:rgba(255,255,255,.16)}
.staff-card__avatar{
  grid-column:1;
  grid-row:1 / span 3;
  width:72px;
  height:72px;
  margin:0;
  border-radius:18px;
  font-size:24px;
}
.staff-card h4{
  grid-column:2;
  margin:0;
  font-size:21px;
  line-height:1.12;
}
.staff-card strong{
  grid-column:2;
  margin-top:4px;
  font-size:10px;
  letter-spacing:.20em;
}
.staff-card p{
  grid-column:2;
  margin:8px 0 0;
  font-size:13px;
  line-height:1.6;
  color:rgba(255,255,255,.46);
}
.staff-card--lead{
  background:linear-gradient(145deg,rgba(var(--accent-rgb),.05),rgba(255,255,255,.015));
}

@media(max-width:1080px){
  .bulletin-grid,.team-command,.team-heading--enhanced{grid-template-columns:1fr !important}
}
@media(max-width:700px){
  .announcements-section{margin:12px 0 26px;padding-top:10px}
  .announcements-kicker{font-size:8px}
  .announcements-titleline--enhanced h2{font-size:28px}
  .bulletin-card{padding:16px}
  .bulletin-card__title h3{font-size:16px}
  .bulletin-card__badge{font-size:8px;padding:6px 8px}
  .bulletin-item{grid-template-columns:48px minmax(0,1fr);padding:12px}
  .bulletin-item__date{width:48px;height:56px}
  .bulletin-item__date b{font-size:16px}
  .bulletin-item__date span,.bulletin-item__meta span,.bulletin-item__meta time,.update-item__tag span{font-size:8px}
  .bulletin-item__copy h4,.update-item h4{font-size:15px}
  .bulletin-item__copy p,.update-item p{font-size:12px;line-height:1.55}
  .team-heading__titleline h3{font-size:34px}
  .team-heading--enhanced>p,.team-command__overview>p{font-size:13px}
  .team-command__stats{grid-template-columns:1fr 1fr 1fr}
  .staff-card{grid-template-columns:58px minmax(0,1fr);gap:12px;padding:14px 15px}
  .staff-card__avatar{grid-row:1 / span 4;width:58px;height:58px;border-radius:15px;font-size:20px}
  .staff-card__head{grid-column:2;grid-row:1}
  .staff-card h4,.staff-card strong,.staff-card p{grid-column:2}
  .staff-card h4{font-size:18px}
  .staff-card strong{font-size:9px}
  .staff-card p{font-size:12px}
}


/* Step 28 - compact readable announcements + staff directory */
.hero{
  min-height:calc(100svh - var(--topbar-height)) !important;
  padding-top:34px !important;
  padding-bottom:28px !important;
}

.announcements-minimal{
  margin:0 0 42px;
  padding:30px 0 0;
}
.mini-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:14px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.mini-section-head__title{display:flex;align-items:center;gap:12px;min-width:0}
.mini-section-head__icon{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.018);flex:0 0 auto}
.mini-section-head__icon img{width:16px;height:16px;object-fit:contain;filter:var(--accent-icon-filter);opacity:.78}
.mini-section-head__title>div>span{display:block;color:rgba(255,255,255,.32);font-size:8px;letter-spacing:.20em}
.mini-section-head h2{margin:3px 0 0;font-size:22px;line-height:1.05;letter-spacing:-.025em;text-transform:uppercase}
.mini-section-head__status{display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.30);font-size:8px;letter-spacing:.16em;white-space:nowrap}
.mini-section-head__status i,.staff-line__state i{width:5px;height:5px;border-radius:50%;background:#35d977;box-shadow:0 0 8px rgba(53,217,119,.35)}
.news-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.news-column{border:1px solid rgba(255,255,255,.065);border-radius:12px;background:rgba(255,255,255,.012);overflow:hidden}
.news-column__head{height:40px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 13px;border-bottom:1px solid rgba(255,255,255,.055);background:rgba(255,255,255,.012)}
.news-column__head>span{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.66);font-size:9px;letter-spacing:.16em;font-weight:600}.news-column__head img{width:13px;height:13px;object-fit:contain;filter:var(--accent-icon-filter);opacity:.68}.news-column__head small{color:rgba(255,255,255,.18);font-size:8px;letter-spacing:.13em}
.news-list{display:grid}
.news-row{display:grid;grid-template-columns:42px minmax(0,1fr);gap:11px;padding:12px 13px;border-bottom:1px solid rgba(255,255,255,.045)}.news-row:last-child{border-bottom:0}.news-row--important{background:linear-gradient(90deg,rgba(var(--accent-rgb),.035),transparent 60%)}
.news-row>time{width:42px;height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid rgba(255,255,255,.055);color:#fff}.news-row>time b{font-size:13px;line-height:1}.news-row>time span{margin-top:4px;color:rgba(255,255,255,.24);font-size:7px;letter-spacing:.10em}
.news-row__copy>div{display:flex;justify-content:space-between;gap:10px;margin-bottom:4px}.news-row__copy>div span{color:var(--accent);font-size:7.5px;letter-spacing:.15em}.news-row__copy>div small{color:rgba(255,255,255,.18);font-size:7px;letter-spacing:.10em}.news-row__copy h3{margin:0;font-size:13px;line-height:1.22;font-weight:600}.news-row__copy p{margin:4px 0 0;color:rgba(255,255,255,.38);font-size:10.5px;line-height:1.48}
.news-list--updates{display:grid}.update-row{display:grid;grid-template-columns:38px minmax(0,1fr) 48px;gap:10px;align-items:center;padding:11px 13px;border-bottom:1px solid rgba(255,255,255,.045)}.update-row:last-child{border-bottom:0}.update-row__version{display:grid;place-items:center;width:36px;height:28px;border:1px solid rgba(255,255,255,.06);border-radius:7px;background:rgba(255,255,255,.015);color:rgba(255,255,255,.55);font-size:8px;font-weight:600;letter-spacing:.08em}.update-row h3{margin:0;font-size:12px;line-height:1.2}.update-row p{margin:4px 0 0;color:rgba(255,255,255,.34);font-size:9.5px;line-height:1.42}.update-row time{color:rgba(255,255,255,.18);font-size:7px;letter-spacing:.09em;text-align:right;white-space:nowrap}

.team-minimal{padding:48px 0 8px !important}
.mini-team-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,390px);gap:30px;align-items:end;margin-bottom:14px}
.mini-team-head__title{display:flex;align-items:center;gap:12px}.mini-team-head__icon{width:36px;height:36px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.018);flex:0 0 auto}.mini-team-head__icon img{width:17px;height:17px;object-fit:contain;filter:var(--accent-icon-filter);opacity:.76}.mini-team-head h3{margin:4px 0 0;font-size:28px;line-height:1;text-transform:uppercase;letter-spacing:-.025em}.mini-team-head>p{margin:0;color:rgba(255,255,255,.38);font-size:11px;line-height:1.55}
.staff-directory{border:1px solid rgba(255,255,255,.065);border-radius:12px;background:rgba(255,255,255,.012);overflow:hidden}
.staff-line{position:relative;display:grid;grid-template-columns:44px minmax(150px,.7fr) minmax(240px,1.4fr) 56px;gap:14px;align-items:center;min-height:68px;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.048);transition:background .18s ease}.staff-line:last-child{border-bottom:0}.staff-line:hover{background:rgba(255,255,255,.018)}.staff-line--lead{background:linear-gradient(90deg,rgba(var(--accent-rgb),.035),transparent 42%)}.staff-line--lead:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:2px;background:var(--accent)}
.staff-line__avatar{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.018);color:rgba(255,255,255,.72);font-size:13px;font-weight:650}.staff-line__identity span{display:block;margin-bottom:3px;color:var(--accent);font-size:7.5px;letter-spacing:.16em}.staff-line__identity h4{margin:0;font-size:13px;line-height:1.1}.staff-line>p{margin:0;color:rgba(255,255,255,.37);font-size:10.5px;line-height:1.45}.staff-line__state{display:flex;align-items:center;justify-content:flex-end;gap:6px;color:rgba(255,255,255,.24);font-size:7px;letter-spacing:.12em}

@media(max-width:900px){.news-columns{grid-template-columns:1fr}.mini-team-head{grid-template-columns:1fr;gap:8px}.staff-line{grid-template-columns:42px minmax(130px,.8fr) minmax(0,1.2fr) 52px}}
@media(max-width:700px){
  .hero{min-height:calc(100svh - var(--topbar-height)) !important;padding-top:22px !important;padding-bottom:20px !important}
  .announcements-minimal{padding-top:22px;margin-bottom:30px}.mini-section-head h2{font-size:18px}.mini-section-head__status{display:none}.news-row__copy p{font-size:10px}.update-row{grid-template-columns:34px minmax(0,1fr)}.update-row time{display:none}
  .team-minimal{padding-top:38px !important}.mini-team-head h3{font-size:24px}.mini-team-head>p{font-size:10.5px}.staff-line{grid-template-columns:40px minmax(0,1fr) 48px;gap:10px;min-height:64px}.staff-line__avatar{width:36px;height:36px}.staff-line__identity{grid-column:2}.staff-line>p{grid-column:2 / 4;margin-top:-2px}.staff-line__state{grid-column:3;grid-row:1;align-self:start;margin-top:4px}.staff-line__identity h4{font-size:12px}.staff-line>p{font-size:9.5px}
}


/* Step 29 - copyright, announcement detail modal, FAQ/contact footer */
.hero{position:relative}
.hero-copyright{
  position:absolute;
  left:2vw;
  bottom:16px;
  z-index:2;
  color:rgba(255,255,255,.26);
  font-size:9px;
  letter-spacing:.13em;
  text-transform:uppercase;
  pointer-events:none;
}
.hero-copyright span{margin:0 7px;color:rgba(var(--accent-rgb),.55)}
.news-row[role="button"],.update-row[role="button"]{cursor:pointer;outline:none}
.news-row[role="button"]:focus-visible,.update-row[role="button"]:focus-visible{border-color:rgba(var(--accent-rgb),.38);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.08)}
.news-row[role="button"]:after,.update-row[role="button"]:after{content:"↗";position:absolute;right:10px;top:10px;color:rgba(255,255,255,.16);font-size:10px;transition:.18s ease}
.news-row[role="button"]:hover:after,.update-row[role="button"]:hover:after{color:var(--accent);transform:translate(1px,-1px)}
.news-row,.update-row{position:relative}

.news-modal{position:fixed;inset:0;z-index:310;display:grid;place-items:center;padding:20px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease}
.news-modal.open{opacity:1;visibility:visible;pointer-events:auto}
.news-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.68);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.news-modal__dialog{position:relative;width:min(560px,calc(100vw - 32px));padding:24px;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:linear-gradient(145deg,rgba(18,18,18,.96),rgba(7,7,7,.95));box-shadow:0 28px 80px rgba(0,0,0,.46);transform:translateY(8px) scale(.985);transition:transform .2s ease}
.news-modal.open .news-modal__dialog{transform:none}
.news-modal__close{position:absolute;right:12px;top:12px;width:32px;height:32px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.025);color:#fff;font-size:19px;line-height:1;cursor:pointer}
.news-modal__close:hover{border-color:rgba(var(--accent-rgb),.28);background:rgba(var(--accent-rgb),.05)}
.news-modal__type{display:flex;align-items:center;gap:11px;padding-right:42px}
.news-modal__icon{width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.07);border-radius:11px;background:rgba(255,255,255,.02)}
.news-modal__icon img{width:18px;height:18px;object-fit:contain;filter:var(--accent-icon-filter);opacity:.8}
.news-modal__type small{display:block;color:var(--accent);font-size:9px;letter-spacing:.18em}
.news-modal__type time{display:block;margin-top:4px;color:rgba(255,255,255,.30);font-size:9px;letter-spacing:.12em}
.news-modal h3{margin:22px 0 8px;font-size:27px;line-height:1.08;letter-spacing:-.035em}
.news-modal__summary{margin:0;color:rgba(255,255,255,.48);font-size:13px;line-height:1.65}
.news-modal__detail{margin-top:17px;padding:15px 16px;border-left:2px solid rgba(var(--accent-rgb),.70);background:rgba(255,255,255,.018);color:rgba(255,255,255,.67);font-size:13px;line-height:1.72}
.news-modal__footer{display:flex;justify-content:space-between;gap:12px;margin-top:20px;padding-top:14px;border-top:1px solid rgba(255,255,255,.06);color:rgba(255,255,255,.22);font-size:8px;letter-spacing:.14em}
.news-modal__footer b{font-weight:500;color:rgba(255,255,255,.34)}
body.news-modal-open{overflow:hidden}

.site-footer{margin-top:68px;padding:34px 2vw 0;border-top:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.18))}
.site-footer__grid{display:grid;grid-template-columns:.9fr 1.1fr .9fr;gap:44px;padding-bottom:28px}
.site-footer__logo{display:flex;align-items:center;gap:11px;width:max-content}.site-footer__logo img{width:40px;height:40px;object-fit:contain}.site-footer__logo span{display:flex;flex-direction:column}.site-footer__logo b{font-size:13px;letter-spacing:.14em}.site-footer__logo small{margin-top:4px;color:rgba(255,255,255,.28);font-size:7px;letter-spacing:.28em}
.site-footer__brand>p,.site-footer__contact>p{max-width:330px;margin:16px 0 0;color:rgba(255,255,255,.36);font-size:11px;line-height:1.7}
.site-footer__social{display:flex;align-items:center;gap:10px;margin-top:17px;flex-wrap:wrap}.footer-social-icon{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.07);border-radius:50%;background:rgba(255,255,255,.015);box-shadow:0 0 0 1px rgba(255,255,255,.01) inset;transition:transform .25s ease,border-color .25s ease,background .25s ease,box-shadow .25s ease}.footer-social-icon:hover{transform:translateY(-2px) scale(1.04);border-color:rgba(var(--accent-rgb),.28);background:rgba(var(--accent-rgb),.08);box-shadow:0 0 16px rgba(var(--accent-rgb),.16)}.social-mask{display:block;width:18px;height:18px;background:rgba(var(--accent-rgb),.96);opacity:.95;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;transition:transform .25s ease,opacity .25s ease,filter .25s ease}.footer-social-icon:hover .social-mask{transform:scale(1.08);opacity:1;filter:drop-shadow(0 0 8px rgba(var(--accent-rgb),.28))}.social-mask--instagram{-webkit-mask-image:url('assets/social-instagram.png');mask-image:url('assets/social-instagram.png')}.social-mask--youtube{-webkit-mask-image:url('assets/social-youtube.png');mask-image:url('assets/social-youtube.png')}.social-mask--tiktok{-webkit-mask-image:url('assets/social-tiktok.png');mask-image:url('assets/social-tiktok.png')}
.site-footer__heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;padding-bottom:9px;border-bottom:1px solid rgba(255,255,255,.06)}.site-footer__heading span{font-size:10px;letter-spacing:.17em}.site-footer__heading small{color:rgba(255,255,255,.22);font-size:7px;letter-spacing:.13em}
.site-footer__faq details{border-bottom:1px solid rgba(255,255,255,.05)}.site-footer__faq summary{min-height:43px;display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer;color:rgba(255,255,255,.70);font-size:11px}.site-footer__faq summary::-webkit-details-marker{display:none}.site-footer__faq summary span{font-size:16px;color:rgba(255,255,255,.28);transition:transform .18s ease}.site-footer__faq details[open] summary span{transform:rotate(45deg);color:var(--accent)}.site-footer__faq details p{margin:0 0 12px;color:rgba(255,255,255,.38);font-size:10px;line-height:1.65}
.footer-contact{margin-top:15px;min-height:48px;padding:0 11px;display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:9px;align-items:center;border:1px solid rgba(255,255,255,.065);border-radius:10px;background:rgba(255,255,255,.015)}.footer-contact>img{width:20px;height:20px;object-fit:contain;filter:invert(1);opacity:.75}.footer-contact span{display:flex;flex-direction:column}.footer-contact b{font-size:10px;letter-spacing:.11em}.footer-contact small{margin-top:3px;color:rgba(255,255,255,.28);font-size:8px}.footer-contact>strong{color:rgba(255,255,255,.25);font-size:12px;font-weight:500}.footer-contact:hover{border-color:rgba(var(--accent-rgb),.24)}
.footer-links{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:16px}.footer-links a{color:rgba(255,255,255,.32);font-size:9px}.footer-links a:hover{color:#fff}
.site-footer__bottom{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid rgba(255,255,255,.055);color:rgba(255,255,255,.20);font-size:8px;letter-spacing:.13em;text-transform:uppercase}
body.store-open .site-footer{margin-top:20px}

@media(max-width:900px){.site-footer__grid{grid-template-columns:1fr 1fr;gap:30px}.site-footer__brand{grid-column:1/-1}.site-footer__brand>p{max-width:520px}}
@media(max-width:700px){
  .hero-copyright{left:0;bottom:8px;font-size:7.5px}
  .news-modal__dialog{padding:19px}.news-modal h3{font-size:23px}.news-modal__summary,.news-modal__detail{font-size:12px}.news-modal__footer{font-size:7px}
  .site-footer{margin-top:48px;padding:28px 0 0}.site-footer__grid{grid-template-columns:1fr;gap:28px}.site-footer__brand{grid-column:auto}.site-footer__bottom{align-items:flex-start;flex-direction:column;justify-content:center;padding:13px 0;gap:5px}
}


/* Step 30 - store search, campaigns, notifications & maintenance */
.store-utility{
  display:grid;
  grid-template-columns:minmax(300px,.85fr) minmax(440px,1.15fr);
  gap:12px;
  margin:18px 0 12px;
}
.store-search,
.campaign-strip{
  min-height:70px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:12px;
  background:rgba(255,255,255,.015);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.store-search{
  display:grid;
  grid-template-columns:28px 115px minmax(0,1fr) 28px;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  cursor:text;
}
.store-search__icon{position:relative;width:22px;height:22px;opacity:.55}
.store-search__icon:before{content:"";position:absolute;left:3px;top:3px;width:10px;height:10px;border:1.5px solid rgba(255,255,255,.82);border-radius:50%}
.store-search__icon:after{content:"";position:absolute;left:14px;top:14px;width:7px;height:1.5px;border-radius:2px;background:rgba(255,255,255,.82);transform:rotate(45deg);transform-origin:left center}
.store-search__copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.store-search__copy small{font-size:5px;letter-spacing:.20em;color:rgba(255,255,255,.25)}
.store-search__copy strong{font-size:9px;letter-spacing:.06em;color:rgba(255,255,255,.62)}
.store-search input{
  width:100%;height:38px;padding:0 11px;border:1px solid rgba(255,255,255,.06);border-radius:8px;outline:0;background:rgba(0,0,0,.14);color:#fff;font:inherit;font-size:10px;letter-spacing:.02em;
}
.store-search input:focus{border-color:rgba(var(--accent-rgb),.35);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.045)}
.store-search input::placeholder{color:rgba(255,255,255,.22)}
.store-search button{width:28px;height:28px;border:0;border-radius:7px;background:rgba(255,255,255,.025);color:rgba(255,255,255,.45);cursor:pointer;font-size:16px}
.store-search button:hover{background:rgba(255,255,255,.06);color:#fff}

.campaign-strip{
  display:grid;
  grid-template-columns:160px minmax(210px,1fr) 145px;
  align-items:center;
  gap:12px;
  padding:10px 12px;
}
.campaign-strip__copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.campaign-strip__copy>span{font-size:5px;letter-spacing:.22em;color:var(--accent)}
.campaign-strip__copy>strong{font-size:9.5px;letter-spacing:.04em}
.campaign-strip__copy>small{margin-top:2px;font-size:6px;color:rgba(255,255,255,.26);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.campaign-strip__entry{display:grid;grid-template-columns:minmax(0,1fr) 72px;gap:6px}
.campaign-strip__entry input{height:38px;min-width:0;padding:0 10px;border:1px solid rgba(255,255,255,.065);border-radius:8px;outline:0;background:rgba(0,0,0,.14);color:#fff;font:inherit;font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.campaign-strip__entry input:focus{border-color:rgba(var(--accent-rgb),.35)}
.campaign-strip__entry button{height:38px;border:1px solid rgba(var(--accent-rgb),.22);border-radius:8px;background:rgba(var(--accent-rgb),.065);color:#fff;font-size:6px;letter-spacing:.16em;font-weight:650;cursor:pointer}
.campaign-strip__entry button:hover{background:rgba(var(--accent-rgb),.12);border-color:rgba(var(--accent-rgb),.4)}
.campaign-strip__status{display:flex;align-items:center;gap:7px;min-width:0;padding-left:10px;border-left:1px solid rgba(255,255,255,.05);color:rgba(255,255,255,.25);font-size:6px;letter-spacing:.08em}
.campaign-strip__status i{width:5px;height:5px;flex:0 0 auto;border-radius:50%;background:rgba(255,255,255,.18)}
.campaign-strip__status span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.campaign-strip__status.active{color:rgba(255,255,255,.65)}
.campaign-strip__status.active i{background:#35d977;box-shadow:0 0 9px rgba(53,217,119,.45)}

.store-card.has-discount:before{content:attr(data-discount-label);position:absolute;right:10px;top:10px;z-index:4;padding:5px 7px;border:1px solid rgba(var(--accent-rgb),.25);border-radius:6px;background:rgba(9,9,9,.72);color:var(--accent);font-size:6px;letter-spacing:.1em;backdrop-filter:blur(10px)}
.store-card__footer strong:has(.store-price-new){display:flex;align-items:baseline;gap:6px}
.store-price-old{font-size:9px;color:rgba(255,255,255,.26);text-decoration:line-through;font-weight:450;letter-spacing:0}
.store-price-new{font-size:17px;color:#fff;letter-spacing:-.04em}
.product-modal__discount{display:inline-flex;width:max-content;margin-bottom:4px;padding:4px 6px;border:1px solid rgba(var(--accent-rgb),.20);border-radius:5px;background:rgba(var(--accent-rgb),.05);color:var(--accent);font-size:5px;letter-spacing:.13em}
.product-modal__price strong:has(.product-price-old){display:flex;align-items:baseline;gap:8px}
.product-price-old{font-size:11px;color:rgba(255,255,255,.25);text-decoration:line-through;font-weight:450;letter-spacing:0}
.store-empty{min-height:170px;margin:10px 0 24px;display:flex;align-items:center;justify-content:center;gap:16px;border:1px dashed rgba(255,255,255,.07);border-radius:12px;color:rgba(255,255,255,.38)}
.store-empty[hidden]{display:none}
.store-empty>span{font-size:34px;color:rgba(255,255,255,.08);font-weight:600}
.store-empty div{display:flex;flex-direction:column;gap:4px}.store-empty strong{font-size:12px;color:rgba(255,255,255,.66)}.store-empty small{font-size:7px;color:rgba(255,255,255,.27)}

.toast-stack{position:fixed;top:calc(var(--topbar-height) + 14px);right:18px;z-index:600;display:flex;flex-direction:column;gap:8px;width:min(330px,calc(100vw - 36px));pointer-events:none}
.site-toast{display:grid;grid-template-columns:7px minmax(0,1fr) 24px;gap:10px;align-items:start;padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(9,9,9,.84);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 15px 40px rgba(0,0,0,.28);opacity:0;transform:translateX(16px);transition:.18s ease;pointer-events:auto}
.site-toast.show{opacity:1;transform:translateX(0)}
.site-toast__mark{width:5px;height:34px;border-radius:4px;background:rgba(255,255,255,.25)}
.site-toast--success .site-toast__mark{background:#35d977}.site-toast--error .site-toast__mark{background:#ff5b55}.site-toast--warning .site-toast__mark{background:#f2b84b}.site-toast--info .site-toast__mark{background:var(--accent)}
.site-toast strong{display:block;margin-bottom:4px;font-size:7px;letter-spacing:.17em;color:rgba(255,255,255,.7)}
.site-toast p{margin:0;font-size:8px;line-height:1.5;color:rgba(255,255,255,.42)}
.site-toast button{width:24px;height:24px;border:0;border-radius:6px;background:transparent;color:rgba(255,255,255,.32);cursor:pointer;font-size:15px}.site-toast button:hover{background:rgba(255,255,255,.04);color:#fff}

.maintenance-screen{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:24px;overflow:auto;background:#060606}
.maintenance-screen.open{display:flex}
.maintenance-screen__veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,4,4,.88),rgba(4,4,4,.62)),url('assets/background.webp') center/cover no-repeat;filter:saturate(.75)}
.maintenance-screen__panel{position:relative;z-index:1;width:min(620px,100%);padding:34px;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:rgba(9,9,9,.54);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 30px 80px rgba(0,0,0,.32)}
.maintenance-screen__logo{width:55px;height:55px;object-fit:contain;margin-bottom:28px}
.maintenance-screen__eyebrow{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.42);font-size:8px;letter-spacing:.25em}.maintenance-screen__eyebrow i{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px rgba(var(--accent-rgb),.55)}
.maintenance-screen h2{margin:14px 0 18px;font-size:clamp(44px,7vw,78px);line-height:.88;text-transform:uppercase;letter-spacing:-.055em}.maintenance-screen h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.56)}
.maintenance-screen p{max-width:520px;margin:0;color:rgba(255,255,255,.46);font-size:13px;line-height:1.75}
.maintenance-screen__status{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:28px 0 14px;padding:13px 14px;border:1px solid rgba(255,255,255,.06);border-radius:10px;background:rgba(255,255,255,.018)}
.maintenance-screen__status span{display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.48);font-size:7px;letter-spacing:.16em}.maintenance-screen__status span i{width:5px;height:5px;border-radius:50%;background:#f2b84b;box-shadow:0 0 10px rgba(242,184,75,.4)}.maintenance-screen__status b{font-size:6px;letter-spacing:.14em;color:rgba(255,255,255,.2);font-weight:500}
.maintenance-screen__action{height:46px;display:inline-flex;align-items:center;gap:9px;padding:0 15px;border:1px solid rgba(var(--accent-rgb),.25);border-radius:9px;background:rgba(var(--accent-rgb),.07);font-size:7px;letter-spacing:.15em;font-weight:650}.maintenance-screen__action img{width:20px;height:20px;object-fit:contain;filter:invert(1)}
body.maintenance-mode{overflow:hidden}
body.maintenance-mode .toast-stack{display:none}

@media(max-width:1050px){
  .store-utility{grid-template-columns:1fr}
  .campaign-strip{grid-template-columns:150px minmax(0,1fr) 135px}
}
@media(max-width:700px){
  .store-utility{margin-top:14px;gap:8px}
  .store-search{grid-template-columns:24px minmax(0,1fr) 28px;padding:9px}.store-search__copy{display:none}
  .campaign-strip{grid-template-columns:1fr;padding:11px;gap:9px}.campaign-strip__copy{display:grid;grid-template-columns:1fr auto;align-items:center}.campaign-strip__copy>small{grid-column:1/-1}.campaign-strip__status{padding:0;border-left:0}.campaign-strip__entry{grid-template-columns:minmax(0,1fr) 72px}
  .toast-stack{right:10px;top:calc(var(--topbar-height) + 10px);width:calc(100vw - 20px)}
  .maintenance-screen__panel{padding:25px 20px}.maintenance-screen__status{align-items:flex-start;flex-direction:column}.maintenance-screen h2{font-size:48px}
}

/* Step 33 - minimal glowing round cursor */
html,
body{
  cursor:var(--cursor-default);
}
a,
button,
[role="button"],
label,
summary,
select,
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="checkbox"],
input[type="radio"],
input[type="range"],
.store-card,
.gallery-thumb,
.rule-category,
.faq-item,
.bulletin-item,
.update-item{
  cursor:var(--cursor-pointer);
}
input[type="text"],
input[type="search"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea,
[contenteditable="true"]{
  cursor:text;
}


/* Step 34 - favorites, notification center, campaign timer & micro transitions */
.notification-center{position:relative;flex:0 0 auto}
.notification-toggle{position:relative;width:38px;height:38px;padding:0;border:1px solid rgba(255,255,255,.065);border-radius:9px;background:rgba(255,255,255,.014);display:grid;place-items:center;color:#fff;transition:.18s ease}
.notification-toggle:hover,.notification-center.open .notification-toggle{border-color:rgba(var(--accent-rgb),.22);background:rgba(var(--accent-rgb),.045)}
.notification-bell{position:relative;width:16px;height:17px;display:block}
.notification-bell i{position:absolute;left:3px;top:2px;width:10px;height:11px;border:1.5px solid rgba(255,255,255,.72);border-radius:7px 7px 4px 4px;border-bottom-color:transparent}
.notification-bell i:after{content:"";position:absolute;left:-2px;bottom:-2px;width:12px;height:1.5px;border-radius:2px;background:rgba(255,255,255,.72)}
.notification-bell b{position:absolute;left:7px;bottom:0;width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.72)}
.notification-count{position:absolute;right:-4px;top:-4px;min-width:17px;height:17px;padding:0 4px;border:2px solid rgba(8,8,8,.92);border-radius:999px;background:var(--accent);display:grid;place-items:center;color:#080808;font-size:8px;font-weight:750;line-height:1;box-shadow:0 0 12px rgba(var(--accent-rgb),.25)}
.notification-count[hidden]{display:none}
.notification-panel{position:absolute;right:0;top:46px;z-index:410;width:330px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(9,9,9,.86);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:0 22px 60px rgba(0,0,0,.38);opacity:0;visibility:hidden;transform:translateY(-6px) scale(.985);transform-origin:top right;pointer-events:none;transition:.18s ease}
.notification-center.open .notification-panel{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.notification-panel__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 7px 11px;border-bottom:1px solid rgba(255,255,255,.055)}
.notification-panel__head small{display:block;color:rgba(255,255,255,.28);font-size:8px;letter-spacing:.2em}.notification-panel__head strong{display:block;margin-top:3px;font-size:13px;font-weight:600}.notification-panel__head button{padding:6px 8px;border:0;border-radius:6px;background:rgba(255,255,255,.025);color:rgba(255,255,255,.38);font-size:7px;letter-spacing:.13em}.notification-panel__head button:hover{color:#fff;background:rgba(var(--accent-rgb),.06)}
.notification-list{display:grid;gap:2px;padding:5px 0;max-height:320px;overflow:auto}.notification-list::-webkit-scrollbar{width:3px}.notification-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:5px}
.notification-item{position:relative;width:100%;display:grid;grid-template-columns:7px minmax(0,1fr) auto;gap:10px;align-items:start;padding:11px 9px;border:0;border-radius:9px;background:transparent;text-align:left;color:#fff;transition:.16s ease}.notification-item:hover{background:rgba(255,255,255,.026)}.notification-item.is-unread{background:linear-gradient(90deg,rgba(var(--accent-rgb),.04),transparent)}
.notification-item__dot{width:6px;height:6px;margin-top:5px;border-radius:50%;background:rgba(255,255,255,.16)}.notification-item.is-unread .notification-item__dot{background:var(--accent);box-shadow:0 0 10px rgba(var(--accent-rgb),.38)}
.notification-item__copy{min-width:0}.notification-item__copy small{display:block;margin-bottom:4px;color:rgba(255,255,255,.28);font-size:7px;letter-spacing:.15em}.notification-item.is-unread .notification-item__copy small{color:rgba(var(--accent-rgb),.72)}.notification-item__copy strong{display:block;font-size:11px;line-height:1.28;font-weight:600}.notification-item__copy p{margin:4px 0 0;color:rgba(255,255,255,.34);font-size:9px;line-height:1.45}.notification-item time{padding-top:1px;color:rgba(255,255,255,.18);font-size:7px;white-space:nowrap}
.notification-panel__foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 7px 4px;border-top:1px solid rgba(255,255,255,.05)}.notification-panel__foot span{display:flex;align-items:center;gap:6px;color:rgba(255,255,255,.30);font-size:7px;letter-spacing:.13em}.notification-panel__foot span i{width:5px;height:5px;border-radius:50%;background:#35d977}.notification-panel__foot small{color:rgba(255,255,255,.18);font-size:7px}

.store-category--favorites .category-heart{position:relative;width:14px;height:12px;opacity:.42;transform:rotate(-45deg);background:currentColor;border-radius:2px 0 0 2px}
.store-category--favorites .category-heart:before,.store-category--favorites .category-heart:after{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:currentColor}.store-category--favorites .category-heart:before{top:-6px;left:0}.store-category--favorites .category-heart:after{left:6px;top:0}
.store-category--favorites.active .category-heart{color:var(--accent);opacity:.9}
.store-card__favorite{position:absolute;right:10px;top:10px;z-index:5;width:32px;height:32px;padding:0;border:1px solid rgba(255,255,255,.09);border-radius:9px;background:rgba(7,7,7,.48);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;place-items:center;transition:.18s ease}
.favorite-heart{position:relative;width:11px;height:10px;display:block;transform:rotate(-45deg);background:rgba(255,255,255,.52);border-radius:2px 0 0 2px;transition:.18s ease}.favorite-heart:before,.favorite-heart:after{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:inherit}.favorite-heart:before{top:-5px;left:0}.favorite-heart:after{left:5px;top:0}
.store-card__favorite:hover{border-color:rgba(var(--accent-rgb),.30);background:rgba(var(--accent-rgb),.075)}.store-card.is-favorite .store-card__favorite{border-color:rgba(var(--accent-rgb),.30);background:rgba(var(--accent-rgb),.08)}.store-card.is-favorite .favorite-heart,.product-modal__favorite.active .favorite-heart{background:var(--accent);filter:drop-shadow(0 0 4px rgba(var(--accent-rgb),.35))}
.product-modal__actions{display:flex;align-items:center;gap:8px}.product-modal__favorite{height:42px;padding:0 12px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(255,255,255,.02);display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.52);transition:.18s ease}.product-modal__favorite .favorite-heart{width:10px;height:9px}.product-modal__favorite b{font-size:7px;letter-spacing:.14em}.product-modal__favorite:hover,.product-modal__favorite.active{border-color:rgba(var(--accent-rgb),.25);color:#fff;background:rgba(var(--accent-rgb),.045)}

.campaign-countdown{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:8px 10px;border:1px solid rgba(var(--accent-rgb),.15);border-radius:8px;background:rgba(var(--accent-rgb),.04)}.campaign-countdown[hidden]{display:none}.campaign-countdown small{color:rgba(255,255,255,.30);font-size:6px;letter-spacing:.16em}.campaign-countdown strong{color:var(--accent);font-size:11px;font-variant-numeric:tabular-nums;letter-spacing:.08em;text-shadow:0 0 12px rgba(var(--accent-rgb),.18)}

.page-transition{position:fixed;left:50%;top:calc(var(--topbar-height) + 18px);z-index:720;min-width:160px;height:42px;padding:0 13px 0 8px;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:rgba(9,9,9,.78);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:1fr 2px;column-gap:9px;align-items:center;opacity:0;visibility:hidden;transform:translate(-50%,-8px) scale(.98);pointer-events:none;transition:opacity .14s ease,transform .18s ease,visibility .18s ease;box-shadow:0 14px 34px rgba(0,0,0,.26)}.page-transition.show{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1)}.page-transition__mark{grid-row:1;width:29px;height:29px;border-radius:8px;background:rgba(255,255,255,.025);display:grid;place-items:center}.page-transition__mark img{width:19px;height:19px;object-fit:contain}.page-transition__copy{grid-row:1;display:flex;flex-direction:column;gap:2px}.page-transition__copy span{font-size:8px;letter-spacing:.18em;color:rgba(255,255,255,.62)}.page-transition__copy b{font-size:6px;letter-spacing:.16em;color:rgba(255,255,255,.26)}.page-transition__line{grid-column:1/-1;grid-row:2;position:relative;height:1px;overflow:hidden;background:rgba(255,255,255,.05)}.page-transition__line:after{content:"";position:absolute;inset:0 auto 0 0;width:46%;background:var(--accent);box-shadow:0 0 10px rgba(var(--accent-rgb),.4);animation:pageTransitionLine .55s ease-in-out infinite alternate}@keyframes pageTransitionLine{from{transform:translateX(-90%)}to{transform:translateX(210%)}}
.product-modal.open .product-modal__dialog,.news-modal.open .news-modal__dialog{animation:microModalIn .22s cubic-bezier(.2,.8,.2,1) both}@keyframes microModalIn{from{opacity:0;transform:translateY(9px) scale(.985)}to{opacity:1;transform:none}}

@media(max-width:1180px){.notification-panel{right:-55px}.notification-toggle{width:36px;height:36px}}
@media(max-width:700px){.notification-panel{position:fixed;right:10px;left:10px;top:calc(var(--topbar-height) + 8px);width:auto}.notification-toggle{width:36px;height:36px}.notification-panel__foot small{display:none}.campaign-countdown{grid-column:1/-1}.product-modal__actions{width:100%}.product-modal__favorite{flex:0 0 auto}.product-modal__buy{flex:1}.page-transition{top:calc(var(--topbar-height) + 10px)}}

/* Step 34 layout fixes */
@media(min-width:1181px){
  .campaign-strip{grid-template-columns:150px minmax(190px,1fr) 132px 92px;gap:9px}
}
.store-card.has-discount:before{left:10px;right:auto}
.store-category--favorites{grid-template-columns:22px minmax(0,1fr) 15px}
@media(max-width:700px){
  .store-category--favorites{grid-template-columns:25px minmax(0,1fr) 14px}
}

/* Step 35 - management access */
.admin-mini{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.065);border-radius:9px;background:rgba(255,255,255,.018);transition:.18s ease;flex:0 0 38px}
.admin-mini img{width:17px;height:17px;object-fit:contain;filter:var(--accent-icon-filter);opacity:.62}
.admin-mini:hover{border-color:rgba(var(--accent-rgb),.28);background:rgba(var(--accent-rgb),.055)}.admin-mini:hover img{opacity:1;filter:var(--accent-icon-filter);height:100%;object-fit:cover;display:block}
.staff-line__state.is-offline{color:rgba(255,255,255,.28)}.staff-line__state.is-offline i{background:#777;box-shadow:none}
@media(max-width:700px){.admin-mini{width:36px;height:36px;flex-basis:36px}.admin-mini img{width:16px;height:16px}}

.admin-mini{padding:0;color:#fff;cursor:pointer}.admin-frame-shell{position:fixed;inset:0;z-index:1000;background:#070707;opacity:0;visibility:hidden;pointer-events:none;transition:.2s ease}.admin-frame-shell.open{opacity:1;visibility:visible;pointer-events:auto}.admin-frame-shell iframe{width:100%;height:100%;border:0;background:#070707}.admin-frame-close{position:absolute;right:14px;top:14px;z-index:3;width:38px;height:38px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(8,8,8,.76);color:#fff;font-size:24px;cursor:pointer;backdrop-filter:blur(14px)}body.admin-frame-open{overflow:hidden}


/* Step 38 - maintenance admin escape */
.maintenance-screen__actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.maintenance-screen__admin{font-family:inherit;cursor:pointer;color:#fff}
.maintenance-screen__admin img{filter:var(--accent-icon-filter);opacity:.8}
.maintenance-screen__admin:hover{border-color:rgba(var(--accent-rgb),.42);background:rgba(var(--accent-rgb),.12)}
.admin-frame-shell{z-index:12050 !important}
.admin-frame-close{z-index:12060 !important}
body.maintenance-mode.admin-frame-open .maintenance-screen{pointer-events:none}
@media(max-width:700px){.maintenance-screen__actions{align-items:stretch;flex-direction:column}.maintenance-screen__actions .maintenance-screen__action{justify-content:center;width:100%}}


/* Step 41 - theme-aware icon color system */
.principle-top img,
.store-title img,
.announcements-titleicon img,
.bulletin-card__icon img,
.team-heading__icon img,
.team-command__overview-icon img,
.update-item__tag img,
.mini-section-head__icon img,
.news-column__head img,
.mini-team-head__icon img,
.news-modal__icon img,
.admin-mini img,
.maintenance-screen__admin img,
.music-volume-button .volume-icon-image{
  filter:var(--accent-icon-filter) !important;
  transition:filter .22s ease,opacity .22s ease,transform .22s ease;
}
.admin-mini:hover img,
.store-title img,
.music-player.volume-open .music-volume-button .volume-icon-image{
  filter:var(--accent-icon-filter) drop-shadow(0 0 5px rgba(var(--accent-rgb),.28)) !important;
}


/* Step 42 - cleaner section headers and reliable page composition */
.mini-team-head,
.gallery-heading,
.rules-heading{
  grid-template-columns:minmax(0,1fr) !important;
  gap:0 !important;
}
.mini-team-head{align-items:center;margin-bottom:16px}
.gallery-heading{align-items:end;margin-bottom:30px}
.rules-heading{align-items:end;margin-bottom:38px}
.mini-team-head>p,.gallery-heading>p,.rules-heading>p{display:none !important}

/* Step 42 - hollow circular custom cursors */
html,body{cursor:var(--cursor-default)}


/* Step 43 - Theme Pro + pinned news + social footer */
:root{--pro-blur:16px;--pro-glow-alpha:.28;--pro-border-alpha:.08;--pro-navbar-alpha:.72;--pro-glass-alpha:.24;--pro-radius:12px}
.topbar{background:rgba(7,7,7,var(--pro-navbar-alpha))!important;-webkit-backdrop-filter:blur(var(--pro-blur)) saturate(120%)!important;backdrop-filter:blur(var(--pro-blur)) saturate(120%)!important}
.about-copy-block,.news-column,.staff-directory,.rule-panel,.rules-categories,.store-card,.store-toolbar,.campaign-strip,.product-modal__dialog,.news-modal__dialog,.site-footer__grid,.maintenance-screen__panel{border-color:rgba(255,255,255,var(--pro-border-alpha))!important;border-radius:var(--pro-radius)!important;-webkit-backdrop-filter:blur(var(--pro-blur))!important;backdrop-filter:blur(var(--pro-blur))!important;background-color:rgba(7,7,7,var(--pro-glass-alpha))!important;box-shadow:0 12px 42px rgba(var(--accent-rgb),var(--pro-glow-soft))}
.news-row--pinned{background:linear-gradient(90deg,rgba(var(--accent-rgb),.08),rgba(255,255,255,.012))!important;box-shadow:inset 2px 0 0 var(--accent)}
.news-row--pinned .news-row__copy>div small{color:var(--accent)!important}
.footer-social-chip{gap:7px!important}.footer-social-mark{width:21px;height:21px;display:grid;place-items:center;border:1px solid rgba(var(--accent-rgb),.20);border-radius:7px;background:rgba(var(--accent-rgb),.05);color:var(--accent);font-size:7px;font-weight:800;letter-spacing:.04em;box-shadow:0 0 14px rgba(var(--accent-rgb),var(--pro-glow-chip))}

/* Step 44 - motion system */
:root{--bg-parallax:0px}
body:before{background-position:center,center,center calc(50% + var(--bg-parallax))!important}

/* Smooth theme/color changes without making layout properties sluggish. */
body :where(a,button,.btn,.nav,.topbar,.store-card,.rule-category,.rule-panel,.news-row,.update-row,.staff-line,.principle,.notification-toggle,.campaign-strip,.site-footer,.product-modal__dialog,.news-modal__dialog){
  transition-property:color,background-color,border-color,box-shadow,opacity,transform,filter;
  transition-duration:.28s;
  transition-timing-function:cubic-bezier(.2,.8,.2,1);
}

/* Hero stagger */
.hero .eyebrow,.hero h1,.hero-copy>p,.hero-actions{will-change:transform,opacity}
.hero.hero-animate .eyebrow{animation:heroMotionIn .46s .03s cubic-bezier(.18,.8,.24,1) both}
.hero.hero-animate h1{animation:heroMotionIn .54s .10s cubic-bezier(.18,.8,.24,1) both}
.hero.hero-animate .hero-copy>p{animation:heroMotionIn .48s .18s cubic-bezier(.18,.8,.24,1) both}
.hero.hero-animate .hero-actions{animation:heroMotionIn .48s .25s cubic-bezier(.18,.8,.24,1) both}
@keyframes heroMotionIn{from{opacity:0;transform:translateY(16px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}

/* Section / footer reveal */
.reveal-item{opacity:0;transform:translateY(18px);filter:blur(2px);transition:opacity .54s ease var(--reveal-delay,0ms),transform .54s cubic-bezier(.2,.8,.2,1) var(--reveal-delay,0ms),filter .54s ease var(--reveal-delay,0ms)}
.reveal-item.is-visible{opacity:1;transform:none;filter:none}
.site-footer__grid.reveal-item.is-visible>*{animation:footerPieceIn .42s cubic-bezier(.2,.8,.2,1) both}
.site-footer__grid.reveal-item.is-visible>*:nth-child(2){animation-delay:.06s}.site-footer__grid.reveal-item.is-visible>*:nth-child(3){animation-delay:.12s}
@keyframes footerPieceIn{from{opacity:.15;transform:translateY(10px)}to{opacity:1;transform:none}}

/* One animated navbar indicator instead of separate jumping underlines. */
.nav{position:relative;--nav-active-x:0px;--nav-active-w:0px;--nav-active-opacity:0}
.nav>a.active:after{opacity:0!important}
.nav:after{content:"";position:absolute;left:0;bottom:-1px;width:var(--nav-active-w);height:2px;opacity:var(--nav-active-opacity);transform:translateX(var(--nav-active-x));background:var(--accent);box-shadow:0 0 14px rgba(var(--accent-rgb),.5);transition:transform .32s cubic-bezier(.2,.8,.2,1),width .32s cubic-bezier(.2,.8,.2,1),opacity .18s ease;background-color .3s ease,box-shadow .3s ease;pointer-events:none}

/* Page transition: softer blur/fade. */
.page-transition{transition:opacity .18s ease,transform .24s cubic-bezier(.2,.8,.2,1),visibility .18s ease,filter .22s ease}
.page-transition.show{filter:blur(0)}
.page-transition:not(.show){filter:blur(3px)}
.page-transition__mark img{animation:transitionMark 1.1s ease-in-out infinite alternate}
@keyframes transitionMark{from{transform:scale(.94);opacity:.72}to{transform:scale(1.04);opacity:1}}

/* Card tilt/glow follows pointer through CSS variables set by JS. */
.motion-card{--mx:50%;--my:50%;transform-style:preserve-3d;will-change:transform}
.store-card.motion-card{background:radial-gradient(circle at var(--mx) var(--my),rgba(var(--accent-rgb),.095),transparent 34%),linear-gradient(135deg,rgba(12,12,12,.30),rgba(5,5,5,.10))}
.principle.motion-card{background-image:radial-gradient(circle at var(--mx) var(--my),rgba(var(--accent-rgb),.08),transparent 38%)}

/* Gallery swap */
.gallery-main img{transition:opacity .28s ease,transform .42s cubic-bezier(.2,.8,.2,1),filter .28s ease!important}
.gallery-main.is-switching img{opacity:.08!important;transform:scale(1.035)!important;filter:blur(2px)}
.gallery-thumb{transition:transform .24s cubic-bezier(.2,.8,.2,1),border-color .24s ease,box-shadow .24s ease}
.gallery-thumb:hover{transform:translateY(-2px) scale(1.012);border-color:rgba(var(--accent-rgb),.28);box-shadow:0 12px 28px rgba(var(--accent-rgb),.08)}

/* Announcement new/status pulse */
.news-row__copy small,.update-row__version{position:relative}
.news-row__copy small:before{content:"";display:inline-block;width:5px;height:5px;margin-right:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px rgba(var(--accent-rgb),.45);animation:newsPulse 1.8s ease-in-out infinite}
@keyframes newsPulse{0%,100%{opacity:.55;transform:scale(.82)}50%{opacity:1;transform:scale(1.08)}}

/* Notification bell only moves once when something new arrives. */
.notification-toggle.notification-ping{animation:notificationPing .78s cubic-bezier(.36,.07,.19,.97)}
@keyframes notificationPing{0%,100%{transform:rotate(0)}18%{transform:rotate(10deg)}34%{transform:rotate(-9deg)}50%{transform:rotate(7deg)}66%{transform:rotate(-4deg)}82%{transform:rotate(2deg)}}

/* Favorite and discount micro-interactions */
.favorite-pop{animation:favoritePop .4s cubic-bezier(.2,1.5,.35,1)}
@keyframes favoritePop{0%{transform:scale(1)}42%{transform:scale(1.22)}72%{transform:scale(.94)}100%{transform:scale(1)}}
.price-swap .store-price-old,.price-swap .product-price-old{animation:oldPriceOut .34s ease both}
.price-swap .store-price-new,.price-swap{animation:newPriceIn .4s cubic-bezier(.2,.8,.2,1) both}
@keyframes oldPriceOut{from{opacity:0;transform:translateY(-4px)}to{opacity:.55;transform:none}}
@keyframes newPriceIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.campaign-countdown--urgent{animation:countdownUrgent 1s ease-in-out infinite alternate;border-color:rgba(var(--accent-rgb),.34)!important}
@keyframes countdownUrgent{from{box-shadow:0 0 0 rgba(var(--accent-rgb),0)}to{box-shadow:0 0 18px rgba(var(--accent-rgb),.14)}}

/* Modals: blur + scale, with backdrop fade. */
.product-modal__backdrop,.news-modal__backdrop{opacity:0;transition:opacity .24s ease,backdrop-filter .24s ease,-webkit-backdrop-filter .24s ease}
.product-modal.open .product-modal__backdrop,.news-modal.open .news-modal__backdrop{opacity:1}
.product-modal__dialog,.news-modal__dialog{filter:blur(3px);opacity:0;transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .22s ease,filter .25s ease!important}
.product-modal.open .product-modal__dialog,.news-modal.open .news-modal__dialog{opacity:1;filter:none}

/* Open-player micro visualizer */
.music-player__meta{position:relative;padding-right:24px}
.music-open-wave{position:absolute;right:1px;top:3px;height:12px;display:flex;align-items:center;gap:2px;opacity:.45}
.music-open-wave i{display:block;width:2px;height:4px;border-radius:2px;background:var(--accent);box-shadow:0 0 6px rgba(var(--accent-rgb),.25);animation:openWave .58s ease-in-out infinite alternate;animation-play-state:paused}
.music-open-wave i:nth-child(2){height:9px;animation-delay:.12s}.music-open-wave i:nth-child(3){height:6px;animation-delay:.23s}.music-open-wave i:nth-child(4){height:10px;animation-delay:.34s}
.music-player.playing .music-open-wave i{animation-play-state:running}
@keyframes openWave{from{transform:scaleY(.55);opacity:.35}to{transform:scaleY(1);opacity:1}}

/* Rule panel directional transition */
.rule-panel{transition:opacity .18s ease,transform .2s cubic-bezier(.2,.8,.2,1),filter .18s ease}
.rule-panel.rule-panel--leaving{opacity:0;transform:translateX(-10px);filter:blur(1px)}
.rule-panel.rule-panel--entering{opacity:0;transform:translateX(10px);filter:blur(1px)}
.rule-panel.active:not(.rule-panel--entering){opacity:1;transform:none;filter:none}

/* Animated theme-aware hollow cursor. */
@media (hover:hover) and (pointer:fine){
  html,body,a,button,[role="button"],summary,label,select,input[type="button"],input[type="submit"],input[type="reset"],input[type="checkbox"],input[type="radio"],input[type="range"],.store-card,.gallery-thumb,.rule-category,.faq-item,.news-row,.update-row{cursor:none!important}
  input[type="text"],input[type="search"],input[type="email"],input[type="password"],input[type="number"],textarea,[contenteditable="true"]{cursor:text!important}
  .satuqbx-cursor{position:fixed;z-index:99999;width:15px;height:15px;margin:-7.5px 0 0 -7.5px;border:1.5px solid rgba(255,255,255,.95);border-radius:50%;background:transparent;box-shadow:0 0 9px rgba(255,255,255,.48),0 0 2px rgba(255,255,255,.8);pointer-events:none;transition:width .16s ease,height .16s ease,margin .16s ease,border-color .16s ease,box-shadow .16s ease,opacity .12s ease,transform .1s ease;will-change:left,top,transform}
  .satuqbx-cursor.is-active{width:19px;height:19px;margin:-9.5px 0 0 -9.5px;border-color:var(--accent);box-shadow:0 0 13px rgba(var(--accent-rgb),.68),0 0 3px rgba(var(--accent-rgb),.95)}
  .satuqbx-cursor.is-down{transform:scale(.72)}
  .satuqbx-cursor.is-hidden{opacity:0}
}

@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal-item{opacity:1!important;transform:none!important;filter:none!important}
}
@media(min-width:1051px){.nav{position:relative}}
@media(max-width:1050px){.nav{position:fixed}.nav:after{display:none!important}}


/* Step 46 - fixed icon-only footer social bar and balanced final footer */
.site-footer{
  margin-top:72px;
  padding:38px 0 0;
}
.site-footer__grid{
  grid-template-columns:minmax(240px,.9fr) minmax(320px,1.15fr) minmax(250px,.95fr);
  gap:clamp(28px,3vw,52px);
  align-items:start;
  padding:0 0 34px;
}
.site-footer__brand,
.site-footer__faq,
.site-footer__contact{min-width:0}
.site-footer__brand>p,
.site-footer__contact>p{
  font-size:12px;
  line-height:1.72;
  color:rgba(255,255,255,.40);
}
.site-footer__social{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start;
  gap:10px!important;
  margin-top:20px!important;
  flex-wrap:nowrap!important;
  min-height:42px;
}
.footer-social-icon{
  flex:0 0 40px;
  width:40px!important;
  height:40px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.075)!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.018)!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  text-indent:0!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease!important;
}
.footer-social-icon:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(var(--accent-rgb),.34)!important;
  background:rgba(var(--accent-rgb),.075)!important;
  box-shadow:0 0 18px rgba(var(--accent-rgb),.16),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.social-mask{
  display:block!important;
  width:19px!important;
  height:19px!important;
  margin:0!important;
  background:rgb(var(--accent-rgb))!important;
  opacity:.92!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
  transition:transform .22s ease,filter .22s ease,opacity .22s ease!important;
}
.footer-social-icon:hover .social-mask{
  opacity:1!important;
  transform:scale(1.08)!important;
  filter:drop-shadow(0 0 7px rgba(var(--accent-rgb),.45))!important;
}
.social-mask--discord{-webkit-mask-image:url('assets/discord.webp')!important;mask-image:url('assets/discord.webp')!important}
.social-mask--instagram{-webkit-mask-image:url('assets/social-instagram.png')!important;mask-image:url('assets/social-instagram.png')!important}
.social-mask--youtube{-webkit-mask-image:url('assets/social-youtube.png')!important;mask-image:url('assets/social-youtube.png')!important}
.social-mask--tiktok{-webkit-mask-image:url('assets/social-tiktok.png')!important;mask-image:url('assets/social-tiktok.png')!important}
/* neutralize the old text-chip CMS styles if cached markup ever appears */
.site-footer__social .footer-chip,
.site-footer__social .footer-social-chip{
  font-size:0!important;
  width:40px!important;
  height:40px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
}
.site-footer__bottom{
  min-height:58px!important;
  padding:0 2px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-top:1px solid rgba(255,255,255,.065)!important;
  color:rgba(255,255,255,.32)!important;
  font-size:9px!important;
  line-height:1.4!important;
  letter-spacing:.14em!important;
  text-align:center!important;
  white-space:normal!important;
  text-transform:uppercase!important;
}
.site-footer__bottom span{display:block;max-width:100%}
@media(max-width:980px){
  .site-footer__grid{grid-template-columns:1fr 1fr;gap:32px}
  .site-footer__brand{grid-column:1/-1}
}
@media(max-width:700px){
  .site-footer{margin-top:52px;padding-top:30px}
  .site-footer__grid{grid-template-columns:1fr;gap:30px;padding-bottom:26px}
  .site-footer__brand{grid-column:auto}
  .site-footer__social{flex-wrap:wrap!important}
  .site-footer__bottom{min-height:54px!important;padding:13px 8px!important;font-size:8px!important;letter-spacing:.10em!important}
}


/* Step 47 - footer final fix with guaranteed SVG icons */
.site-footer{
  margin-top:72px !important;
  padding:40px clamp(18px,3.2vw,34px) 0 !important;
}
.site-footer__grid{
  width:min(1200px,100%) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr) minmax(0,.95fr) !important;
  gap:clamp(28px,3vw,48px) !important;
  align-items:start !important;
  padding:0 0 34px !important;
  box-sizing:border-box !important;
}
.site-footer__brand,.site-footer__faq,.site-footer__contact{min-width:0 !important;}
.site-footer__heading{margin-bottom:14px !important;}
.site-footer__heading span{display:block;font-size:12px !important;letter-spacing:.18em !important;}
.site-footer__heading small{display:block;margin-top:6px;font-size:10px !important;letter-spacing:.14em !important;color:rgba(255,255,255,.30) !important;}
.site-footer__brand>p,.site-footer__contact>p{margin-top:14px !important;font-size:13px !important;line-height:1.72 !important;color:rgba(255,255,255,.42) !important;max-width:42ch;}
.site-footer__social{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  margin-top:20px !important;
  min-height:44px !important;
}
.footer-social-icon,.site-footer__social .footer-chip,.site-footer__social .footer-social-chip{
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  min-height:44px !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:12px !important;
  background:rgba(255,255,255,.018) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025) !important;
  overflow:hidden !important;
  color:rgb(var(--accent-rgb)) !important;
  font-size:0 !important;
  line-height:0 !important;
  text-decoration:none !important;
  transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease !important;
}
.footer-social-icon:hover{
  transform:translateY(-2px) !important;
  border-color:rgba(var(--accent-rgb),.34) !important;
  background:rgba(var(--accent-rgb),.075) !important;
  box-shadow:0 0 18px rgba(var(--accent-rgb),.16), inset 0 1px 0 rgba(255,255,255,.03) !important;
}
.footer-social-icon svg{
  width:19px !important;
  height:19px !important;
  display:block !important;
  color:inherit !important;
  filter:drop-shadow(0 0 5px rgba(var(--accent-rgb),.22));
  transition:transform .22s ease,filter .22s ease,opacity .22s ease;
}
.footer-social-icon:hover svg{
  transform:scale(1.08) !important;
  filter:drop-shadow(0 0 8px rgba(var(--accent-rgb),.42));
}
.site-footer__social .social-mask{display:none !important;}
.site-footer__faq details{padding-right:4px !important;}
.site-footer__faq summary,.footer-links a,.footer-contact small,.footer-contact b{word-break:normal !important;}
.footer-links{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px 14px !important;margin-top:16px !important;}
.footer-contact{margin-top:16px !important;}
.site-footer__bottom{
  width:min(1200px,100%) !important;
  margin:0 auto !important;
  min-height:60px !important;
  padding:16px 10px 18px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-top:1px solid rgba(255,255,255,.065) !important;
  color:rgba(255,255,255,.34) !important;
  font-size:10px !important;
  letter-spacing:.14em !important;
  line-height:1.5 !important;
  text-transform:uppercase !important;
  text-align:center !important;
  box-sizing:border-box !important;
}
.site-footer__bottom span{display:block !important;max-width:100% !important;white-space:normal !important;}
@media (max-width:980px){
  .site-footer{padding-left:20px !important;padding-right:20px !important;}
  .site-footer__grid{grid-template-columns:1fr 1fr !important;gap:28px !important;}
  .site-footer__brand{grid-column:1 / -1 !important;}
}
@media (max-width:700px){
  .site-footer{margin-top:54px !important;padding:30px 16px 0 !important;}
  .site-footer__grid{grid-template-columns:1fr !important;gap:26px !important;padding-bottom:24px !important;}
  .site-footer__bottom{min-height:52px !important;padding:14px 8px 16px !important;font-size:9px !important;letter-spacing:.11em !important;}
}


/* Step 48 — definitive footer repair */
.site-footer{
  box-sizing:border-box !important;
  width:100% !important;
  margin:76px auto 0 !important;
  padding:42px 0 0 !important;
}
.site-footer__grid,
.site-footer__bottom{
  box-sizing:border-box !important;
  width:min(1120px,calc(100% - 80px)) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.site-footer__grid{
  display:grid !important;
  grid-template-columns:minmax(0,.88fr) minmax(330px,1.18fr) minmax(260px,.94fr) !important;
  gap:48px !important;
  align-items:start !important;
  padding:0 0 38px !important;
}
.site-footer__brand,
.site-footer__faq,
.site-footer__contact{
  min-width:0 !important;
  padding:0 !important;
}
.site-footer__logo{max-width:100% !important;}
.site-footer__brand>p,
.site-footer__contact>p{
  max-width:36ch !important;
  margin:16px 0 0 !important;
  color:rgba(255,255,255,.44) !important;
  font-size:12px !important;
  line-height:1.75 !important;
  letter-spacing:0 !important;
}
.site-footer__heading{
  margin:1px 0 16px !important;
}
.site-footer__heading>span{
  display:block !important;
  color:rgba(255,255,255,.78) !important;
  font-size:12px !important;
  line-height:1.2 !important;
  letter-spacing:.16em !important;
}
.site-footer__heading>small{
  display:block !important;
  margin-top:6px !important;
  color:rgba(255,255,255,.28) !important;
  font-size:9px !important;
  line-height:1.2 !important;
  letter-spacing:.14em !important;
}
.site-footer__social{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:11px !important;
  flex-wrap:wrap !important;
  min-height:44px !important;
  margin:21px 0 0 !important;
}
.site-footer__social .footer-social-icon{
  box-sizing:border-box !important;
  flex:0 0 42px !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  min-height:42px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.075) !important;
  border-radius:11px !important;
  background:rgba(255,255,255,.018) !important;
  color:transparent !important;
  font-size:0 !important;
  line-height:0 !important;
  text-indent:0 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025) !important;
  transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease !important;
}
.site-footer__social .footer-social-icon:hover{
  transform:translateY(-2px) !important;
  border-color:rgba(var(--accent-rgb),.38) !important;
  background:rgba(var(--accent-rgb),.075) !important;
  box-shadow:0 0 18px rgba(var(--accent-rgb),.17),inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.site-footer__social .footer-social-img{
  display:block !important;
  width:19px !important;
  height:19px !important;
  max-width:19px !important;
  max-height:19px !important;
  object-fit:contain !important;
  opacity:.94 !important;
  filter:var(--accent-icon-filter) drop-shadow(0 0 5px rgba(var(--accent-rgb),.20)) !important;
  transition:transform .2s ease,filter .2s ease,opacity .2s ease !important;
}
.site-footer__social .footer-social-icon:hover .footer-social-img{
  transform:scale(1.08) !important;
  opacity:1 !important;
  filter:var(--accent-icon-filter) drop-shadow(0 0 8px rgba(var(--accent-rgb),.42)) !important;
}
.site-footer__social .social-mask,
.site-footer__social .footer-social-mark{
  display:none !important;
}
.site-footer__faq details{
  padding:0 !important;
}
.site-footer__faq summary{
  min-height:48px !important;
  padding:0 2px !important;
  gap:18px !important;
  font-size:11px !important;
  line-height:1.45 !important;
}
.site-footer__faq details p{
  margin:0 0 15px !important;
  padding-right:12px !important;
  font-size:10px !important;
  line-height:1.72 !important;
}
.footer-contact{
  box-sizing:border-box !important;
  width:100% !important;
  margin-top:17px !important;
}
.footer-links{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:11px 18px !important;
  margin-top:18px !important;
}
.footer-links a{
  min-width:0 !important;
  font-size:9px !important;
  line-height:1.4 !important;
  white-space:normal !important;
}
.site-footer__bottom{
  min-height:64px !important;
  padding:18px 20px 20px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-top:1px solid rgba(255,255,255,.065) !important;
  color:rgba(255,255,255,.32) !important;
  font-size:9px !important;
  line-height:1.5 !important;
  letter-spacing:.12em !important;
  text-align:center !important;
  text-transform:uppercase !important;
  white-space:normal !important;
}
.site-footer__bottom span{
  display:block !important;
  max-width:100% !important;
  margin:0 auto !important;
  white-space:normal !important;
}
@media(max-width:1050px){
  .site-footer__grid,
  .site-footer__bottom{width:min(900px,calc(100% - 56px)) !important;}
  .site-footer__grid{grid-template-columns:1fr 1fr !important;gap:36px 42px !important;}
  .site-footer__brand{grid-column:1 / -1 !important;}
  .site-footer__brand>p{max-width:60ch !important;}
}
@media(max-width:700px){
  .site-footer{margin-top:56px !important;padding-top:30px !important;}
  .site-footer__grid,
  .site-footer__bottom{width:calc(100% - 32px) !important;}
  .site-footer__grid{grid-template-columns:1fr !important;gap:30px !important;padding-bottom:26px !important;}
  .site-footer__brand{grid-column:auto !important;}
  .site-footer__social{gap:10px !important;}
  .site-footer__bottom{min-height:56px !important;padding:16px 12px 18px !important;font-size:8px !important;letter-spacing:.09em !important;}
}


/* Step 50 — hard stop all page-level horizontal overflow */
html{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
  overflow-x:clip !important;
}
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
  overflow-x:clip !important;
  position:relative;
}
img,svg,video,canvas{max-width:100%;}
.page-shell,
.hero,
.announcements-section,
.about-section,
.gallery-section,
.rules-section,
.store-view,
.site-footer,
.site-footer__grid,
.site-footer__bottom{
  max-width:100% !important;
  min-width:0 !important;
}
.page-shell{
  overflow-x:clip !important;
}
/* 100vw includes the browser scrollbar on desktop and can create a bottom x-scrollbar. */
.about-section:before{
  left:0 !important;
  right:0 !important;
  width:100% !important;
  max-width:100% !important;
  transform:none !important;
}
/* Mobile drawer must stay inside the viewport instead of hanging outside by 18px. */
@media(max-width:1120px){
  .nav.open{right:0 !important;}
}
/* Categories wrap instead of generating a horizontal scrollbar. */
@media(max-width:980px){
  .store-categories{
    overflow-x:visible !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    flex-wrap:wrap !important;
  }
  .store-category{
    min-width:0 !important;
    width:100% !important;
    flex:1 1 0 !important;
  }
}
@media(max-width:640px){
  .store-categories{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
/* Fixed floating UI cannot widen the document. */
.notification-panel,
.notification-center,
.toast-stack,
.page-transition,
.product-modal,
.news-modal,
.maintenance-screen{
  max-width:100vw !important;
}


/* Step 51 — balanced footer spacing / centered inner composition */
.site-footer{
  width:100% !important;
  margin:78px auto 0 !important;
  padding:44px 0 0 !important;
  box-sizing:border-box !important;
}
.site-footer__grid{
  width:min(1160px,calc(100% - 112px)) !important;
  max-width:1160px !important;
  margin:0 auto !important;
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-columns:minmax(220px,.9fr) minmax(330px,1.12fr) minmax(250px,.92fr) !important;
  column-gap:clamp(46px,4vw,68px) !important;
  row-gap:38px !important;
  align-items:start !important;
  padding:34px clamp(34px,3vw,46px) 38px !important;
}
.site-footer__brand,
.site-footer__faq,
.site-footer__contact{
  min-width:0 !important;
  width:100% !important;
  padding:0 !important;
  margin:0 !important;
}
.site-footer__brand{
  justify-self:start !important;
}
.site-footer__faq{
  justify-self:center !important;
}
.site-footer__contact{
  justify-self:end !important;
}
.site-footer__logo{
  margin:0 !important;
}
.site-footer__brand>p,
.site-footer__contact>p{
  margin:17px 0 0 !important;
  max-width:34ch !important;
  font-size:12px !important;
  line-height:1.78 !important;
  color:rgba(255,255,255,.44) !important;
}
.site-footer__heading{
  margin:2px 0 18px !important;
}
.site-footer__heading>span{
  font-size:12px !important;
  line-height:1.2 !important;
  letter-spacing:.16em !important;
}
.site-footer__heading>small{
  margin-top:7px !important;
  font-size:9px !important;
  line-height:1.3 !important;
  letter-spacing:.13em !important;
}
.site-footer__faq details{
  padding:0 4px !important;
}
.site-footer__faq summary{
  min-height:50px !important;
  padding:0 !important;
  gap:22px !important;
  font-size:11px !important;
  line-height:1.5 !important;
}
.site-footer__faq details p{
  margin:0 0 16px !important;
  padding:0 24px 0 0 !important;
  font-size:10px !important;
  line-height:1.72 !important;
}
.site-footer__social{
  margin-top:22px !important;
  gap:12px !important;
}
.footer-contact{
  margin-top:18px !important;
  width:100% !important;
}
.footer-links{
  margin-top:20px !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px 22px !important;
}
.footer-links a{
  font-size:9px !important;
  line-height:1.45 !important;
}
.site-footer__bottom{
  width:min(1080px,calc(100% - 144px)) !important;
  max-width:1080px !important;
  min-height:66px !important;
  margin:0 auto !important;
  padding:20px 28px 22px !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
}
.site-footer__bottom span{
  margin:0 auto !important;
  padding:0 16px !important;
  max-width:100% !important;
  font-size:9px !important;
  line-height:1.55 !important;
  letter-spacing:.12em !important;
}
@media(max-width:1100px){
  .site-footer__grid{
    width:min(920px,calc(100% - 72px)) !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    column-gap:50px !important;
    padding:32px 36px 36px !important;
  }
  .site-footer__brand{
    grid-column:1 / -1 !important;
    justify-self:stretch !important;
  }
  .site-footer__brand>p{max-width:56ch !important;}
  .site-footer__faq,.site-footer__contact{justify-self:stretch !important;}
  .site-footer__bottom{width:min(880px,calc(100% - 96px)) !important;}
}
@media(max-width:720px){
  .site-footer{
    margin-top:56px !important;
    padding-top:30px !important;
  }
  .site-footer__grid{
    width:calc(100% - 36px) !important;
    grid-template-columns:1fr !important;
    gap:30px !important;
    padding:26px 22px 30px !important;
  }
  .site-footer__brand{grid-column:auto !important;}
  .site-footer__brand,
  .site-footer__faq,
  .site-footer__contact{justify-self:stretch !important;}
  .site-footer__brand>p,
  .site-footer__contact>p{max-width:100% !important;}
  .footer-links{gap:11px 18px !important;}
  .site-footer__bottom{
    width:calc(100% - 48px) !important;
    min-height:58px !important;
    padding:17px 16px 19px !important;
  }
  .site-footer__bottom span{
    padding:0 8px !important;
    font-size:8px !important;
    letter-spacing:.09em !important;
  }
}
@media(max-width:420px){
  .site-footer__grid{
    width:calc(100% - 24px) !important;
    padding:24px 18px 27px !important;
  }
  .site-footer__bottom{width:calc(100% - 32px) !important;}
}