/* Fotografias escolhidas pelo criador, marcas reais e HUD legível. */
:root { --accent:#ba8cff; --accent-ink:#190c2b; --surface:#121019; --surface-2:#24182f; --bg:#09060f; }
body { background:#09060f; }
.btn { border-radius:5px; }
.btn.primary { background:linear-gradient(135deg,#c8a5ff,#a665ed); border:1px solid #d0afff; box-shadow:inset 0 1px 0 #ffffff35,0 5px 18px #7024b52a; }
.btn.primary:hover:not(:disabled) { background:linear-gradient(135deg,#dfc9ff,#b382f8); box-shadow:0 6px 28px #9a3bec45; }
.team-mark { display:inline-flex; flex:none; align-items:center; justify-content:center; width:43px; height:30px; padding:3px; background:#ffffff06; border:1px solid #ffffff10; border-radius:5px; vertical-align:middle; }
.team-mark img { width:100%; height:100%; object-fit:contain; display:block; }
.team-mark.tiny { width:25px; height:18px; padding:2px; border:0; background:transparent; }
.team-mark.large { width:71px; height:48px; padding:5px 8px; border-color:#ffffff1c; background:#07070b66; }
.team-heading { display:flex; align-items:center; gap:14px; }
.driver-link small { display:flex; align-items:center; gap:5px; }
.pilot-team { gap:9px; }
.pilot-team > .team-mark { width:39px; height:28px; }
.brand-button { padding:12px 15px 15px; }
.brand-button img { width:100%; height:68px; object-fit:contain; }
.violet-welcome .welcome-top { height:calc(110px + env(safe-area-inset-top,0px)); padding-top:env(safe-area-inset-top,0px); background:#0c0b10; }
.violet-welcome .welcome-top > img { width:318px; height:104px; object-fit:contain; }
.violet-welcome .welcome-main { min-height:620px; }
.violet-welcome .welcome-copy { padding-top:56px; padding-bottom:44px; }
.violet-welcome .welcome-copy h1 { font-size:clamp(62px,6.6vw,94px); font-weight:750; letter-spacing:-.055em; }
.violet-welcome .welcome-copy > .eyebrow { color:#d6b7ff; font-size:10px; letter-spacing:.19em; }
.violet-welcome .welcome-sub { max-width:385px; font-size:14px; color:#d4c9df; }
.violet-welcome .welcome-ctas .btn { min-height:53px; min-width:205px; font-size:12px; }
.violet-welcome .welcome-meta { margin-top:38px; }
.violet-welcome .welcome-photo { inset:-3% -2%; background-image:linear-gradient(90deg,#0b0710f5 0%,#0b0710df 22%,#0b071054 57%,#0b071012 100%),linear-gradient(0deg,#09060f 0%,#0b071000 73%),url('/assets/custom/welcome-grid.jpeg'); background-position:center,center,center 56%; background-size:cover; opacity:1; }
.welcome-year { right:3%; top:3%; -webkit-text-stroke-color:#d8b7ff26; }
.paddock-parade { position:relative; display:flex; align-items:center; gap:34px; padding:16px 5.5vw; min-height:74px; border-block:1px solid #68418355; background:linear-gradient(90deg,#23112e,#100b18); }
.paddock-parade > span { flex:none; font:700 9px var(--mono); letter-spacing:.15em; color:#c5a0e7; }
.team-parade { display:flex; align-items:center; justify-content:space-between; gap:24px; width:100%; overflow-x:auto; scrollbar-width:thin; scrollbar-color:#73518d transparent; }
.team-parade > span { flex:none; }
.team-parade .team-mark { width:52px; height:36px; padding:5px; background:transparent; border:0; }
.team-parade .team-mark img { transition:transform .2s; }
.team-parade .team-mark:hover img { transform:scale(1.14); }
.violet-welcome .welcome-bottom { min-height:65px; padding-top:17px; padding-bottom:max(17px,env(safe-area-inset-bottom,0px)); }

.violet-creation { padding-bottom:65px; }
.violet-creation > .motion-atmosphere { background:radial-gradient(ellipse at 72% 15%,#2d123c50,transparent 65%),#09060f; }
.creation-photo { position:fixed; z-index:-1; pointer-events:none; left:0; top:0; bottom:0; width:53%; background-image:linear-gradient(90deg,#09060f30,#09060f20 70%,#09060f),url('/assets/custom/creation-hamilton.webp'); background-size:cover,auto 100vh; background-repeat:no-repeat; background-position:center,center bottom; opacity:.82; }
.violet-creation .simple-header { height:calc(110px + env(safe-area-inset-top,0px)); padding-top:env(safe-area-inset-top,0px); margin-bottom:35px; }
.violet-creation .simple-header > img { width:270px; height:98px; object-fit:contain; }
.violet-creation .creation-layout { grid-template-columns:minmax(265px,.85fr) minmax(0,1.35fr); gap:65px; }
.violet-creation .creation-intro { padding-top:24px; }
.violet-creation .creation-intro h1 { font-weight:750; text-shadow:0 3px 30px #07020b; }
.violet-creation .creation-intro > p { text-shadow:0 2px 12px #000; }
.creation-brief { margin:35px 0 0; border-left:2px solid #a464e7; padding:8px 0 8px 20px; background:linear-gradient(90deg,#130b1ed4,transparent); max-width:320px; }
.brief-kicker { font:9px var(--mono); color:#c49be4; letter-spacing:.08em; }
.creation-brief ol { list-style:none; padding:0; margin:19px 0 0; display:grid; gap:15px; }
.creation-brief li { font-size:11px; color:#e2d5eb; display:flex; align-items:center; gap:12px; }
.creation-brief li b { font:9px var(--mono); color:#b777f5; }
.violet-creation .creation-form { padding:27px; border:1px solid #68417d8a; border-top:2px solid #aa6ce2; border-radius:10px; background:linear-gradient(155deg,#17101ff5,#0d0a14f2 55%); box-shadow:0 25px 80px #0000004d; }
.violet-creation .identity-fields { padding-bottom:27px; border-bottom:1px solid #61417350; }
.violet-creation .style-options { gap:13px; }
.violet-creation .style-option > .style-card-body,.violet-creation .style-option:last-child .style-card-body { height:215px; border-radius:7px; background:#130a1b; }
.violet-creation .style-option:last-child { grid-column:auto; }
.violet-creation .style-option .style-driver,.violet-creation .style-option:last-child .style-driver { width:100%; height:100%; object-position:center; opacity:1; filter:none; }
.violet-creation .style-option[data-style=technical] .style-driver { object-position:42% center; }
.violet-creation .style-option[data-style=rain] .style-driver { object-position:43% center; }
.style-shade { background:linear-gradient(0deg,#0c0710fa 0%,#0c0710b0 28%,#0c071010 80%); }
.violet-creation .style-option .style-reference { color:#e0b8ff; text-shadow:0 1px 6px black; }
.violet-creation .style-option b { font-size:22px; }
.violet-creation .style-option .style-description,.violet-creation .style-option:last-child .style-description { max-width:100%; font-size:9px; line-height:1.5; color:#e0d6e6; }
.violet-creation .style-option > input:checked + .style-card-body { border-color:#cc9bff; box-shadow:0 0 0 1px #cc9bff,0 5px 30px #a548e943; }
.violet-creation .form-submit { padding-top:24px; }
.violet-creation .form-submit .btn { min-width:195px; }

.photo-backgrounds .workspace::before { background-image:linear-gradient(180deg,#160b20df,#09060ff5 80%),url('/assets/custom/welcome-grid.jpeg'); background-position:center; }
.photo-backgrounds .next-event { background-image:linear-gradient(90deg,#190b2af5,#1c0a2dc2 45%,#0c08185a),url('/assets/custom/welcome-grid.jpeg'); background-position:center,64% 54%; }
.photo-backgrounds .weekend-header { background-image:linear-gradient(90deg,#190b2af2,#1c0a2d8a),url('/assets/custom/welcome-grid.jpeg'); background-position:center,center 58%; }
.photo-backgrounds .race-status-strip { background-image:linear-gradient(90deg,#1a1126ed,#1a1126c9),url('/assets/custom/welcome-grid.jpeg'); }
.top-number { background:#412156; border-color:#9661ba; color:#eddbff; font-weight:750; border-radius:4px; box-shadow:inset 0 1px 0 #ffffff15; }
.nav-item.active { background:linear-gradient(90deg,#66309944,#31164744); color:#ddbbff; }
.pilot-overview { border-top:2px solid var(--team,#aa70df); }
.photo-backgrounds .pilot-overview { background-image:linear-gradient(135deg,#ffffff07,transparent 45%); }
.next-event { box-shadow:0 14px 45px #0003; border-top-width:2px; }
.panel { border-top-color:#78508c; }
.offer { border-radius:9px; border-top:2px solid var(--team); background:linear-gradient(125deg,#1e1629,#100d17); box-shadow:0 9px 30px #0002; }
.offer-team .team-heading { font-size:30px; gap:12px; }
.offer-team .team-mark.large { width:69px; height:49px; }
.team-editorial { border-top:2px solid var(--team); border-radius:9px; background:linear-gradient(130deg,#1c1525,#100e18); }
.team-editorial .team-heading { font-size:36px; }
.constructor-standings .team-heading { font-size:29px; }
.brand-showcase { background:#0d0c11; }
.brand-showcase > img { width:min(900px,95%); max-height:300px; object-fit:contain; }
.brand-grid.current-brand { grid-template-columns:1fr 1fr; }
.brand-app { flex-direction:column; gap:14px; padding:24px; background:#100c17; }
.brand-app > img { width:175px; height:175px; object-fit:contain; border-radius:30px; }
.brand-app > span { font:9px var(--mono); color:#b3a1c2; letter-spacing:.1em; }
#page-content { animation:game-panel-in .3s ease-out; }
@keyframes game-panel-in { from { opacity:.4; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:1100px) {
 .violet-creation .creation-layout { gap:35px; grid-template-columns:minmax(230px,.75fr) minmax(0,1.4fr); }
 .violet-creation .creation-form { padding:22px; }
 .violet-creation .style-option b { font-size:19px; }
 .team-parade { gap:19px; } .paddock-parade { gap:25px; } .team-parade .team-mark { width:43px; }
}
@media(max-width:880px) {
 .violet-creation .creation-layout { grid-template-columns:1fr; gap:30px; }
 .creation-photo { width:100%; opacity:.45; background-size:cover,auto 100vh; background-position:center,left bottom; }
 .creation-brief { display:none; } .violet-creation .creation-intro { padding-top:0; }
 .violet-welcome .welcome-top > img { width:252px; height:90px; }
 .team-parade { justify-content:flex-start; } .team-parade .team-mark { width:45px; }
}
@media(max-width:560px) {
 .violet-welcome .welcome-top { height:calc(83px + env(safe-area-inset-top,0px)); padding-inline:16px; }
 .violet-welcome .welcome-top > img { width:min(185px,46vw); height:72px; }
 .violet-welcome .welcome-copy { padding:51px 23px 42px; }
 .violet-welcome .welcome-copy h1 { font-size:clamp(45px,11.7vw,64px); line-height:1.06; }
 .violet-welcome .welcome-copy > .eyebrow { font-size:7px; }
 .violet-welcome .welcome-main { min-height:610px; }
 .violet-welcome .welcome-photo { inset:-3% -110% -3% -20%; background-position:center,center,59% 55%; opacity:.76; }
 .violet-welcome .welcome-sub { font-size:12px; max-width:280px; }
 .violet-welcome .welcome-ctas .btn { min-height:49px; font-size:11px; }
 .violet-welcome .welcome-meta { margin-top:30px; }
 .paddock-parade { padding:11px 21px; gap:18px; min-height:65px; } .paddock-parade > span { font-size:7px; }
 .team-parade { gap:18px; } .team-parade .team-mark { width:41px; height:32px; }
 .violet-creation { padding-inline:17px; padding-bottom:max(35px,env(safe-area-inset-bottom,0px)); }
 .violet-creation .simple-header { height:calc(90px + env(safe-area-inset-top,0px)); margin-bottom:29px; }
 .violet-creation .simple-header > img { width:min(194px,46vw); height:78px; }
 .violet-creation .creation-form { padding:22px 17px; border-radius:8px; }
 .violet-creation .creation-intro h1 { font-size:43px; }
 .violet-creation .style-options { grid-template-columns:1fr; }
 .violet-creation .style-option > .style-card-body,.violet-creation .style-option:last-child .style-card-body { height:212px; }
 .violet-creation .style-option b { font-size:25px; }
 .violet-creation .style-option .style-description,.violet-creation .style-option:last-child .style-description { font-size:10px; max-width:290px; }
 .violet-creation .form-grid { column-gap:12px; } .violet-creation .form-submit .btn { min-height:51px; }
 .team-heading { gap:9px; } .team-mark.large { width:54px; height:36px; }
 .team-editorial .team-heading,.constructor-standings .team-heading { font-size:25px; }
 .offer-team .team-heading { font-size:26px; } .offer-team .team-mark.large { width:55px; height:38px; }
 .topbar { padding-top:env(safe-area-inset-top,0px); height:calc(71px + env(safe-area-inset-top,0px)); }
 .sidebar { padding-top:env(safe-area-inset-top,0px); } .app-footer { padding-bottom:max(21px,env(safe-area-inset-bottom,0px)); }
 .brand-grid.current-brand { grid-template-columns:1fr; } .brand-showcase { min-height:180px; }
}
@media(prefers-reduced-motion:reduce) { #page-content { animation:none; } .team-parade .team-mark img { transition:none; } }
@media(forced-colors:active) { .creation-photo { display:none; } .photo-backgrounds :is(.next-event,.weekend-header,.race-status-strip) { background-image:none; } }
