:root{color-scheme:dark;--bg:#090d17;--panel:#111827;--line:#253044;--cyan:#4de0e6;--muted:#94a3b8;--purple:#b794ff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#eaf2ff;font:15px/1.5 system-ui,-apple-system,sans-serif}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button{cursor:pointer;border:1px solid var(--line);color:inherit;background:#172236;padding:11px 17px;border-radius:9px;transition:background .2s,transform .2s}button:hover{background:#253a50;transform:translateY(-1px)}button:disabled{opacity:.45;cursor:not-allowed;transform:none}button.primary{background:var(--cyan);color:#081821;font-weight:750;border-color:var(--cyan)}button.danger{color:#ffb6c0}a{color:inherit;text-decoration:none}.small{padding:8px 12px;font-size:12px}aside{position:fixed;width:230px;inset:0 auto 0 0;border-right:1px solid var(--line);padding:33px 23px;background:#0c111d;display:flex;flex-direction:column;z-index:2}.brand{font-size:29px;font-style:italic;font-weight:950;letter-spacing:3px;color:var(--cyan)}.brand span{display:block;font-size:9px;font-style:normal;color:var(--muted);letter-spacing:3px;margin-top:5px}.nav-label{font-size:10px;letter-spacing:2px;color:#6d7e98;margin:55px 14px 13px}nav{display:grid;gap:7px}nav a{padding:13px;border-radius:8px;display:flex;gap:13px;align-items:center;color:var(--muted)}nav a.active{background:#163139;color:var(--cyan);border-left:2px solid var(--cyan)}.icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.side-bottom{margin-top:auto;font-size:11px;color:var(--muted)}.status-dot{display:inline-block;width:6px;height:6px;background:var(--cyan);border-radius:50%;box-shadow:0 0 9px var(--cyan)}.side-bottom p{margin-top:25px;line-height:1.8}.shell{margin-left:230px}header{height:82px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 40px;font-size:11px;letter-spacing:1.5px;color:var(--muted)}header div{display:flex;align-items:center;gap:18px}.mode{padding:9px 40px;background:#191a30;color:#cab9ef;font-size:11px;letter-spacing:1px}main{padding:36px 40px;max-width:1600px;margin:auto;min-height:80vh}.eyebrow{font-size:11px;color:var(--cyan);letter-spacing:3px;text-transform:uppercase}h1{font-size:clamp(27px,3vw,42px);line-height:1.2;margin:8px 0 12px;letter-spacing:-1px}h2{font-size:20px;margin:0 0 18px}h3{margin:0;font-size:18px}p{color:var(--muted)}.heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:27px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:25px 0}.panel,.stat{background:linear-gradient(140deg,#141d2e,#0f1623);border:1px solid var(--line);border-radius:15px;padding:23px}.stat small{display:block;color:var(--muted);font-size:11px;letter-spacing:1px;text-transform:uppercase}.stat strong{font-size:28px;display:block;margin-top:7px}.stat em{color:var(--cyan);font:11px system-ui}.hero{position:relative;overflow:hidden;min-height:330px;border:1px solid #315064;border-radius:17px;padding:34px;background:radial-gradient(ellipse at 75% 35%,#193b43 0,transparent 60%),linear-gradient(120deg,#142436,#121b2e)}.hero::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(120deg,transparent 0 65px,#a1e3ec06 66px 67px);pointer-events:none}.hero-copy{position:relative;z-index:1;max-width:45%}.hero h1{font-size:38px}.hero .car-visual{position:absolute;right:3%;top:40px;width:54%;height:230px}.car-visual{height:180px;width:100%;object-fit:contain;filter:drop-shadow(0 18px 12px #0008)}.badge{display:inline-block;border:1px solid #355363;background:#152f3a;color:var(--cyan);padding:4px 9px;border-radius:5px;font-size:10px;letter-spacing:1px}.badge.purple{color:var(--purple);border-color:#483660;background:#261d3a}.car-card{padding:0;overflow:hidden;transition:border-color .2s,transform .2s}.car-card:hover{border-color:#43727d;transform:translateY(-3px)}.car-top{padding:20px 21px 0;display:flex;justify-content:space-between}.car-stage{background:radial-gradient(ellipse at center,#26394755,transparent 70%);padding:10px 15px}.car-body{padding:0 22px 22px}.car-body p{margin:3px 0 18px;font-size:12px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;border-top:1px solid var(--line);padding-top:15px;margin-bottom:19px}.metrics b{font-size:18px;display:block}.metrics small{font-size:10px;color:var(--muted)}.actions{display:flex;gap:9px;flex-wrap:wrap}.actions button{flex:1}.two{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;margin-top:25px}.line{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--line);gap:15px}.line:last-child{border:0}.line small{color:var(--muted)}.progress{height:5px;border-radius:8px;background:#263146;overflow:hidden;margin:12px 0}.progress span{display:block;height:100%;background:var(--cyan);width:65%}.toolbar{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px}input,select{background:#0d1523;border:1px solid var(--line);padding:11px;border-radius:8px;color:#edf4ff;min-width:0}label{display:grid;gap:7px;font-size:12px;color:var(--muted);margin-bottom:16px}.toolbar input{flex:1}.part small{color:var(--muted)}.part h3{margin:12px 0}.part .price{font-size:22px;margin:19px 0;color:var(--cyan)}.part p{min-height:48px;font-size:12px}.avatar{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;background:#192839}.avatar-preview{max-width:290px;display:block;margin:0 auto 25px}.avatars{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.avatars button{padding:5px}.avatars button.selected{border-color:var(--cyan);box-shadow:0 0 0 1px var(--cyan)}.empty{padding:50px;text-align:center;border:1px dashed var(--line);border-radius:15px}.selected-part{border-color:var(--cyan);background:#183439}.part-choice{display:flex;align-items:flex-start;gap:12px;padding:15px;border:1px solid var(--line);border-radius:10px;margin-bottom:10px}.part-choice input{margin-top:6px;accent-color:var(--cyan)}.part-choice label{margin:0;flex:1}.part-choice small{font-size:11px}footer{display:flex;justify-content:space-between;padding:20px 40px;border-top:1px solid var(--line);color:var(--muted);font-size:10px;letter-spacing:1px}dialog{background:#101b2b;color:#edf4ff;border:1px solid #385465;border-radius:16px;width:min(650px,90vw);padding:27px;max-height:85vh}dialog::backdrop{background:#02050acb;backdrop-filter:blur(5px)}#toast{position:fixed;bottom:25px;right:25px;background:#163b42;border:1px solid var(--cyan);border-radius:10px;padding:16px;max-width:90vw;z-index:20}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line);font-size:13px}th{color:var(--muted)}.mobile-only{display:none}@media(max-width:1100px){aside{width:190px;padding:25px 15px}.shell{margin-left:190px}main{padding:25px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-copy{max-width:55%}.stats{grid-template-columns:repeat(2,1fr)}header{padding:0 25px}.two{grid-template-columns:1fr}.avatars{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){aside{position:static;width:auto;padding:15px;border-right:0}.brand{font-size:22px}.nav-label,.side-bottom{display:none}nav{display:flex;overflow:auto;margin-top:12px}nav a{white-space:nowrap;padding:10px;font-size:12px;gap:6px}.shell{margin-left:0}header{height:60px;padding:0 16px}header div{gap:8px}#user{display:none}main{padding:22px 16px}.mode{padding:8px 16px;font-size:9px}.grid{grid-template-columns:1fr}.hero{padding:25px;min-height:420px}.hero-copy{max-width:100%}.hero .car-visual{top:230px;right:4%;width:92%;height:170px}.hero h1{font-size:30px}.heading{align-items:flex-start}.heading>button{font-size:11px}.stat{padding:16px}.stat strong{font-size:24px}.panel{padding:18px}.car-card{padding:0}footer{padding:20px 16px;display:block}footer span{display:block;margin-top:6px}.toolbar>*{width:100%}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Gestaltung aus /home/crm/octane-demo: violette Neon-Garage. */
:root{--bg:#080b12;--panel:#111621;--line:#2a3446;--cyan:#bb55ff;--purple:#c365ff;--muted:#9eabc2}body{font-family:Arial,system-ui,sans-serif}h1,h2,h3,.brand{font-family:'Arial Narrow',Impact,Arial,sans-serif;text-transform:uppercase;letter-spacing:.4px}h1{font-style:italic}.brand{color:#f1f3fa;font-size:32px;letter-spacing:1px;white-space:nowrap}.brand i{color:#b132ff;font-style:italic;margin-right:3px}.brand span{font-family:Arial,sans-serif;font-size:8px;letter-spacing:1.6px}aside{background:#090c13;padding-top:25px;width:235px}.shell{margin-left:235px}header{height:95px;background:#090c13;padding:0 22px;gap:18px}header #topnav{display:flex;gap:3px;flex:1;justify-content:center}#topnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-size:10px;padding:15px 9px;min-height:76px;border-radius:0}#topnav a.active{background:linear-gradient(0deg,#381058,transparent);border-bottom:3px solid #b132ff;border-left:0;color:#e0bdff}#topnav .icon{width:23px;height:23px}.header-crumb{display:none}#user{border:1px solid var(--line);border-radius:9px;padding:12px;font-size:11px}nav a.active{background:linear-gradient(110deg,#8611f5,#b540f5);color:#fff;border-left:0;box-shadow:0 0 15px #9e20ff22}.nav-label{margin-top:24px}nav a{padding:15px 12px}.mode{background:#171022;color:#c6a6e9}button.primary{background:linear-gradient(110deg,#8611f5,#b540f5);border-color:#b751ff;color:white}button:hover{border-color:#ad4cff}.panel,.stat{background:linear-gradient(130deg,#111621,#090e16);border-radius:11px}.badge{background:#602296;border-color:#793e9f;color:white}.badge.purple{background:#602296;color:white;border-color:#a147ee}.car-card:hover{border-color:#b132ff;box-shadow:0 0 12px #a321ff55}.car-stage{background:radial-gradient(ellipse at center,#41255b,#111621 70%)}.car-body h3{font-size:21px;line-height:1.1}.car-body p{font-size:11px}.hero.original-hero{padding:20px;display:grid;grid-template-columns:190px minmax(0,1fr) 235px;gap:15px;min-height:450px;background:radial-gradient(ellipse at 55% 45%,#35254c,#0b111c 75%);border-color:#2a3446}.original-hero::after{display:none}.hero-spec,.hero-tuning{background:#080c14dc;border:1px solid #394052;border-radius:8px;padding:17px;z-index:1}.hero-spec h1{font-size:29px}.hero-spec .line{font-size:12px;display:block}.hero-spec .line b{display:block;margin-top:4px}.hero-tuning h2{font-size:22px}.hero-tuning .line{font-size:12px}.hero-tuning p{font-size:12px}.hero-tuning button{width:100%;font-size:12px}.hero-tuning .character-link{display:block;margin-top:16px;font-size:11px;color:#c6a6e9}.original-stage{position:relative;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}.original-stage .garage-art{position:absolute;top:8%;left:-15%;width:130%;height:80%}.hero .original-stage .car-visual{position:absolute;top:10%;right:auto;width:100%;height:75%}.view-switch{display:flex;justify-content:center;gap:6px;position:relative;z-index:1;background:#080b12cc;padding:7px;border-radius:8px}.view-switch button{padding:9px;font-size:11px}.reference-note{font-size:10px;color:#c6a6e9;margin:13px 0}.garage-section{padding:16px;border:1px solid var(--line);border-radius:11px;background:linear-gradient(130deg,#111621,#090e16)}.garage-section h2{margin:0}.garage-section h2 small{font:10px Arial;color:var(--muted);margin-left:8px}.original-cars{grid-template-columns:repeat(6,minmax(0,1fr));gap:11px}.original-cars .car-top{padding:10px 8px 0;display:block}.original-cars .car-top small{display:none}.original-cars .badge{font-size:9px}.original-cars .car-visual{height:90px}.original-cars .car-body{padding:10px}.original-cars h3{font-size:17px}.original-cars .metrics{display:none}.original-cars .actions{display:grid;gap:5px}.original-cars .actions button{padding:7px;font-size:10px}.event{background:linear-gradient(120deg,#451753,#18234d)!important}.progress span{background:linear-gradient(90deg,#8524ff,#bf5aff)}#toast{background:#28133e;border-color:#a844fa}main{padding:20px;max-width:1600px}.selected-part{border-color:#b132ff;background:#28173b}.avatars button.selected{border-color:#b132ff;box-shadow:0 0 0 1px #b132ff}@media(max-width:1250px){aside{width:195px;padding-left:16px;padding-right:16px}.shell{margin-left:195px}header{padding:0 15px}#topnav a{padding:12px 5px;font-size:9px}.hero.original-hero{grid-template-columns:165px minmax(0,1fr) 205px;gap:10px}.hero-spec h1{font-size:25px}.original-cars{grid-template-columns:repeat(3,minmax(0,1fr))}header #user{display:none}}@media(max-width:900px){aside{position:static;width:auto;padding:16px;border-right:0}.brand{font-size:28px}.nav-label,.side-bottom{display:none}aside nav{display:flex;overflow:auto;margin-top:15px}aside nav a{white-space:nowrap;padding:11px;font-size:12px}.shell{margin-left:0}header{height:75px}header #topnav{justify-content:flex-start;overflow:auto}#topnav a{white-space:nowrap;min-height:60px}.hero.original-hero{min-height:400px}.original-cars{grid-template-columns:repeat(3,minmax(0,1fr))}.brand span{font-size:9px}}@media(max-width:650px){header #topnav{display:none}header{height:50px;justify-content:flex-end}.hero.original-hero{grid-template-columns:1fr;min-height:0;padding:14px}.hero-spec{padding:15px}.hero-spec h1{font-size:30px}.hero-spec .line{display:inline-block;vertical-align:top;width:32%;border:0;padding:8px 3px}.hero-spec p{margin:8px 0}.original-stage{min-height:230px;grid-row:2}.original-stage .garage-art{top:0;left:-5%;width:110%;height:85%}.hero-tuning{grid-row:3}.hero-tuning .line{padding:8px 0}.original-cars{grid-template-columns:repeat(2,minmax(0,1fr))}.original-cars .car-visual{height:100px}.garage-section{padding:12px}.garage-section .heading{display:block}.garage-section .heading a{font-size:12px;display:block;margin-top:8px}.original-cars h3{font-size:18px}main{padding:12px}.original-cars .actions{display:flex;flex-wrap:wrap}}

.brand .octane-logo{display:block;width:170px;max-width:100%;height:170px;object-fit:contain;margin:0 auto 8px}.brand{display:block;text-align:center}@media(max-width:800px){.brand .octane-logo{width:96px;height:96px}}