/* CarEraHub Studio / V14 visual layer. Presentation only: existing routes, roles and data remain unchanged. */
:root{--bg:#f6f1e9;--panel:#fffdf8;--ink:#32151f;--muted:#816d71;--line:#eadfd8;--brand:#650c28;--brand2:#4b0a20;--gold:#d4a759;--gold-glow:#f4ddb0;--sidebar:#381020;--r:24px;--shadow:0 18px 60px rgba(65,18,35,.085)}
html{background:#f6f1e9}body.webapp-body{background:radial-gradient(ellipse 70% 50% at 99% 0%,#f2dfcb 0%,transparent 74%),#f6f1e9;color:var(--ink);font-family:Manrope,Arial,sans-serif}
.app-shell{grid-template-columns:254px minmax(0,1fr)}.app-sidebar{width:254px;background:linear-gradient(163deg,#400d23 0%,#571128 47%,#290d1b 100%);border:0;color:#fff3df;padding:21px 13px 19px;box-shadow:15px 0 45px rgba(48,13,26,.09)}
.app-sidebar:before{content:'';position:absolute;pointer-events:none;top:-90px;right:-145px;width:265px;height:265px;border:1px solid rgba(255,211,153,.12);border-radius:50%;box-shadow:0 0 0 38px rgba(255,211,153,.022),0 0 0 76px rgba(255,211,153,.017)}
.app-brand{height:80px;padding:9px 17px 24px;color:#fff4e5;border-bottom:1px solid rgba(255,232,203,.12)}.app-brand-copy strong,.app-brand .brand-word{color:#fff8ec!important;font-weight:900;letter-spacing:-.06em}.app-brand-copy .brand-word span{color:#f0bc6f!important}.app-brand-copy small{color:#d7a8b7;font-size:10px}.app-brand img{width:36px;height:36px;filter:drop-shadow(0 8px 12px rgba(0,0,0,.17))}
.app-nav{padding:16px 0;margin-top:2px;gap:3px}.sidebar-bottom{padding:12px 0 0;border-top:1px solid rgba(255,228,200,.12)}.app-nav a,.sidebar-bottom a{position:relative;color:#e6cbd2;border-radius:14px;padding:12px 11px;grid-template-columns:36px 1fr auto;min-height:48px;font-size:12px;font-weight:750;transition:background .22s,color .22s,transform .22s}.app-nav a .icon,.sidebar-bottom a .icon{width:19px;height:19px;stroke-width:1.8;transition:transform .24s ease}.app-nav a>[data-icon],.sidebar-bottom a>[data-icon]{width:33px;height:33px;display:grid;place-items:center;border-radius:10px;background:rgba(255,243,221,.06);color:#eac5a2}.app-nav a:hover,.sidebar-bottom a:hover{background:rgba(244,218,183,.12);color:#fff8eb;transform:translateX(2px)}.app-nav a:hover .icon,.sidebar-bottom a:hover .icon{transform:rotate(-7deg) scale(1.12)}.app-nav a.is-active,.app-nav a.active{background:linear-gradient(99deg,#f4d29b,#c99549);color:#381423;box-shadow:0 9px 22px rgba(26,4,12,.22)}.app-nav a.is-active>[data-icon],.app-nav a.active>[data-icon]{background:rgba(59,20,31,.09);color:#4b1427}.app-nav a.is-active:hover{color:#381423;background:linear-gradient(99deg,#f4d29b,#c99549)}
.app-topbar{height:83px;background:rgba(255,251,244,.87);border-bottom:1px solid rgba(104,41,59,.075);padding:0 clamp(18px,3vw,46px);box-shadow:0 6px 28px rgba(42,14,22,.026)}.topbar-search{max-width:610px;height:46px;border:1px solid #e9dfd7;border-radius:16px;background:#f5f0e9;box-shadow:inset 0 1px 2px rgba(54,17,34,.03);color:#816d71}.topbar-search input{background:transparent!important;color:var(--ink)!important;border:0!important;min-height:0}.topbar-search .icon{color:#8f6770}.icon-btn{background:#fffcf5;border:1px solid #e6dcd4;border-radius:14px;box-shadow:0 5px 15px rgba(60,18,36,.035);color:#5d263b;transition:transform .2s,border-color .2s,background .2s}.icon-btn:hover{transform:translateY(-2px);border-color:#cda874;background:#fff6e7}.icon-btn:hover .icon{transform:rotate(-9deg)}.avatar{background:linear-gradient(145deg,#edc178,#d59b5d);color:#401522;border-radius:14px;box-shadow:0 3px 0 rgba(113,57,20,.08)}.account-button:hover{background:#f8ead8}
.app-view{max-width:1640px;padding:clamp(20px,3vw,44px);padding-bottom:80px}.page-head{align-items:center;margin-bottom:29px}.page-head h1{font-size:clamp(28px,2.7vw,43px);font-weight:850;line-height:1.13;letter-spacing:-.06em}.page-head p{font-size:13px;line-height:1.7}.page-head:before{content:'';position:absolute;pointer-events:none}.section-title h2,.section-title{font-size:clamp(21px,2vw,29px);font-weight:850;letter-spacing:-.042em}.section-title{margin-top:42px;margin-bottom:19px}.split-head>a{color:#782640;font-size:12px;font-weight:850}.split-head>a:hover{text-decoration:underline;text-underline-offset:4px}
.card{background:rgba(255,253,248,.97);border:1px solid #e9dfd6;border-radius:25px;padding:clamp(18px,1.75vw,28px);box-shadow:0 10px 36px rgba(62,22,36,.035);transition:border-color .2s,box-shadow .2s,transform .2s}.card h2{font-size:19px;letter-spacing:-.04em}.card h3{letter-spacing:-.025em}.card:focus-within{border-color:#cba97a}.card p{line-height:1.7}.btn{border-radius:14px;padding:12px 18px;font-size:12px;font-weight:850;min-height:45px;letter-spacing:-.01em;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s,background .2s}.btn:not(:disabled):hover{transform:translateY(-2px)}.btn:not(:disabled):active{transform:translateY(0) scale(.98)}.btn-primary{background:linear-gradient(110deg,#d6a454,#f0ce8b 52%,#c99547);color:#3b1825;box-shadow:0 10px 20px rgba(159,97,31,.14);border:1px solid rgba(143,90,31,.13)}.btn-primary:hover{background:linear-gradient(110deg,#e3b266,#f9da9c 52%,#d4a354);box-shadow:0 14px 26px rgba(159,97,31,.22)}.btn-secondary{background:#f5e7e9;color:#6a1932}.btn-light{background:#fffcf7;border:1px solid #e6d6ce;color:#591b30}.btn-ghost{color:#7b2842;background:transparent}.btn:focus-visible,.app-nav a:focus-visible{outline:3px solid #d2a15d;outline-offset:3px}
.hero-card.hero-card-v5{min-height:420px;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:0;border:1px solid rgba(255,237,202,.17);border-radius:32px;padding:0;background:radial-gradient(circle at 42% 104%,rgba(240,186,116,.13),transparent 33%),linear-gradient(125deg,#390e20 0%,#65132f 55%,#420e23 100%);box-shadow:0 27px 55px rgba(71,14,35,.18);color:#fff5e9}.hero-card.hero-card-v5>div:first-child{position:relative;z-index:1;padding:clamp(30px,4vw,66px) clamp(24px,3.5vw,54px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.hero-card.hero-card-v5 .eyebrow{color:#e7bc77;font-size:10px;letter-spacing:.24em;margin-bottom:24px}.hero-card.hero-card-v5 h1{font-size:clamp(36px,3.4vw,60px);line-height:1.06;max-width:610px;color:#fff7ed;font-weight:850}.hero-card.hero-card-v5 p{color:#e4cbd0;font-size:13px;line-height:1.8;max-width:495px;margin:16px 0 22px}.hero-card.hero-card-v5 .btn-light{background:rgba(255,255,255,.11);color:#fff3dd;border:1px solid rgba(255,241,221,.26)}.hero-card.hero-card-v5 .hero-points{margin-top:30px}.hero-card.hero-card-v5 .hero-points span{border:1px solid rgba(255,227,181,.18);background:rgba(255,225,176,.07);color:#f4e0c6;border-radius:10px;letter-spacing:.01em}.hero-card.hero-card-v5 .hero-visual{margin:0!important;width:100%!important;min-height:100%;border-radius:0;background:#421024;overflow:hidden;border:0}.hero-card.hero-card-v5 .hero-visual:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(57,14,32,.6),transparent 35%),linear-gradient(0deg,rgba(28,8,16,.46),transparent 35%)}.hero-card.hero-card-v5 .hero-visual img{object-position:center center;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}.hero-card.hero-card-v5:hover .hero-visual img{transform:scale(1.045)}.hero-card.hero-card-v5 .hero-float{z-index:1;right:24px;bottom:25px;backdrop-filter:blur(15px);border:1px solid rgba(254,223,173,.28);background:rgba(48,13,28,.78);border-radius:19px;padding:16px 22px}.hero-card.hero-card-v5 .hero-float b{font-size:34px;color:#f5c87f}.hero-card.hero-card-v5 .hero-float small{color:#f8e8d7}
.home-kpis{gap:14px!important}.quick-metric{min-height:133px;display:flex;flex-direction:column;justify-content:space-between;text-decoration:none;position:relative;overflow:hidden;padding:22px 24px;background:#fffdf8}.quick-metric:before{content:'';position:absolute;right:-25px;top:-27px;width:115px;height:115px;border:1px solid rgba(120,45,68,.09);border-radius:50%;box-shadow:0 0 0 18px rgba(133,53,79,.022),0 0 0 35px rgba(133,53,79,.02)}.quick-metric:nth-child(2){background:#f9eee3}.quick-metric:nth-child(3){background:#f5e5e9}.quick-metric:nth-child(4){background:#4d1229;border-color:#4d1229;color:#ffefda}.quick-metric b{color:#6c1936;font-size:clamp(30px,2.7vw,44px);line-height:1.15;font-weight:850;letter-spacing:-.07em}.quick-metric:nth-child(4) b,.quick-metric:nth-child(4) span{color:#fce7c9}.quick-metric span{font-size:12px;font-weight:700;color:#867476;position:relative}.quick-metric:hover{transform:translateY(-4px);box-shadow:0 18px 30px rgba(67,20,38,.105)}
.home-dashboard{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:stretch}.home-dashboard>.card{padding:26px}.home-dashboard>.card:nth-child(2){background:#f3e4dc;border-color:#ead1c4}.quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:17px}.quick-actions a{border:1px solid #eadfd4;background:#fffaf4;border-radius:17px;padding:17px;gap:12px;min-height:90px;transition:transform .24s,background .24s,border-color .24s,box-shadow .24s}.quick-actions a:hover{background:#fcf0dc;border-color:#d6b98b;transform:translateY(-3px);box-shadow:0 11px 24px rgba(69,23,37,.07)}.quick-actions a>.icon{width:37px;height:37px;padding:9px;flex:none;background:#f4e4db;border-radius:12px;color:#752c43;transition:transform .3s}.quick-actions a:hover>.icon{transform:rotate(-8deg) scale(1.08);background:#ecd39f}.quick-actions b{font-size:12px}.quick-actions small{font-size:10px}.appointment-highlight{border:0;background:linear-gradient(140deg,#fffaf1,#f4e5d5);border-radius:17px;padding:24px}.appointment-highlight strong{font-size:21px;letter-spacing:-.045em}
.home-categories{grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.home-category{position:relative;min-height:124px;grid-template-columns:1fr auto;grid-template-rows:auto 1fr auto;align-items:start;background:#fffdf8;border:1px solid #e8dcd3;border-radius:21px;padding:19px;box-shadow:0 7px 22px rgba(61,21,36,.034);transition:transform .25s,border-color .25s,box-shadow .25s}.home-category>span{grid-row:1;grid-column:1/3;width:42px;height:42px;border-radius:14px;background:#f2e3dc;color:#732940;transition:transform .24s,background .24s}.home-category b{grid-column:1/3;grid-row:2;align-self:end;font-size:13px;line-height:1.3;margin-top:10px}.home-category small{grid-column:1/3;grid-row:3;font-size:10px;margin-top:5px}.home-category:after{content:'↗';font-size:21px;position:absolute;right:17px;top:16px;color:#c4a1a1;transition:transform .25s}.home-category:hover{transform:translateY(-5px);border-color:#d4b180;box-shadow:0 17px 30px rgba(68,18,35,.09);background:#fff9ed}.home-category:hover>span{transform:rotate(-9deg) scale(1.09);background:#ecd199}.home-category:hover:after{transform:translate(2px,-2px);color:#7b3247}
.service-grid,.car-grid{gap:17px}.service-card,.car-card{background:#fffdf8;border-radius:23px;overflow:hidden;border:1px solid #e9ddd2;box-shadow:0 8px 30px rgba(64,18,33,.043);transition:transform .26s,box-shadow .26s,border-color .26s}.service-card:hover,.car-card:hover{transform:translateY(-5px);border-color:#d4ae7d;box-shadow:0 20px 34px rgba(64,18,33,.12)}.service-cover,.car-cover{height:210px;background:#eadace;overflow:hidden}.service-cover img,.car-cover img{transition:transform .7s}.service-card:hover .service-cover img,.car-card:hover .car-cover img{transform:scale(1.045)}.service-monogram{background:radial-gradient(circle at 78% 12%,#f6e2c0,transparent 40%),linear-gradient(145deg,#e5d2cd,#f2e8dc);color:#622c41}.service-monogram>strong{font-weight:600}.service-body,.car-body{padding:21px}.badge,.chip{border-radius:9px}.metric{position:relative;overflow:hidden;min-height:119px;background:#fffdf8;border-radius:22px}.metric b{font-weight:850;font-size:clamp(23px,2vw,35px);line-height:1.25;letter-spacing:-.055em;color:#75213b}.metric span{font-size:12px;line-height:1.5}.metric:after{content:'';position:absolute;top:-25px;right:-18px;width:75px;height:75px;border:1px solid #efded3;border-radius:50%;box-shadow:0 0 0 17px rgba(219,173,118,.055)}
.tabs{gap:7px;border:0;padding:5px;background:#eee4dc;border-radius:15px;scrollbar-width:thin}.tabs a,.tabs button{border-radius:11px;border:0!important;padding:12px 15px;font-size:12px;font-weight:800;color:#81666f}.tabs .is-active,.tabs a.is-active{background:#5c1730;color:#fff4e9!important;box-shadow:0 6px 13px rgba(78,19,43,.14)}.field input,.field select,.field textarea,.filter-bar input,.filter-bar select{background:#fffaf3!important;border:1px solid #e6d8ce!important;border-radius:13px;min-height:46px}.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid #cda45f;outline-offset:1px}.slot,.schedule-slot>button:first-child{border-radius:11px}.slot.is-selected{background:#6e1937;color:white}.table-wrap{border:1px solid #e9ddd5;border-radius:16px}.table th{color:#815d69;background:#f7eee7;font-size:11px}.table td{background:#fffdf8}.appointment-row,.history-row{border-bottom:1px solid #efe6df;padding:16px 0}.notification-row.notification-clickable:hover{background:#fff4e6}
/* Evidence-only charts: values always computed from appointments returned by the API. */
.ceh-intelligence{margin:17px 0 0;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.75fr);gap:16px}.ceh-chart-card{background:#fffdf8;min-width:0}.ceh-chart-card h2{margin-bottom:4px}.ceh-chart-caption{font-size:11px;color:#86737a;line-height:1.6;margin:0 0 14px}.ceh-chart-scroll{overflow:auto}.ceh-chart-svg{display:block;width:100%;min-width:315px;max-height:210px}.ceh-chart-guide{stroke:#efe5dd;stroke-width:1;stroke-dasharray:3 5}.ceh-chart-column{fill:#a55c72;transition:fill .2s}.ceh-chart-column:nth-of-type(2n){fill:#c89d60}.ceh-chart-column:hover{fill:#67213d}.ceh-chart-label{fill:#876e74;font:11px Manrope,sans-serif}.ceh-chart-value{fill:#58233a;font:700 11px Manrope,sans-serif}.ceh-status-track{height:15px;border-radius:99px;display:flex;overflow:hidden;background:#eee3dc;margin:19px 0 20px}.ceh-status-segment{min-width:0;transition:filter .2s}.ceh-status-segment:hover{filter:brightness(1.12)}.ceh-status-list{display:grid;gap:12px}.ceh-status-row{display:grid;grid-template-columns:11px minmax(0,1fr) auto;gap:8px;align-items:center;font-size:12px}.ceh-status-dot{width:9px;height:9px;border-radius:50%}.ceh-status-row b{font-size:12px}.ceh-chart-empty{padding:30px 13px;border:1px dashed #dcccc0;border-radius:13px;text-align:center;color:#8c747b;font-size:12px;line-height:1.7}
.garage-tip{background:linear-gradient(125deg,#421022,#6a1a34);border-color:#764356;border-radius:18px}.garage-tip>span{background:#e1ae65}.vehicle-placeholder,.service-monogram{position:relative;overflow:hidden}.vehicle-placeholder:after,.service-monogram:after{content:'';position:absolute;width:200px;height:200px;right:-100px;bottom:-100px;border:1px solid rgba(104,25,51,.13);border-radius:50%;box-shadow:0 0 0 24px rgba(116,36,64,.035),0 0 0 48px rgba(116,36,64,.024)}
@media(max-width:1100px){.app-shell{grid-template-columns:234px minmax(0,1fr)}.app-sidebar{width:234px}.home-categories{grid-template-columns:repeat(2,minmax(0,1fr))}.home-dashboard{grid-template-columns:1fr}.ceh-intelligence{grid-template-columns:1fr 1fr}}
@media(max-width:860px){.app-shell{grid-template-columns:minmax(0,1fr)}.app-sidebar{width:min(300px,87vw);transform:translateX(-105%)}.app-sidebar.is-open{transform:none}.app-view{padding:22px 17px 60px}.app-topbar{height:70px;padding:0 17px}.hero-card.hero-card-v5{grid-template-columns:1fr;min-height:0}.hero-card.hero-card-v5>div:first-child{padding:35px 30px 30px}.hero-card.hero-card-v5 .hero-visual{height:225px;min-height:225px;width:100%!important;margin:0!important}.hero-card.hero-card-v5 .hero-visual:after{background:linear-gradient(0deg,rgba(28,8,16,.4),transparent 75%)}.hero-card.hero-card-v5 h1{font-size:clamp(32px,6vw,44px)}.ceh-intelligence{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.app-topbar{gap:8px}.app-view{padding:18px 13px 50px}.page-head h1{font-size:29px}.home-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}.quick-metric{min-height:112px;padding:16px}.quick-metric b{font-size:29px}.quick-metric span{font-size:10px}.home-categories{grid-template-columns:repeat(2,minmax(0,1fr))}.home-category{min-height:128px;padding:14px}.quick-actions{grid-template-columns:1fr}.home-dashboard>.card{padding:19px}.ceh-intelligence{grid-template-columns:1fr}.hero-card.hero-card-v5>div:first-child{padding:30px 22px}.hero-card.hero-card-v5 .hero-visual{height:190px;min-height:190px}.hero-card.hero-card-v5 .hero-float{right:12px;bottom:12px;padding:9px 13px}.hero-card.hero-card-v5 .hero-points{display:flex;gap:6px;flex-wrap:wrap;margin-top:18px}.hero-card.hero-card-v5 .hero-points span{font-size:9px;padding:6px 8px}.service-cover,.car-cover{height:190px}.app-topbar .account-button{padding:3px}}
@media(max-width:380px){.home-kpis,.home-categories{grid-template-columns:1fr!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.app-sidebar,.app-topbar{display:none!important}.app-shell{display:block}.app-main,.app-view{margin:0;padding:0}.card{box-shadow:none}}

.quick-metric>.quick-metric-icon{position:absolute;top:15px;right:16px;width:37px;height:37px;border-radius:12px;display:grid;place-items:center;background:#f1e2d6;color:#76253d;z-index:1}.quick-metric>.quick-metric-icon .icon{width:18px;height:18px;transition:transform .25s}.quick-metric:hover>.quick-metric-icon .icon{transform:rotate(-11deg) scale(1.15)}.quick-metric:nth-child(4)>.quick-metric-icon{background:rgba(242,202,140,.16);color:#f3ca8c}
