:root{--bg:#06101f;--panel:#0d1a2c;--panel2:#12243d;--text:#f7f9fc;--muted:#8ea2bd;--blue:#2d7dff;--line:rgba(255,255,255,.08);--success:#38d996;--danger:#ff6577;--shadow:0 20px 60px rgba(0,0,0,.35)}
*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(circle at top,#102c55 0,#06101f 34%,#040b16 100%);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;min-height:100%}body{padding-bottom:calc(82px + env(safe-area-inset-bottom));overflow-x:hidden}
button,input{font:inherit}.app-shell{max-width:520px;margin:0 auto;min-height:100vh}.topbar{position:sticky;top:0;z-index:20;padding:calc(14px + env(safe-area-inset-top)) 20px 14px;background:linear-gradient(180deg,rgba(4,11,22,.96),rgba(4,11,22,.72),transparent);backdrop-filter:blur(20px);display:flex;justify-content:space-between;align-items:center}.brand{font-weight:850;letter-spacing:.12em;font-size:13px}.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#3f8cff,#1747ad);font-weight:800;box-shadow:0 8px 24px rgba(45,125,255,.35)}
main{padding:6px 16px 22px}.hero{position:relative;overflow:hidden;border-radius:30px;padding:24px;background:linear-gradient(145deg,#1b65ff 0,#123c92 48%,#081a3b 100%);box-shadow:var(--shadow);min-height:260px}.hero:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-90px;top:-90px;background:rgba(255,255,255,.11);filter:blur(2px)}.eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#bcd2ff;font-weight:800}.hero h1{font-size:34px;line-height:1.02;margin:12px 0 8px;max-width:320px}.hero .meta{color:#dbe7ff;font-weight:650}.countdown{display:flex;gap:10px;margin:22px 0}.timebox{background:rgba(2,10,28,.28);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:11px 13px;min-width:58px;text-align:center}.timebox b{display:block;font-size:20px}.timebox span{font-size:10px;color:#c7d7f7;text-transform:uppercase}.actions{display:flex;gap:10px;position:relative;z-index:2}.btn{border:0;border-radius:15px;padding:13px 16px;font-weight:800;cursor:pointer}.btn-primary{background:#fff;color:#0c2454}.btn-dark{background:rgba(3,12,29,.48);color:#fff;border:1px solid rgba(255,255,255,.14)}
.section-title{display:flex;justify-content:space-between;align-items:end;margin:25px 4px 12px}.section-title h2{margin:0;font-size:21px}.section-title button{background:none;border:0;color:#78a9ff;font-weight:750}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.card{background:linear-gradient(180deg,rgba(18,36,61,.96),rgba(10,24,42,.96));border:1px solid var(--line);border-radius:22px;padding:17px;box-shadow:0 12px 35px rgba(0,0,0,.16)}.quick{min-height:135px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:.2s transform}.quick:active{transform:scale(.98)}.quick-icon{font-size:26px}.quick h3{margin:14px 0 4px}.muted{color:var(--muted);font-size:13px;line-height:1.45}.news-card{display:flex;gap:14px;align-items:center;margin-bottom:11px}.news-thumb{width:76px;height:76px;border-radius:18px;background:linear-gradient(135deg,#2d7dff,#102a59);display:grid;place-items:center;font-size:26px;flex:none}.news-card h3{font-size:16px;margin:3px 0 6px;line-height:1.2}.pill{display:inline-flex;border:1px solid rgba(255,255,255,.11);border-radius:999px;padding:5px 9px;color:#bcd2ff;font-size:11px;font-weight:800}
.bottom-nav{position:fixed;z-index:30;bottom:0;left:50%;transform:translateX(-50%);width:min(520px,100%);display:grid;grid-template-columns:repeat(5,1fr);padding:10px 9px calc(10px + env(safe-area-inset-bottom));background:rgba(5,13,25,.9);backdrop-filter:blur(24px);border-top:1px solid var(--line)}.nav-btn{background:none;border:0;color:#6f8198;font-size:11px;display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer}.nav-btn span:first-child{font-size:21px}.nav-btn.active{color:#fff}.page-title{font-size:34px;margin:10px 3px 18px}.live-score{text-align:center;padding:25px}.live-badge{color:#ff8292;font-size:12px;font-weight:900;letter-spacing:.12em}.score{font-size:48px;font-weight:900;margin:14px 0}.teams{display:flex;justify-content:space-between;font-size:18px;font-weight:800}.stats-row{display:grid;grid-template-columns:60px 1fr 60px;align-items:center;gap:10px;margin:14px 0}.bar{height:8px;background:#1e2e44;border-radius:20px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,#2d7dff,#75a9ff)}.event{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.ticket{background:linear-gradient(145deg,#f9fbff,#d9e5fa);color:#08162b;border-radius:24px;padding:20px;margin-bottom:14px;position:relative;overflow:hidden}.ticket:after{content:"";position:absolute;right:-45px;bottom:-55px;width:160px;height:160px;border-radius:50%;background:#2d7dff20}.ticket-head{display:flex;justify-content:space-between}.ticket h3{font-size:22px;margin:18px 0 4px}.ticket-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.ticket-grid small{display:block;color:#637088}.ticket-grid b{font-size:17px}.qr{width:145px;height:145px;background:white;border:10px solid white;margin:16px auto 4px;display:grid;grid-template-columns:repeat(9,1fr);gap:1px}.qr i{background:#07101f}.member-card{background:linear-gradient(145deg,#245bd8,#071b45);border-radius:28px;padding:23px;min-height:235px;position:relative;overflow:hidden;box-shadow:var(--shadow)}.member-card:before{content:"";position:absolute;inset:-40% auto auto 38%;width:240px;height:240px;border-radius:50%;background:rgba(255,255,255,.12)}.member-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em}.tier{font-size:31px;font-weight:900;margin-top:55px}.products{display:grid;grid-template-columns:1fr 1fr;gap:12px}.product-visual{height:145px;background:linear-gradient(145deg,#172c4d,#0b182a);border-radius:18px;display:grid;place-items:center;font-size:58px}.price{font-size:19px;font-weight:900}.product button{width:100%;margin-top:10px}.cart-bubble{position:fixed;right:20px;bottom:100px;border:0;border-radius:999px;background:#fff;color:#08162b;padding:13px 17px;font-weight:900;box-shadow:var(--shadow)}.profile-hero{text-align:center;padding:22px}.profile-avatar{width:88px;height:88px;border-radius:50%;background:linear-gradient(145deg,#3f8cff,#123a87);display:grid;place-items:center;margin:auto;font-size:34px;font-weight:900}.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.stat strong{display:block;font-size:28px}.login{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(430px,100%);padding:28px;border-radius:30px;background:linear-gradient(180deg,#10233e,#091524);border:1px solid var(--line);box-shadow:var(--shadow)}.login-card h1{font-size:38px;margin:8px 0}.field{width:100%;padding:15px 16px;margin:8px 0;background:#07111f;color:#fff;border:1px solid var(--line);border-radius:15px}.login-card .btn{width:100%;margin-top:10px}.admin-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--line)}.switch{width:48px;height:28px;border-radius:999px;background:#24354c;padding:4px}.switch.on{background:#2d7dff}.switch i{display:block;width:20px;height:20px;border-radius:50%;background:#fff}.switch.on i{margin-left:20px}.toast{position:fixed;z-index:100;left:50%;bottom:105px;transform:translate(-50%,20px);background:#fff;color:#07101f;padding:12px 16px;border-radius:14px;font-weight:800;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}

.top-actions{display:flex;gap:9px;align-items:center}.icon-btn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:#101e31;color:#fff;font-size:18px}.loyalty{display:flex;align-items:center;justify-content:space-between;margin-top:14px}.loyalty h2{margin:5px 0}.compact{min-height:230px}.full{width:100%;margin-top:14px}.center{text-align:center}.right{text-align:right}.big{height:12px}.feature-card,.passport-cover,.assistant-hero{border-radius:28px;padding:23px;margin-bottom:14px;background:linear-gradient(145deg,#1d61e8,#0b2455);box-shadow:var(--shadow)}.feature-card{display:flex;justify-content:space-between;align-items:center;cursor:pointer}.feature-card h2,.passport-cover h2,.assistant-hero h2{font-size:28px;margin:8px 0}.timeline{position:relative;margin-left:14px;padding-left:20px;border-left:1px solid rgba(255,255,255,.15)}.timeline-item{display:grid;grid-template-columns:52px 1fr;gap:14px;margin-bottom:16px}.timeline-icon{width:48px;height:48px;border-radius:16px;background:#12243d;display:grid;place-items:center;font-size:24px}.timeline-item h3{margin:3px 0}.timeline-item p{margin:0;color:var(--muted)}.mission{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.mission.done{opacity:.6}.score-picker{display:flex;align-items:center;justify-content:center;gap:18px;margin:30px 0}.score-picker input{width:90px;height:90px;border-radius:22px;border:1px solid var(--line);background:#07111f;color:#fff;text-align:center;font-size:42px;font-weight:900}.score-picker span{font-size:34px}.answer-list{display:grid;gap:11px;margin-top:22px}.answer-list button{padding:16px;border-radius:16px;border:1px solid var(--line);background:#0b1727;color:#fff;text-align:left;font-weight:750}.big-emoji{font-size:60px}.assistant-hero{text-align:center}.ai-orb{width:74px;height:74px;border-radius:24px;background:rgba(255,255,255,.14);display:grid;place-items:center;margin:auto;font-size:34px}.chat{display:flex;flex-direction:column;gap:10px;max-height:390px;overflow:auto;padding:5px 0 14px}.bubble{max-width:86%;padding:13px 15px;border-radius:18px;line-height:1.45}.bubble.bot{align-self:flex-start;background:#12243d}.bubble.user{align-self:flex-end;background:#2d7dff}.bubble button{border:0;background:none;color:#9fc0ff;font-weight:800}.chat-form{display:grid;grid-template-columns:1fr auto;gap:8px;position:sticky;bottom:86px;background:#06101f;padding-top:8px}.profile-link{width:100%;display:flex;justify-content:space-between;padding:16px 0;border:0;border-bottom:1px solid var(--line);background:none;color:#fff;font-weight:750}

.notification-btn{position:relative}.notification-btn em{position:absolute;right:-3px;top:-5px;min-width:16px;height:16px;border-radius:8px;background:#ff3b5c;font-size:10px;font-style:normal;display:grid;place-items:center}.composer textarea{min-height:78px;resize:vertical;margin-bottom:10px}.social-head{display:flex;gap:10px;align-items:center}.mini-avatar{width:38px;height:38px;border-radius:13px;background:#2459b7;display:grid;place-items:center;font-weight:900}.social-post p{font-size:16px;line-height:1.5}.reaction{border:0;background:#101f34;color:#b9c7d9;border-radius:999px;padding:9px 13px}.reaction.liked{background:#163d84;color:#fff}.museum-hero{padding:28px;border-radius:28px;background:radial-gradient(circle at 80% 20%,#2d7dff55,transparent 30%),linear-gradient(145deg,#171f2e,#070d17);margin-bottom:18px}.museum-line{display:grid;gap:14px}.museum-item{position:relative;padding:24px;border-radius:24px;background:#0d192a;border:1px solid var(--line)}.museum-year{font-size:48px;font-weight:950;opacity:.16;position:absolute;right:16px;top:8px}.museum-icon{font-size:34px}.stadium-map{height:390px;position:relative;border-radius:28px;background:linear-gradient(90deg,#173f2b 2px,transparent 2px),linear-gradient(#173f2b 2px,transparent 2px),#0c2c1c;background-size:28px 28px;overflow:hidden;margin-bottom:16px;border:1px solid #2e5b3f}.pitch{position:absolute;left:20%;top:23%;width:60%;height:54%;border:2px solid #b9d9c4;border-radius:4px;display:grid;place-items:center;color:#b9d9c4;font-weight:900;letter-spacing:4px}.map-pin{position:absolute;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;border:5px solid #ffffff33;background:#2d7dff;color:white;font-weight:900;box-shadow:0 0 0 8px #2d7dff22}.map-pin.selected{background:#fff;color:#0b1a31}.route-card{display:flex;justify-content:space-between;gap:12px;align-items:center}.ar-stage{height:430px;border-radius:28px;overflow:hidden;position:relative;background:linear-gradient(160deg,#142c44,#07101d);border:1px solid var(--line)}.ar-stage video{width:100%;height:100%;object-fit:cover}.ar-grid{position:absolute;inset:0;background:linear-gradient(#ffffff15 1px,transparent 1px),linear-gradient(90deg,#ffffff15 1px,transparent 1px);background-size:45px 45px}.ar-player,.ar-gate{position:absolute;background:#07111fdd;border:1px solid #4d92ff;border-radius:14px;padding:10px 12px}.ar-player{left:12%;top:28%;display:flex;gap:10px;align-items:center}.ar-player span{font-size:24px;font-weight:950}.ar-player small{display:block;color:#a9bbd0}.ar-gate{right:8%;bottom:18%;font-weight:850}.highlight-player{height:220px;border-radius:28px;background:radial-gradient(circle at 30% 30%,#2d7dff88,transparent 34%),linear-gradient(145deg,#101f33,#050a12);display:flex;align-items:end;gap:16px;padding:22px;margin-bottom:14px}.play-mark{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#07111f;font-size:22px}.filter-row{display:flex;gap:8px;overflow:auto;padding-bottom:12px}.filter-row button{border:1px solid var(--line);background:#0b1727;color:#b8c6d9;padding:9px 13px;border-radius:999px;white-space:nowrap}.filter-row button.active{background:#2d7dff;color:#fff}.clip{display:grid;grid-template-columns:52px 1fr 42px;gap:12px;align-items:center}.clip-time{font-size:20px;font-weight:950}.clip button{width:38px;height:38px;border-radius:50%;border:0}.notification{display:grid;grid-template-columns:12px 1fr;gap:12px}.notification-dot{width:9px;height:9px;border-radius:50%;background:#2d7dff;margin-top:8px}

.legacy-tile{background:radial-gradient(circle at 85% 10%,#7daeff55,transparent 32%),linear-gradient(145deg,#152f61,#091525)!important}.legacy-cover{position:relative;overflow:hidden;padding:30px 24px;border-radius:30px;background:radial-gradient(circle at 75% 15%,#ffffff25,transparent 22%),linear-gradient(145deg,#316ee0,#091a3e 72%);box-shadow:0 28px 60px #0008;margin-bottom:16px}.legacy-cover:after{content:"◈";position:absolute;right:-10px;bottom:-55px;font-size:190px;opacity:.07}.legacy-cover h2{font-size:31px;line-height:1.05;max-width:440px;margin:11px 0}.legacy-monogram{width:54px;height:54px;border-radius:18px;background:#ffffff1f;border:1px solid #ffffff35;display:grid;place-items:center;font-size:24px;font-weight:950;margin-bottom:24px}.legacy-score{display:inline-flex;flex-direction:column;margin-top:18px;padding:13px 18px;border-radius:17px;background:#061127aa;border:1px solid #ffffff20}.legacy-score strong{font-size:28px}.legacy-score span{font-size:9px;letter-spacing:2px;color:#a9c8ff}.legacy-film{border-radius:28px;padding:18px;background:#040912;border:1px solid var(--line);margin-bottom:15px}.film-progress{display:flex;gap:5px}.film-progress i{height:3px;flex:1;background:#ffffff21;border-radius:3px}.film-progress i.active{background:#4b8dff}.film-scene{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px 12px}.film-scene h2{font-size:29px;margin:8px 0}.film-scene p{max-width:420px;color:#aebed2;line-height:1.55}.film-scene strong{color:#8db8ff}.scene-icon{font-size:56px;margin-bottom:18px}.film-controls{display:flex;justify-content:center;align-items:center;gap:20px}.film-controls button{width:45px;height:45px;border-radius:50%;border:1px solid #ffffff24;background:#0d1a2c;color:#fff;font-size:24px}.film-controls .film-play{width:58px;height:58px;background:#fff;color:#07111f}.legacy-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:20px}.legacy-stats article{padding:14px 5px;border-radius:16px;background:#0d192a;text-align:center}.legacy-stats b{display:block;font-size:21px}.legacy-stats span{display:block;font-size:10px;color:var(--muted);margin-top:3px}.text-btn{border:0;background:none;color:#7daeff;font-weight:850}.hidden{display:none!important}.legacy-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}.legacy-form input:nth-of-type(2),.legacy-form button{grid-column:1/-1}.legacy-object{display:grid;grid-template-columns:54px 1fr 30px;gap:12px;align-items:center}.legacy-object-icon{width:52px;height:52px;border-radius:17px;background:#132745;display:grid;place-items:center;font-size:26px}.legacy-object h3{margin:3px 0}.legacy-object p{margin:0;color:var(--muted)}.legacy-object>button{border:0;background:none;color:#72849a;font-size:25px}.legacy-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.legacy-link{color:#9bc0ff!important}
@media(max-width:420px){.legacy-cover h2{font-size:27px}.legacy-stats{grid-template-columns:repeat(2,1fr)}.legacy-form{grid-template-columns:1fr}.legacy-form>*{grid-column:1!important}.legacy-actions{grid-template-columns:1fr}}


/* ==========================================================
   FANONE DINAMO PREMIUM EDITION
   ========================================================== */
:root{
  --bg:#020a16;
  --panel:#07172b;
  --panel2:#0b2240;
  --text:#f8fbff;
  --muted:#93a9c4;
  --blue:#0c6fff;
  --blue2:#053f99;
  --gold:#d9ad55;
  --gold2:#f0d08b;
  --line:rgba(218,176,87,.16);
  --shadow:0 28px 80px rgba(0,0,0,.46);
}
html,body{background:
 radial-gradient(circle at 50% -8%,rgba(20,85,170,.34),transparent 31%),
 linear-gradient(180deg,#03142e 0,#020a16 52%,#01050c 100%);
}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;background:
 linear-gradient(90deg,transparent 49.7%,rgba(217,173,85,.12) 50%,transparent 50.3%),
 radial-gradient(circle at 20% 15%,rgba(35,114,232,.22),transparent 25%)}
.app-shell{position:relative}
.topbar{background:linear-gradient(180deg,rgba(2,10,22,.98),rgba(2,10,22,.82),rgba(2,10,22,.18));border-bottom:1px solid rgba(217,173,85,.08)}
.brand-lockup{display:flex;align-items:center;gap:10px;border:0;background:none;color:#fff;padding:0;text-align:left}
.brand-lockup img{width:39px;height:39px;border-radius:12px;object-fit:cover;box-shadow:0 0 0 1px rgba(217,173,85,.4),0 8px 22px rgba(0,0,0,.42)}
.brand-lockup b{display:block;font-size:16px;letter-spacing:.08em;line-height:1}
.brand-lockup b span,.login-card h1 span{color:var(--gold)}
.brand-lockup small{display:block;color:#8ca5c2;font-size:8px;letter-spacing:.19em;margin-top:5px}
.icon-btn{border-color:rgba(217,173,85,.18);background:linear-gradient(145deg,#0b203b,#061326)}
.ai-top{color:var(--gold)}
.avatar{background:linear-gradient(145deg,#1a65d9,#07275e);border:1px solid rgba(217,173,85,.38);box-shadow:0 9px 25px rgba(0,0,0,.42)}
.dinamo-hero{min-height:530px;padding:0;background:
 linear-gradient(90deg,rgba(2,9,22,.13),rgba(2,9,22,.82) 78%),
 url("assets/dinamo-hero.jpg") center/cover no-repeat;
 border:1px solid rgba(217,173,85,.27);
 box-shadow:0 32px 90px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.03)
}
.dinamo-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,7,18,.08),rgba(2,10,23,.28) 50%,rgba(2,8,19,.93));z-index:0}
.dinamo-hero:after{content:"";position:absolute;inset:18px;border:1px solid rgba(217,173,85,.17);border-radius:23px;background:none;filter:none;width:auto;height:auto;right:18px;top:18px}
.hero-content{position:relative;z-index:2;padding:25px 23px 23px;display:flex;flex-direction:column;min-height:530px}
.hero-kicker{display:flex;align-items:center;gap:10px;color:#d7e5f5;font-size:9px;letter-spacing:.15em;font-weight:850}
.hero-kicker img{width:40px;height:40px;border-radius:12px;box-shadow:0 0 0 1px rgba(217,173,85,.45)}
.dinamo-hero>.hero-content>.eyebrow{margin-top:42px;color:var(--gold2)}
.dinamo-hero h1{font-size:39px;line-height:.98;margin:10px 0 20px;text-shadow:0 8px 25px rgba(0,0,0,.8)}
.dinamo-hero h1 span{color:#2384ff}
.next-match-strip{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px;border-radius:18px;background:rgba(1,10,25,.69);border:1px solid rgba(217,173,85,.24);backdrop-filter:blur(14px)}
.next-match-strip small,.next-match-strip span{display:block;color:#9eb2ca;font-size:10px}
.next-match-strip strong{display:block;font-size:17px;margin:5px 0}
.next-match-strip strong i{color:var(--gold);font-style:normal;font-size:10px;margin:0 7px}
.next-match-strip button{width:42px;height:42px;border-radius:50%;border:1px solid rgba(217,173,85,.35);background:#0a2c60;color:#fff;font-size:19px}
.dinamo-hero .countdown{margin:13px 0}
.dinamo-hero .timebox{background:rgba(2,9,22,.7);border-color:rgba(217,173,85,.2)}
.btn-primary{background:linear-gradient(135deg,#f4dc9a,#c99538);color:#071425;box-shadow:0 10px 26px rgba(196,144,46,.18)}
.btn-dark{background:rgba(3,14,32,.72);border-color:rgba(217,173,85,.23)}
.card{background:linear-gradient(155deg,rgba(12,34,62,.97),rgba(4,16,31,.98));border-color:rgba(217,173,85,.12)}
.loyalty{position:relative;overflow:hidden;border-color:rgba(217,173,85,.27);background:radial-gradient(circle at 90% 0,rgba(217,173,85,.18),transparent 30%),linear-gradient(145deg,#0b2d61,#06172d)}
.loyalty:after{content:"★";position:absolute;right:12px;bottom:-30px;color:rgba(217,173,85,.09);font-size:115px}
.eyebrow{color:#d7bd78}
.section-mark{font-size:9px;letter-spacing:.18em;color:rgba(217,173,85,.7)}
.quick{border-radius:20px}
.quick-icon{color:var(--gold);font-size:25px}
.legacy-tile{background:radial-gradient(circle at 84% 12%,rgba(217,173,85,.28),transparent 34%),linear-gradient(145deg,#153b78,#06172d)!important;border-color:rgba(217,173,85,.28)}
.ticket-tile{background:linear-gradient(145deg,#0c3779,#07172e)}
.ai-tile{background:radial-gradient(circle at 80% 18%,rgba(36,126,255,.3),transparent 32%),linear-gradient(145deg,#0b2446,#061426)}
.news-thumb{background:radial-gradient(circle at 50% 35%,#176de0,#061d42);border:1px solid rgba(217,173,85,.22);color:var(--gold);font-size:25px;font-weight:950}
.news-thumb span{width:45px;height:45px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(217,173,85,.42);background:#061a39}
.pill{border-color:rgba(217,173,85,.2);color:#e5c879}
.bottom-nav{background:rgba(2,8,18,.93);border-top-color:rgba(217,173,85,.14)}
.nav-btn.active{color:var(--gold2)}
.nav-btn.active:after{content:"";width:22px;height:2px;border-radius:4px;background:var(--gold)}
.member-card{background:radial-gradient(circle at 80% 10%,rgba(217,173,85,.26),transparent 30%),linear-gradient(145deg,#0c3d86,#06172f);border:1px solid rgba(217,173,85,.36)}
.member-crest{position:absolute;right:18px;top:18px;width:74px;height:74px;border-radius:22px;opacity:.95;box-shadow:0 0 0 1px rgba(217,173,85,.45)}
.member-gold-line{position:absolute;left:23px;right:23px;bottom:18px;height:2px;background:linear-gradient(90deg,var(--gold),transparent)}
.ticket{background:linear-gradient(145deg,#f9fbff,#dfe9f7);border:1px solid var(--gold);box-shadow:0 24px 60px rgba(0,0,0,.33)}
.ticket-head b{display:flex;align-items:center;gap:8px}
.ticket-head img{width:28px;height:28px;border-radius:9px}
.ticket-head span{color:#8a651d;font-weight:900}
.ticket:after{background:radial-gradient(circle,#d9ad5535,transparent 68%)}
.profile-avatar{border:2px solid rgba(217,173,85,.45)}
.dinamo-legacy{background:
 linear-gradient(90deg,rgba(2,9,22,.32),rgba(2,9,22,.9)),
 url("assets/dinamo-hero.jpg") center/cover no-repeat;
 border:1px solid rgba(217,173,85,.31)
}
.legacy-monogram img{width:100%;height:100%;border-radius:17px;object-fit:cover}
.legacy-score{border-color:rgba(217,173,85,.3)}
.legacy-score span,.film-scene strong,.text-btn,.legacy-link{color:var(--gold2)!important}
.film-progress i.active{background:linear-gradient(90deg,var(--gold),#fff0bd)}
.login{background:
 radial-gradient(circle at 50% 15%,rgba(22,93,189,.33),transparent 30%),
 linear-gradient(180deg,#03152f,#010711)}
.login-card{text-align:center;border-color:rgba(217,173,85,.3);background:radial-gradient(circle at 80% 0,rgba(217,173,85,.12),transparent 25%),linear-gradient(180deg,#0a213e,#040f20)}
.login-crest{width:94px;height:94px;border-radius:28px;margin:0 auto 20px;box-shadow:0 0 0 1px rgba(217,173,85,.48),0 22px 55px rgba(0,0,0,.45)}
.login-card h1{letter-spacing:.08em}
.field:focus{outline:0;border-color:rgba(217,173,85,.62);box-shadow:0 0 0 3px rgba(217,173,85,.09)}
@media(max-width:420px){
 .dinamo-hero{min-height:505px}
 .hero-content{min-height:505px}
 .dinamo-hero h1{font-size:35px}
}


/* FANONE PHASE 4 — REFERENCE UI REBUILD */
:root{
  --ref-bg:#020b16;--ref-panel:#06182c;--ref-panel-2:#071e38;--ref-line:#18334f;
  --ref-blue:#0878f8;--ref-gold:#d6a94c;--ref-text:#f6f8fb;--ref-muted:#98a8bb;
}
*{box-sizing:border-box}
html,body{background:#010812!important;color:var(--ref-text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{margin:0}
button{font:inherit}
.ref-shell{width:min(100%,480px);min-height:100vh;margin:auto;background:linear-gradient(180deg,#03101e,#020913 70%);box-shadow:0 0 90px #000;position:relative;padding-bottom:86px}
.ref-main{padding:0 15px 28px!important}
.ref-topbar{height:75px;display:flex;align-items:center;justify-content:space-between;padding:13px 17px;background:linear-gradient(180deg,#031326,#020c19);border-bottom:1px solid rgba(214,169,76,.12);position:sticky;top:0;z-index:30}
.ref-brand{border:0;background:none;color:#fff;display:flex;align-items:center;gap:11px;font-size:19px;letter-spacing:1.5px}
.ref-brand img{width:40px;height:40px;object-fit:contain}
.ref-brand b{color:var(--ref-gold);font-weight:700}
.ref-bell,.ref-back,.ref-menu{border:0;background:none;color:#fff;font-size:27px;position:relative}
.ref-bell em{position:absolute;right:-5px;top:-5px;background:var(--ref-gold);color:#06101e;border-radius:50%;font:700 10px/17px Inter;width:17px;height:17px}
.ref-pagebar{height:65px}.ref-pagebar strong{font-size:13px;letter-spacing:.8px}.ref-back{font-size:35px;font-weight:200}.ref-menu{color:var(--ref-gold)}
.ref-home-hero{position:relative;margin:0 -15px;height:304px;overflow:hidden;background:#061226}
.ref-hero-image{position:absolute;inset:82px 0 0;background:linear-gradient(180deg,transparent 45%,#03101e 100%),url("assets/dinamo-hero.jpg") center/cover no-repeat;filter:saturate(.85) contrast(1.08)}
.ref-greeting{position:relative;z-index:2;padding:28px 24px}.ref-greeting h1{font-size:25px;margin:0 0 4px;letter-spacing:.2px}.ref-greeting h1 span{color:#0b83ff}.ref-greeting p{margin:0;font-size:15px}
.ref-next-match,.ref-loyalty,.ref-score-card,.ref-action-list,.ref-ticket,.ref-profile-card,.ref-profile-points,.ref-legacy-story{background:linear-gradient(145deg,#071d35,#041224);border:1px solid var(--ref-line);border-radius:15px;box-shadow:0 12px 28px rgba(0,0,0,.24)}
.ref-next-match{margin-top:-3px;padding:17px 18px;text-align:center}
.ref-card-head,.ref-live-row{display:flex;justify-content:space-between;align-items:center;color:#cbd5df;font-size:11px}.ref-card-head small,.ref-live-row small{color:#8292a5}
.ref-versus,.ref-ticket-teams,.ref-score-layout{display:grid;grid-template-columns:1fr 46px 1fr;align-items:center;margin:17px 0 8px}
.ref-team{display:flex;flex-direction:column;align-items:center;gap:7px}.ref-team img{width:54px;height:54px;object-fit:contain}.ref-team strong{font-size:13px}.ref-versus>b,.ref-ticket-teams>b{color:#c2c8d0;font-size:21px}
.ref-opponent-mark{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#083b85;border:3px solid #fff;color:#fff;font-size:25px;font-weight:900;box-shadow:inset 0 0 0 3px #e43b3b}.ref-green{background:#e7eee5;color:#48825a;box-shadow:inset 0 0 0 3px #55916d}
.ref-next-match p,.ref-ticket p{font-size:12px;color:#aeb8c5;margin:4px 0}.ref-next-match>small,.ref-ticket>small{font-size:11px;color:#8999aa}
.ref-shortcuts{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:18px 0}
.ref-shortcuts button{height:82px;border:0;border-radius:17px;background:linear-gradient(145deg,#0b284b,#06162a);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;box-shadow:inset 0 1px rgba(255,255,255,.04)}
.ref-shortcuts button span{font-size:27px}.ref-shortcuts button small{font-size:8px;letter-spacing:.2px}
.ref-loyalty{padding:18px;display:grid;grid-template-columns:1fr 90px;gap:14px;margin-bottom:26px}.ref-loyalty-copy>small{color:var(--ref-gold);font-size:10px}.ref-point-line{display:flex;align-items:baseline;gap:8px;margin:6px 0 12px}.ref-point-line strong{font-size:28px}.ref-point-line span{color:#30bb70;font-size:12px}
.ref-progress{height:8px;background:#18314f;border-radius:10px;overflow:hidden}.ref-progress i{display:block;height:100%;background:linear-gradient(90deg,#e5ebf0,#aeb8c4);border-radius:10px}
.ref-levels{display:flex;justify-content:space-between;font-size:9px;color:#a7b2bf;margin-top:7px}.ref-levels b{color:var(--ref-gold)}
.ref-loyalty-badge{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ref-gold);font-size:10px}.ref-loyalty-badge img{width:70px;height:70px;object-fit:contain;filter:sepia(1) saturate(1.2)}
.ref-section-title{display:flex;justify-content:space-between;align-items:end;margin:21px 2px 13px}.ref-section-title h2{margin:0;font-size:20px}.ref-section-title p{margin:4px 0 0;color:#a0adbc;font-size:13px}.ref-section-title button{border:0;background:none;color:#1687ff}
.ref-feature-news{height:150px;border-radius:16px;overflow:hidden;position:relative;background:url("assets/dinamo-hero.jpg") center 65%/cover;display:flex;align-items:end;padding:18px}.ref-feature-news:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent,#020b16)}.ref-feature-news>div:last-child{position:relative}.ref-feature-news span{color:var(--ref-gold);font-size:10px}.ref-feature-news h3{margin:4px 0;font-size:17px}.ref-feature-news p{margin:0;color:#aeb7c2;font-size:11px}
.ref-tabs{display:grid;grid-template-columns:repeat(3,1fr);height:50px;margin:0 -15px 15px;border-bottom:1px solid #1a2c41}.ref-tabs button{border:0;background:none;color:#9da9b7;font-size:11px;position:relative}.ref-tabs button.active{color:#fff}.ref-tabs button.active:after{content:"";position:absolute;bottom:-1px;left:18%;right:18%;height:2px;background:var(--ref-gold)}
.ref-ticket-tabs{grid-template-columns:1fr 1fr}
.ref-score-card{padding:14px;margin-top:13px}.ref-live-row span{background:#bd1432;color:#fff;padding:4px 10px;border-radius:4px;font-size:9px}
.ref-score-layout{margin:18px 0 5px}.ref-score-number{text-align:center}.ref-score-number b{display:block;font-size:29px}.ref-score-number span{color:#0783ff;font-size:12px}
.ref-action-list{overflow:hidden;margin-top:13px}.ref-action-list button{width:100%;height:58px;border:0;border-bottom:1px solid #112840;background:transparent;color:#fff;display:grid;grid-template-columns:33px 1fr 18px;align-items:center;text-align:left;padding:0 14px}.ref-action-list button:last-child{border-bottom:0}.ref-action-list button span{color:#d9dde2;font-size:18px}.ref-action-list button b{font-size:12px}.ref-action-list button i{font-size:22px;color:#9aa8b7;font-style:normal}
.ref-live-events{margin-top:14px}.ref-live-events div{display:grid;grid-template-columns:55px 1fr;padding:12px;border-bottom:1px solid #17304a}
.ref-ticket{padding:16px;margin-top:15px;text-align:center}.ref-ticket-teams{margin:3px 0 8px}.ref-ticket-details{display:grid;grid-template-columns:repeat(4,1fr);margin:17px -16px 14px;padding:13px 8px;border-top:1px solid #163654;border-bottom:1px solid #163654}.ref-ticket-details span{display:block;color:#8998a9;font-size:8px}.ref-ticket-details b{font-size:12px}
.ref-qr-wrap{display:flex;flex-direction:column;align-items:center;gap:5px}.ref-qr-wrap .qr{background:#fff;padding:8px;width:112px;height:112px;display:grid;grid-template-columns:repeat(9,1fr);gap:1px}.ref-qr-wrap .qr i{background:#000}.ref-qr-wrap .qr span{background:#fff}.ref-qr-wrap small{font-size:8px;color:#a1adba}
.ref-wallet{width:100%;height:43px;margin-top:15px;border:1px solid #4c83c4;border-radius:7px;background:transparent;color:#fff;font-size:11px}
.ref-profile-card{display:grid;grid-template-columns:55px 1fr 57px;gap:12px;align-items:center;padding:14px;margin-top:12px}.ref-profile-avatar{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#173b70;font-weight:900}.ref-profile-card strong{display:block;font-size:13px}.ref-profile-card small{display:block;color:#aab4bf;font-size:9px;margin-top:5px}.ref-gold-shield{height:55px;clip-path:polygon(50% 0,90% 18%,82% 75%,50% 100%,18% 75%,10% 18%);background:linear-gradient(145deg,#e5bd68,#8f6424);color:#07101b;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:900}.ref-gold-shield span{font-size:7px}
.ref-profile-points{margin-top:13px;padding:16px;display:flex;justify-content:space-between;align-items:end}.ref-profile-points small{display:block;color:var(--ref-gold);font-size:9px}.ref-profile-points strong{display:block;font-size:24px;margin-top:4px}.ref-profile-points>span{color:#1584f6;font-size:9px}
.ref-profile-list button{grid-template-columns:35px 1fr 18px;height:68px}.ref-profile-list button div b,.ref-profile-list button div small{display:block}.ref-profile-list button div small{color:#8e9cac;font-size:9px;margin-top:4px}
.ref-legacy-hero{padding-top:14px}.ref-legacy-image{height:174px;border-radius:15px;overflow:hidden;background:linear-gradient(180deg,rgba(0,0,0,.06),rgba(2,10,20,.78)),url("assets/dinamo-hero.jpg") center/cover;display:flex;align-items:center;justify-content:center;text-align:center}.ref-legacy-image h2{font-size:17px;margin:0 0 6px}.ref-legacy-image strong{font-size:12px;color:var(--ref-gold)}.ref-legacy-image button{display:block;margin:18px auto 0;padding:10px 25px;border:0;border-radius:6px;background:#0753b4;color:#fff}
.ref-legacy-heading{display:flex;justify-content:space-between;align-items:center;margin:20px 1px 11px}.ref-legacy-heading h3{font-size:13px}.ref-legacy-heading button{border:0;background:none;color:#1b8aff;font-size:10px}
.ref-memory-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ref-memory-grid article{height:120px;border:1px solid #193451;border-radius:12px;position:relative;overflow:hidden;display:flex;align-items:end;padding:12px}.memory-bg{position:absolute;inset:0;background:url("assets/dinamo-hero.jpg") center/cover;opacity:.45}.travel-memory{background-position:center 65%}.trophy-memory{filter:sepia(1)}.jersey-memory{background-position:80% center}.ref-memory-grid article:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,#020a14)}.ref-memory-grid strong,.ref-memory-grid span{position:relative;z-index:1}.ref-memory-grid strong{font-size:22px;margin-right:8px}.ref-memory-grid span{font-size:9px;color:#d0d6dc}
.ref-legacy-story{padding:18px;margin-top:14px;text-align:center}.ref-legacy-story small{color:var(--ref-gold)}.ref-legacy-story h2{margin:8px 0}.ref-legacy-story p{color:#9daabb;line-height:1.5}
.film-progress{display:flex;gap:5px;margin-bottom:15px}.film-progress i{height:3px;flex:1;background:#19324e}.film-progress i.active{background:var(--ref-gold)}.film-controls{display:flex;justify-content:center;gap:17px;margin-top:15px}.film-controls button{width:39px;height:39px;border-radius:50%;border:1px solid #29435e;background:#07182b;color:#fff}.film-controls .film-play{background:#fff;color:#07111f}
.ref-bottom{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,480px);height:72px;background:rgba(2,12,23,.97);border-top:1px solid #17304b;display:grid;grid-template-columns:repeat(5,1fr);z-index:40;backdrop-filter:blur(18px)}.ref-bottom .nav-btn{border:0;background:none;color:#8f9cab;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:8px}.ref-bottom .nav-btn.active{color:#fff}.ref-nav-icon{font-size:21px}.ref-bottom .nav-btn.active .ref-nav-icon{color:var(--ref-gold)}
.card,.hero,.topbar:not(.ref-topbar){border-radius:15px}
@media(min-width:700px){body{padding:24px}.ref-shell{border:1px solid #26394d;border-radius:28px;overflow:hidden}.ref-bottom{bottom:24px;border-radius:0 0 28px 28px}}