/* HomeZero scene parts: materials and details for the buildings, vehicles and street furniture (scene-parts.js, scene-parts2.js).
   Builds on scene-iso.css tokens; load it after scene-iso.css. Three tones per material come from .t / .l / .r (see scene-iso.css). */
.hzi { --hzi-frame: rgba(248, 250, 252, .92); --hzi-lamp: .2; --hzi-shop: #efe9dc; --hzi-tile: rgba(0, 0, 0, .26); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .hzi { --hzi-lamp: .05; --hzi-tile: rgba(0, 0, 0, .18); --hzi-shop: #fffaf0; } }
:root[data-theme="light"] .hzi { --hzi-lamp: .05; --hzi-tile: rgba(0, 0, 0, .18); --hzi-shop: #fffaf0; }

/* line work: every path made by lines() */
.hzi :is(.wm, .slab, .ribs, .rolll, .bump, .tiles, .ridge, .pipe, .pole, .walkj, .fence, .lampp, .bay, .rdash, .vl, .cartl) { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.hzi .wm { stroke: var(--hzi-frame); stroke-width: .9; opacity: .85; }
.hzi .slab { stroke: rgba(0, 0, 0, .2); stroke-width: 2; }
.hzi .ribs { stroke: rgba(0, 0, 0, .13); stroke-width: 1; }
.hzi .rolll { stroke: rgba(0, 0, 0, .3); stroke-width: .8; }
.hzi .bump { stroke: #1f2937; stroke-width: 2.4; }
.hzi .tiles { stroke: var(--hzi-tile); stroke-width: 1; }
.hzi .ridge { stroke: color-mix(in srgb, var(--brand-2, #7c3aed), #000 45%); stroke-width: 2.4; }
.hzi .pipe { stroke: #aab4c6; stroke-width: 1.8; }
.hzi .pole { stroke: #8d98ad; stroke-width: 1.6; }
.hzi .walkj { stroke: rgba(0, 0, 0, .15); stroke-width: 1; }
.hzi .fence { stroke: #e8dcc6; stroke-width: 1.5; }
.hzi .lampp { stroke: #94a3b8; stroke-width: 1.8; }
.hzi .bay { stroke: #fff; stroke-width: 2; }
.hzi .rdash { stroke: rgba(255, 255, 255, .6); stroke-width: 1.6; }
.hzi .vl { stroke: rgba(0, 0, 0, .28); stroke-width: .9; }
.hzi .cartl { stroke: #9aa6ba; stroke-width: 1; }

/* windows and doors */
.hzi .glass { stroke: var(--hzi-frame); stroke-width: 1; stroke-linejoin: round; }
.hzi .glass.gx:not([class*=lit]) { fill: color-mix(in srgb, var(--hzi-glass), #000 24%); }
.hzi .sill { fill: color-mix(in srgb, var(--hzi-house), #fff 30%); }
.hzi .shut { fill: color-mix(in srgb, var(--brand, #4f46e5), #fff 12%); }
.hzi .dfr { fill: var(--hzi-frame); }
.hzi .ent { fill: color-mix(in srgb, var(--hzi-glass), #fff 22%); }
.hzi .plinth { fill: rgba(0, 0, 0, .22); }
.hzi .band { fill: rgba(0, 0, 0, .1); }
.hzi .m-step { --b: #b6bfd0; } .hzi .m-canopy { --b: #cfd6e4; } .hzi .m-hedge { --b: color-mix(in srgb, var(--hzi-grass-b), #000 6%); }
.hzi .m-pole { --b: #9aa6ba; } .hzi .m-sign { --b: #e2e8f0; } .hzi .m-cart { --b: #b0bacb; }
.hzi .m-wh2 { --b: color-mix(in srgb, var(--hzi-wh), #fff 28%); } .hzi .m-dock { --b: #8e98ad; }

/* house */
.hzi .roof2 { fill: color-mix(in srgb, var(--brand-2, #7c3aed), #000 18%); }
.hzi .fascia { fill: color-mix(in srgb, var(--hzi-house), #000 28%); }
.hzi .walk { fill: color-mix(in srgb, var(--hzi-house), #000 8%); opacity: .85; }
.hzi .leaf3 { fill: color-mix(in srgb, var(--hzi-grass-a), #fff 22%); }

/* ground */
.hzi .lot { fill: color-mix(in srgb, var(--hzi-road), #000 12%); }
.hzi .walk2 { fill: color-mix(in srgb, var(--hzi-road), #fff 22%); }
.hzi .mat { fill: #475569; }
.hzi .lampg { fill: var(--hzi-lit); opacity: var(--hzi-lamp); } .hzi .lamph { fill: var(--hzi-lit); }
.hzi .lampk { fill: var(--hzi-lit); opacity: calc(var(--hzi-lamp) * .6); }
.hzi .lampb { fill: #475569; } .hzi .lamphd { fill: #64748b; stroke: #334155; stroke-width: .6; }
.hzi .lampc { stroke: #64748b; stroke-width: 3.4; fill: none; stroke-linecap: round; }

/* supermarket (neutral name, no real brand) */
.hzi .m-shop { --b: var(--hzi-shop); } .hzi .m-shop2 { --b: color-mix(in srgb, var(--hzi-shop), #000 14%); }
.hzi .bar { fill: var(--brand, #4f46e5); } .hzi .bar.bx { fill: color-mix(in srgb, var(--brand, #4f46e5), #000 35%); }
.hzi .logo { fill: #fff; } .hzi .leaf { fill: var(--brand, #4f46e5); }
.hzi .shoptxt { fill: #fff; font-family: var(--font, system-ui, sans-serif); font-weight: 800; letter-spacing: .04em; }
.hzi .shopglass { fill: color-mix(in srgb, var(--hzi-glass), var(--hzi-lit) 38%); stroke: var(--hzi-frame); stroke-width: .8; }
.hzi .dpan { fill: color-mix(in srgb, var(--hzi-glass), #fff 30%); }
.hzi .goods { stroke: none; } .hzi .g0 { fill: #ef4444; } .hzi .g1 { fill: #f59e0b; } .hzi .g2 { fill: #22c55e; }
.hzi .dockd { fill: #64748b; } .hzi .ad { fill: color-mix(in srgb, var(--hzi-acc), #fff 20%); } .hzi .ad2 { fill: rgba(255, 255, 255, .8); } .hzi .adc { fill: #fff; }
.hzi .psign { fill: #2563eb; stroke: #fff; stroke-width: 1; } .hzi .psigt { fill: #fff; font-family: var(--font, system-ui, sans-serif); font-weight: 800; }
.hzi .bayfree { fill: var(--hzi-acc); opacity: .16; }
.hzi .skyl { fill: color-mix(in srgb, var(--hzi-glass), #fff 30%); opacity: .9; }

/* office, warehouse, dock */
.hzi .solar { fill: #1e3a8a; stroke: #93c5fd; stroke-width: .7; }
.hzi .flag { fill: var(--brand-2, #7c3aed); }
.hzi .fan { fill: #475569; }
.hzi .roll { fill: #c2c9d6; } .hzi .hazard { fill: #facc15; }

/* vehicles: m-c* private cars, m-v0 / m-v1 the two lease colours, m-vw delivery van */
.hzi .m-c0 { --b: var(--hzi-car); } .hzi .m-c1 { --b: #aab4c6; } .hzi .m-c2 { --b: #3b82a6; }
.hzi .m-v0 { --b: var(--brand, #4f46e5); } .hzi .m-v1 { --b: #e9eef8; } .hzi .m-vw { --b: #f4f6fb; }
.hzi .veh .glass { stroke-width: .6; }
.hzi .glass.gt { fill: color-mix(in srgb, var(--hzi-glass), #fff 22%); }
.hzi .vs { fill: var(--hzi-acc); } .hzi .plate { fill: #f1f5f9; }
.hzi .veh .light { fill: #fff7c2; }
.hzi .rim { fill: #cbd5e1; }