*{box-sizing:border-box} :root{color-scheme:light;--bg:#f3f6f4;--panel:#fff;--surface:#eaf1ed;--text:#1b2c25;--muted:#53695f;--accent:#167560;--line:#d1dcd6;--soft:#dceee5;--warn:#986520} :root[data-theme=dark]{color-scheme:dark;--bg:#101719;--panel:#182224;--surface:#1c292b;--text:#ecf2ef;--muted:#95a5a6;--accent:#79ddc6;--line:#334343;--soft:#203c36;--warn:#e9b96c}
body{margin:0;background:var(--bg);color:var(--text);font:15px system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}a{color:var(--accent)}button{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:11px 14px;min-height:44px}svg{max-width:100%}.app{max-width:1080px;margin:auto;min-height:100dvh;padding:max(16px,env(safe-area-inset-top)) 22px calc(100px + env(safe-area-inset-bottom))}header{display:flex;align-items:center;justify-content:space-between;gap:12px;height:64px;border-bottom:1px solid var(--line);margin-bottom:28px}.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:850;letter-spacing:1px}.logo{display:grid;place-items:center;background:#79ddc6;color:#133f34;font-size:24px;font-style:italic;width:38px;height:38px;border-radius:11px}.brand small{display:block;font-size:8px;letter-spacing:2px;font-weight:500;margin-top:3px}.header-actions{display:flex;gap:7px}.header-actions button{padding:8px 12px}.eyebrow{font-size:10px;letter-spacing:1.8px;text-transform:uppercase;color:var(--accent);font-weight:650}h1{font-size:clamp(30px,5vw,46px);font-weight:650;letter-spacing:-1.6px;line-height:1.13;margin:14px 0}h1 em{font-style:normal;color:var(--accent)}h2{font-size:20px;font-weight:650;letter-spacing:-.5px;margin:0 0 10px}h3{font-size:16px;margin:0 0 7px}p{color:var(--muted);line-height:1.65}small{color:var(--muted);font-size:12px}.intro{margin-bottom:25px}.row{display:flex;justify-content:space-between;align-items:center;gap:12px}.wrap{flex-wrap:wrap}.card{padding:22px;border:1px solid var(--line);border-radius:17px;background:var(--panel);margin:16px 0}.hero{background:linear-gradient(125deg,var(--panel) 15%,var(--soft));}.tag{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:6px;padding:5px 8px;color:var(--accent);font-size:10px;letter-spacing:.6px}.tag.demo{color:var(--warn)}.hero h2{font-size:27px;margin-top:18px}.hero .moto{height:145px;width:100%;object-fit:contain;margin:12px 0}.number{font-size:34px;font-weight:700;letter-spacing:-1px}.number span{font-size:13px;letter-spacing:0;font-weight:400;color:var(--muted)}.divider{border-top:1px solid var(--line);padding-top:16px;margin-top:16px}.button{background:var(--accent);color:var(--bg);font-weight:650;border-color:var(--accent)}.secondary{background:var(--surface);color:var(--text);border-color:var(--line)}.actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:17px}.actions button{flex:1}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}.metric{border:1px solid var(--line);border-radius:13px;padding:16px;background:var(--panel);min-width:0}.metric b{display:block;font-size:25px;font-weight:650;margin-top:8px}.metric b span{font-size:12px;font-weight:400;color:var(--muted)}.source{font-size:11px;color:var(--accent);margin:12px 0}.notice{background:var(--surface);border-radius:10px;padding:14px;color:var(--muted);font-size:12px;line-height:1.7;margin:14px 0}.empty{padding:20px 0;color:var(--muted);line-height:1.7}.item{padding:17px 0;border-bottom:1px solid var(--line)}.item p{font-size:12px;margin:6px 0}.fleet-button{display:block;width:100%;text-align:left;margin:10px 0;padding:18px}.fleet-button.selected{border-color:var(--accent);background:var(--soft)}select,input{max-width:100%;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:9px;padding:12px;min-height:44px}label{display:block;font-size:12px;color:var(--muted);margin:12px 0}label input:not([type=checkbox]):not([type=range]){display:block;width:100%;margin-top:6px}input[type=range]{width:100%;accent-color:var(--accent);padding:0}nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:repeat(4,1fr);width:min(100%,1080px);padding:9px 8px max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--panel);z-index:5}nav button{border:0;background:none;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:5px;font-size:10px;padding:7px;min-height:53px}nav button.active{color:var(--accent);background:var(--surface)}.icon{width:21px;height:21px;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.tabs{display:flex;gap:6px;overflow-x:auto;margin:16px 0;padding-bottom:7px}.tabs button{white-space:nowrap;font-size:12px}.tabs .active,.selected{border-color:var(--accent);color:var(--accent)}.universe{display:grid;grid-template-columns:1fr 1fr;gap:10px}.universe button{text-align:left;padding:18px;min-height:110px}.universe small{display:block;margin-top:10px}.chart{width:100%;height:auto;color:var(--accent)}.chart text{fill:var(--muted);font:10px system-ui}.map{background:var(--surface);border:1px solid var(--line);border-radius:13px;overflow:hidden}.map svg{display:block;width:100%;height:auto}.map .road{stroke:var(--line);stroke-width:13;fill:none}.map button{border:0}.map-label{padding:8px 12px;font-size:11px;color:var(--muted)}.report-note{color:var(--warn);font-size:12px}dialog{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:18px;padding:24px;width:min(94%,500px);max-height:85dvh}dialog::backdrop{background:#0008;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;font-size:11px;letter-spacing:1px}.error,.network{color:var(--warn);font-size:13px;line-height:1.7}.network:empty{display:none}footer{font-size:10px;color:var(--muted);margin-top:30px;padding-top:18px;border-top:1px solid var(--line)}.widget-wide{grid-column:1/-1}.edit-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0}.edit-row label{flex:1}progress{accent-color:var(--accent);width:100%;height:7px}.note{white-space:pre-wrap;overflow-wrap:anywhere}
@media(min-width:760px){.app{padding-left:40px;padding-right:40px}.home-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.universe{grid-template-columns:repeat(3,1fr)}.hero .moto{height:180px}}
@media(max-width:360px){.app{padding-left:14px;padding-right:14px}.card{padding:16px}.brand{font-size:12px}.header-actions{gap:3px}.header-actions button{padding:7px}}

/* Garage: navigation above a full-width, vertically flowing detail panel. */
#view[data-page="garage"]{display:block;min-width:0;width:100%;max-width:100%;overflow-wrap:anywhere}
#view[data-page="garage"]>.tabs{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px;overflow:visible;width:100%;padding:0;margin:20px 0 12px}
#view[data-page="garage"]>.tabs button{flex:1 1 140px;min-width:0;white-space:normal;text-align:center;line-height:1.4}
#view[data-page="garage"]>.card{display:block;clear:both;width:100%;max-width:100%;min-width:0;writing-mode:horizontal-tb}
#view[data-page="garage"] .grid{grid-template-columns:minmax(0,1fr)}
#view[data-page="garage"] .row{flex-wrap:wrap}
#view[data-page="garage"] .row>div{min-width:0;flex:1 1 160px}
#view[data-page="garage"] .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
#view[data-page="garage"] .item{min-width:0}
@media(max-width:599px){#view[data-page="garage"]>.tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}#view[data-page="garage"]>.tabs button{width:100%;min-height:48px}#view[data-page="garage"] .metrics{grid-template-columns:minmax(0,1fr)}}

/* All four views keep long labels and metrics within the viewport. */
.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.row{flex-wrap:wrap}.row>*{min-width:0}.tabs{flex-wrap:wrap;overflow:visible}.tabs button{white-space:normal}.metric b,.item,.tag{overflow-wrap:anywhere}select{width:100%}#view,.home-grid,.card{min-width:0}.map circle[role=button]{cursor:pointer}.map circle[role=button]:focus{outline:none;stroke:var(--text);stroke-width:4}
@media(max-width:400px){.metrics,.grid{grid-template-columns:minmax(0,1fr)}.card{padding:16px}.edit-row select{width:100%}.tag{max-width:100%}header{gap:5px}.brand{letter-spacing:.5px}.header-actions button{padding:8px}}
.universe{grid-template-columns:repeat(2,minmax(0,1fr))}.universe button{min-width:0;overflow-wrap:anywhere;padding:14px}.universe h3{font-size:15px}@media(min-width:760px){.universe{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Garage sections: horizontal touch scrolling contained within the menu. */
#view[data-page="garage"]>.tabs{display:flex;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;max-width:100%;width:100%;gap:8px;padding:4px 2px 10px;scroll-padding-inline:2px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
#view[data-page="garage"]>.tabs button{flex:0 0 auto;min-width:max-content;width:auto;white-space:nowrap;min-height:48px}

textarea{display:block;width:100%;min-height:110px;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:9px;padding:12px;font:inherit}button:disabled{opacity:.55;cursor:wait}
/* Workshop stays within the existing mobile layout. */
#view[data-page="workshop"]>.tabs{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;max-width:100%}#view[data-page="workshop"]>.tabs button{flex:0 0 auto;white-space:nowrap}#view[data-page="workshop"] table{width:100%;border-collapse:collapse;overflow-wrap:anywhere}#view[data-page="workshop"] th,#view[data-page="workshop"] td{padding:10px;text-align:left;border-bottom:1px solid var(--line)}#view[data-page="workshop"] input:not([type=checkbox]),#view[data-page="workshop"] select{width:100%}#view[data-page="workshop"] .item>button:first-child{font-size:17px;font-weight:650;text-align:left}.mode-atelier #view[data-page="workshop"]{font-size:18px}.mode-atelier #view[data-page="workshop"] button{min-height:52px}@media print{header,nav,#network,.tabs,#shop-search,button,footer{display:none!important}.app{max-width:none;padding:0}.card{break-inside:avoid}body{background:white;color:black}}
#view .library-admin{min-width:0;max-width:100%}#view .lib-tabs{position:static;left:auto;bottom:auto;transform:none;width:100%;display:flex;flex-wrap:wrap;z-index:auto}#view .lib-tabs button{display:inline-block;font-size:13px}#view .library-admin input,#view .library-admin select,#view .library-admin textarea{max-width:100%}#view .lib-fields{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}#view .library-admin{overflow-wrap:anywhere}#view .lib-doc-row{min-width:0}#view #screen{min-width:0}.lib-table-wrap{overflow:auto}
