:root{--bg: #0b0d10;--panel: #161a20;--panel-2: #1e242c;--text: #f2f4f7;--muted: #9aa4b2;--accent: #3fb6ff;--warn: #ffb547;--danger: #ff6b6b;--route: #1a73e8;--radius: 20px;color-scheme:dark}:root[data-theme=light]{--bg: #eef1f5;--panel: #ffffff;--panel-2: #e3e8ef;--text: #0b0d10;--muted: #4b5563;--accent: #0067c5;--route: #1a73e8;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font:500 28px/1.25 system-ui,-apple-system,Segoe UI,Roboto,Noto Sans Arabic,sans-serif;-webkit-tap-highlight-color:transparent;user-select:none;overflow:hidden}#app,.app{height:100%}button{font:inherit;color:inherit;min-width:72px;min-height:72px;border:0;border-radius:var(--radius);background:var(--panel-2);cursor:pointer}button:disabled{opacity:.35}h1{font-size:48px;margin:0 0 24px}h2{font-size:24px;margin:0 0 8px;color:var(--muted);font-weight:600}p{margin:0}.muted,.help,.label{color:var(--muted)}.connect{height:100%;display:flex;flex-direction:column;justify-content:center;padding:48px 64px;gap:24px}.pairing{display:flex;gap:48px;align-items:center}.qr{width:320px;height:320px;background:#fff;border-radius:var(--radius);padding:12px;flex:none}.qr svg{width:100%;height:100%}.code{font-size:96px;font-weight:700;letter-spacing:.08em;font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}.status{font-size:32px}.code-entry .keypad{display:grid;grid-template-columns:repeat(6,96px);gap:12px;margin-top:16px;direction:ltr}.code-entry .keypad button{height:96px;font-size:40px}.dashboard{height:100%;display:grid;--sidebar: clamp(380px, 34vw, 600px);grid-template-columns:minmax(0,1fr) var(--sidebar);grid-template-rows:72px minmax(0,1fr) auto;gap:16px;padding:16px;position:relative}.dashboard.stale>:not(.status-bar){filter:grayscale(1);opacity:.55}.status-bar{grid-column:1 / -1;display:flex;align-items:center;gap:24px;padding:0 16px;font-size:28px}.status-bar .spacer{flex:1}.pill{background:var(--panel-2);border-radius:999px;padding:4px 16px;font-size:22px}.pill.warn{color:var(--bg);background:var(--warn)}.map-pane{position:relative;min-width:0;background:var(--panel);border-radius:var(--radius);overflow:hidden}.car-map,.car-map-canvas{position:absolute;inset:0}.car-map .car-map-canvas.maplibregl-map{position:absolute;inset:0;width:100%;height:100%}.car-map-canvas .maplibregl-canvas{outline:none}.car-marker{position:relative;width:60px;height:60px;display:grid;place-items:center}.car-marker>*{grid-area:1 / 1}.accuracy-halo{width:var(--halo, 0px);height:var(--halo, 0px);border-radius:50%;background:#2b7de929;border:1px solid rgb(43 125 233 / 35%);pointer-events:none}.location-dot{width:26px;height:26px;border-radius:50%;background:#2b7de9;border:4px solid #fff;box-shadow:0 1px 6px #0006}.heading-arrow{width:56px;height:56px;filter:drop-shadow(0 2px 4px rgb(0 0 0 / 45%))}.heading-arrow path{fill:#2b7de9;stroke:#fff;stroke-width:3.5;stroke-linejoin:round}.car-marker:not(.stopped) .accuracy-halo,.car-marker:not(.stopped) .location-dot,.car-marker.stopped .heading-arrow{display:none}.search-button{position:absolute;inset-inline-end:32px;top:32px;padding:0 32px;border-radius:999px;background:var(--panel);box-shadow:0 2px 6px #0000002e,0 6px 18px #00000024;z-index:2}.sheet.search{height:calc(100% - 64px)}.search-row{display:flex;gap:16px}.search-row input{flex:1;min-width:0;min-height:88px;font:inherit;font-size:32px;padding:0 24px;border-radius:var(--radius);border:2px solid var(--panel-2);background:var(--bg);color:var(--text)}.search-row .go{padding:0 32px;background:var(--accent);color:var(--bg)}.result{display:grid;grid-template-columns:1fr auto;gap:4px 16px;width:100%;text-align:start;padding:16px 24px;margin-top:12px}.result .name{font-weight:700}.result .address{grid-column:1;color:var(--muted);font-size:22px}.result .dist{grid-column:2;grid-row:1;color:var(--accent);font-variant-numeric:tabular-nums}.place-pin{width:44px;height:58px;filter:drop-shadow(0 3px 4px rgb(0 0 0 / 40%))}.place-pin svg{width:100%;height:100%;display:block}.pin-body{fill:#e5483b;stroke:#b3261e;stroke-width:1.5}.pin-dot{fill:#fff}.place-card{position:absolute;left:16px;right:140px;bottom:40px;display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--panel);border-radius:var(--radius);padding:20px 24px;box-shadow:0 2px 12px #0000004d;z-index:3}.place-card .name{font-weight:700;font-size:32px}.place-card .address,.place-card .dist{color:var(--muted);font-size:22px}.place-card button{padding:0 28px;flex-shrink:0}.place-card{flex-wrap:wrap}.place-card>div{flex:1 1 300px;min-width:0;overflow-wrap:anywhere}.place-card .error{flex-basis:100%;order:1}.recenter{position:absolute;inset-inline-end:32px;top:128px;padding:0 24px;background:var(--panel-2);z-index:2}.attribution{position:absolute;inset-inline-start:12px;bottom:8px;font-size:14px;color:#333;background:#ffffffbf;border-radius:6px;padding:2px 8px;z-index:1;pointer-events:none}.next-turn{z-index:2}.route-map{width:100%;height:100%}.route-line{fill:none;stroke:var(--route);stroke-width:14;stroke-linecap:round;stroke-linejoin:round}.next-turn{position:absolute;inset-inline-start:16px;top:16px;display:flex;gap:20px;align-items:center;background:var(--panel-2);border-radius:var(--radius);padding:20px 28px;max-width:calc(100% - 280px)}.map-pane.narrow .next-turn{top:128px;left:16px;right:auto;max-width:calc(100% - 152px)}.map-pane.narrow .recenter{top:32px;inset-inline-start:16px;inset-inline-end:auto}.next-turn .arrow{flex:none;width:88px;height:88px;color:var(--accent)}.turn-icon{width:100%;height:100%;display:block}.turn-stroke{fill:none;stroke:currentColor;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}.turn-stroke.thin{stroke-width:4}.turn-stroke.muted{opacity:.45}.turn-fill{fill:currentColor;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}.turn-hole{fill:var(--panel-2)}.next-turn .distance,.next-turn .big{font-size:48px;font-weight:700}.next-turn .instruction{font-size:30px}.next-turn .source{color:var(--muted);font-size:20px;margin-top:4px}.next-turn .eta{color:var(--muted)}.dashboard{direction:ltr}.dashboard>*{direction:inherit}html[dir=rtl] .dashboard>:not(.board),html[dir=rtl] .tile{direction:rtl}.call-dock{position:absolute;top:104px;right:16px;width:min(560px,calc(100% - 32px));z-index:8;max-height:calc(100% - 120px);overflow-y:auto}html[dir=rtl] .call-dock{right:auto;left:16px}.call-dock:empty{display:none}.call-panel{position:sticky;top:0;z-index:7;flex:none;border:2px solid #3cbe83;box-shadow:0 8px 16px #00000040}.call-phase{color:var(--muted);font-size:24px;margin-bottom:16px}.caller-identity{display:flex;align-items:center;gap:16px;margin-bottom:18px}.caller-avatar{width:72px;height:72px;flex:none;border-radius:50%;display:grid;place-items:center;background:#d9f7e9;color:#12613a;font-size:34px}.caller-identity>div{min-width:0}.caller-name{color:var(--text);font-size:34px;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.caller-number{color:var(--muted);font-size:26px}.call-duration{font-size:36px;font-variant-numeric:tabular-nums;margin:12px 0 20px}.call-actions{display:flex;gap:12px}.call-actions button{flex:1;min-width:0;min-height:88px;padding:12px;font-size:28px}.call-actions .call-answer{background:#19834c;color:#fff}.call-actions .call-end{background:#c8393c;color:#fff}.call-note{font-size:20px;color:var(--muted);margin-top:12px}.weather-current strong{font-size:36px}.weather-meta{font-size:18px;color:var(--muted);margin-top:6px}.weather a{color:var(--accent)}.layout-button{padding:0 14px;font-size:24px;flex-shrink:0}.layout-settings fieldset{margin:0 0 20px;border:0;padding:0}.layout-settings legend{color:var(--muted);margin-bottom:8px}.preset-options{display:flex;gap:12px}.preset-options button{flex:1;padding:12px}.order-options{flex-direction:column}.preset-options button[aria-pressed=true]{background:var(--accent);color:var(--bg)}.board{grid-row:2;grid-column:1 / -1;min-width:0;min-height:0;display:flex}.board>*,.split-cell>*{flex:1 1 auto}.split{display:flex;min-width:0;min-height:0}.split-row{flex-direction:row}.split-col{flex-direction:column}.split-cell{position:relative;display:flex;min-width:0;min-height:0}.split-row>.split-cell+.split-cell{margin-left:16px}.split-col>.split-cell+.split-cell{margin-top:16px}.tile{position:relative;display:flex;min-width:0;min-height:0;border-radius:var(--radius)}.tile-content{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;border-radius:var(--radius)}.tile>.tile-content>*{flex:1 0 auto}.tile-map .tile-content{overflow:hidden}.board.editing .tile{touch-action:none;cursor:grab;outline:2px dashed var(--muted);outline-offset:-2px}.board.editing .tile-content{overflow:hidden;opacity:.6}.tile.dragging{z-index:6;cursor:grabbing;box-shadow:0 12px 28px #00000073}.tile[data-drop]:after{content:"";position:absolute;z-index:3;pointer-events:none;background:#3fb6ff4d;border:3px solid var(--accent);border-radius:var(--radius)}.tile[data-drop=left]:after{inset:0 50% 0 0}.tile[data-drop=right]:after{inset:0 0 0 50%}.tile[data-drop=top]:after{inset:0 0 50%}.tile[data-drop=bottom]:after{inset:50% 0 0}.tile-name{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2;pointer-events:none;padding:6px 18px;border-radius:999px;background:var(--panel-2);color:var(--text);font-size:22px;white-space:nowrap;box-shadow:0 2px 10px #00000040}.tile-remove{position:absolute;top:6px;inset-inline-start:6px;z-index:4;width:72px;height:72px;border-radius:50%;background:var(--panel-2);color:var(--danger);box-shadow:0 2px 10px #00000059}.splitter{position:absolute;z-index:5;width:72px;height:72px;border-radius:50%;background:var(--accent);color:var(--bg);touch-action:none;box-shadow:0 2px 12px #00000059}.splitter-row{left:-44px;top:calc(50% - 36px);cursor:ew-resize}.splitter-col{top:-44px;left:calc(50% - 36px);cursor:ns-resize}.widgets-bar{grid-column:1 / -1;grid-row:3;display:flex;align-items:center;gap:16px;min-width:0}.widgets-list{flex:1;min-width:0;display:flex;align-items:center;gap:16px;overflow-x:auto;scrollbar-width:thin}.widgets-list .help{font-size:18px;min-width:260px}.appearance{flex:none;display:flex;flex-direction:column;gap:2px}.appearance .label{color:var(--muted);font-size:16px}.segmented{display:flex;gap:4px;padding:4px;border-radius:var(--radius);background:var(--panel-2)}.segmented button{padding:0 18px;font-size:22px;background:transparent}.segmented button[aria-pressed=true]{background:var(--accent);color:var(--bg)}.appearance-button{display:inline-flex;align-items:center;gap:8px}.appearance-icon{width:30px;height:30px;flex:none}.appearance-icon .icon-fill{fill:currentColor}.appearance-icon .icon-stroke{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.widgets-done{flex:none;padding:0 32px;background:var(--accent);color:var(--bg)}.widgets-button[aria-pressed=true]{background:var(--accent);color:var(--bg)}.widget-add{flex:none;padding:0 24px;font-size:24px;border:2px dashed var(--muted);background:transparent;white-space:nowrap}.widget-option{flex:none;padding:0 16px;font-size:22px;display:flex;flex-direction:column;justify-content:center;line-height:1.1}.widget-option .label{font-size:16px}.card.clock-card{height:100%;display:flex;align-items:center;justify-content:center;padding:8px}.analog-clock{height:100%;max-width:100%;aspect-ratio:1;display:block}.clock-face{fill:var(--panel-2);stroke:var(--muted);stroke-width:2}.clock-mark{stroke:var(--text);stroke-width:4;stroke-linecap:round}.clock-tick{stroke:var(--muted);stroke-width:1.5}.clock-hand{stroke:var(--text);stroke-linecap:round}.clock-hand.hour{stroke-width:9}.clock-hand.minute{stroke-width:6}.clock-second line{stroke:var(--accent);stroke-width:2.5;stroke-linecap:round}.clock-second circle{fill:var(--accent)}.clock-pin{fill:var(--panel-2)}.card.date-widget{height:100%;display:flex;flex-direction:column;justify-content:center;padding:4px 20px;overflow:hidden}.date-widget .weekday{color:var(--muted);font-size:22px;line-height:1.1}.date-widget strong{font-size:32px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.message-banner{position:fixed;top:12px;left:50%;width:min(760px,calc(100% - 32px));transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:8px;background:var(--panel);border:2px solid var(--accent);border-radius:var(--radius);box-shadow:0 12px 32px #00000073;z-index:9;animation:banner-in .3s ease-out}.message-banner.leaving{animation:banner-out .3s ease-in forwards}@keyframes banner-in{0%{transform:translate(-50%,-140%)}to{transform:translate(-50%)}}@keyframes banner-out{0%{transform:translate(-50%)}to{transform:translate(-50%,-140%)}}@media(prefers-reduced-motion:reduce){.message-banner,.message-banner.leaving{animation:none}}.banner-open{flex:1;min-width:0;display:flex;align-items:center;gap:16px;padding:8px 16px;background:transparent;text-align:start}.banner-icon{font-size:36px}.banner-body{flex:1;min-width:0;display:flex;flex-direction:column}.banner-meta{display:flex;align-items:baseline;gap:12px;min-width:0}.banner-meta .who{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.banner-meta .app{flex:none;color:var(--muted);font-size:22px}.message-banner .text{color:var(--muted);font-size:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.banner-close{flex:none;width:72px;background:transparent}.card{background:var(--panel);border-radius:var(--radius);padding:20px 24px}.now-playing{flex:none;display:flex;flex-direction:column;gap:6px}.now-playing .source{color:var(--muted);font-size:22px}.now-playing .title{font-size:32px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.now-playing .artist{color:var(--muted)}.progress{position:relative;display:flex;justify-content:space-between;font-size:20px;color:var(--muted);padding-top:14px;margin-top:8px}.progress:before,.progress .bar{content:"";position:absolute;top:0;inset-inline-start:0;height:6px;border-radius:3px}.progress:before{width:100%;background:var(--panel-2)}.progress .bar{background:var(--accent)}.controls{margin-top:auto;display:flex;justify-content:space-between;gap:16px;direction:ltr}.controls button{flex:1;height:96px;font-size:40px}.controls button.main{background:var(--accent);color:var(--bg)}.tile .messages>.conversation .text{-webkit-line-clamp:1}.messages h2,.calendar h2{margin:0;min-height:72px}.messages h2{display:flex;align-items:center;justify-content:space-between}.messages .more{min-height:72px;font-size:22px;padding:0 16px}.conversation{display:flex;flex-direction:column;gap:6px}.conversation+.conversation{border-top:1px solid var(--panel-2);padding-top:16px;margin-top:16px}.conversation .meta{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:22px}.conversation .badge{background:var(--accent);color:var(--bg);border-radius:999px;padding:0 12px;font-weight:700}.conversation .who{font-weight:700;font-size:28px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.conversation .app{margin-inline-start:auto;flex:none}.conversation .text{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.conversation .row{display:flex;gap:12px}.conversation .row button{flex:1;padding:0 16px;font-size:24px}.calendar h2{display:flex;align-items:center;justify-content:space-between}.calendar .more{min-height:72px;font-size:22px;padding:0 16px}.event .when{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:24px;font-variant-numeric:tabular-nums}.event .badge{color:var(--accent);font-weight:700}.event .title{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.event .place,.calendar .allday{color:var(--muted);font-size:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.event.past{opacity:.5}.sheet-body section+section{margin-top:24px}.sheet-body .event+.event{margin-top:16px}.overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:10}.sheet{background:var(--panel);border-radius:var(--radius);padding:24px;width:min(1100px,calc(100% - 64px));max-height:calc(100% - 64px);display:flex;flex-direction:column;gap:16px}.sheet-head{display:flex;justify-content:space-between;align-items:center}.sheet-head button{padding:0 24px}.sheet-body{overflow-y:auto}.quick{display:grid;grid-template-columns:1fr 1fr;gap:16px}.quick button{min-height:96px;font-size:30px;padding:0 16px}.error{color:var(--danger);font-size:22px}.banner{position:absolute;inset:auto 16px 16px;background:var(--warn);color:#000;border-radius:var(--radius);padding:16px 24px}.spike{position:fixed;inset-inline-start:8px;bottom:8px;display:flex;gap:16px;align-items:center;font:16px/1.2 ui-monospace,monospace;background:#000000bf;color:#fff;padding:6px 12px;border-radius:8px}.spike button{min-width:0;min-height:0;padding:4px 8px;font-size:14px}@media(max-width:1100px){html,body{font-size:22px}.layout-button span{display:none}.pairing{flex-direction:column;align-items:flex-start}}.map-controls{position:absolute;right:24px;bottom:56px;display:flex;flex-direction:column;gap:12px;z-index:4}.map-controls button{width:88px;height:88px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--panel);box-shadow:0 2px 10px #0000004d}.map-controls button[aria-pressed=true]{color:#80bdff}.map-controls .my-location-control{background:#fff;color:#5f6368;border:1px solid #e0e0e0}.compass-n{font-size:16px;line-height:1;font-weight:700}.map-settings{position:absolute;right:132px;bottom:56px;width:min(440px,calc(100% - 156px));max-height:calc(100% - 32px);overflow-y:auto;border-radius:var(--radius);background:var(--panel);padding:16px;box-shadow:0 3px 18px #00000059;z-index:6}.map-settings-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.map-settings-head h2{color:var(--text);margin:0}.map-settings-head button{font-size:36px;flex-shrink:0}.map-setting-choice{display:flex;width:100%;align-items:center;gap:12px;padding:12px;margin-top:8px;text-align:start;font-size:26px}.map-setting-choice>svg{flex-shrink:0}.map-setting-choice>span:nth-last-child(2){flex:1}.map-setting-choice[aria-pressed=true]{background:#d7e9ff;color:#123b66}.map-setting-note{margin-top:14px;font-size:18px;line-height:1.4;color:var(--muted)}.route-choice small{display:block;font-size:20px;margin-top:6px}.next-turn .end-route{min-height:72px;padding:0 24px;flex-shrink:0}
