Spaces:

fffiloni
/

cabin-local

Running on Zero

Restore forest CarPlay cockpit, add central voice action and refresh iOS 0.4.0 source

3a9bb21 verified about 1 hour ago

17.3 kB

:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#19352b;background:#f1f3ec;font-synthesis:none;--muted:#667468;--line:#d8ded2;--accent:#b1efc7}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,summary,select{-webkit-tap-highlight-color:transparent}button,summary,select{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.38}a{color:inherit;text-underline-offset:4px}button{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #5d9c78;outline-offset:3px}[hidden]{display:none!important}.shell{max-width:1420px;margin:auto;padding:0 5%}.topbar{height:95px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-size:27px;font-weight:650;letter-spacing:-1.3px;text-decoration:none;display:flex;align-items:center;gap:6px}.brand>span:last-child{font-weight:400}.brandmark{display:grid;place-items:center;border-radius:12px;background:#14392a;color:#c6f4d2;width:36px;height:36px;font-size:29px;margin-right:8px}.edition{font-size:10px;letter-spacing:1.6px;color:var(--muted)}.topbar>a:last-child{font-size:12px;text-decoration:none}.intro{display:flex;justify-content:space-between;align-items:center;padding:39px 0 28px}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:650;display:flex;align-items:center;gap:8px}.dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#6b9b7a;flex-shrink:0}h1{font-size:56px;line-height:1.05;font-weight:500;letter-spacing:-2.6px;margin:21px 0 0}h1 span{color:#849081}.intro-note{width:312px;font-size:15px;line-height:1.7}.intro-note .muted{font-size:12px}.muted,.small-note{color:var(--muted);line-height:1.6}.tabs{display:flex;gap:35px;border-bottom:1px solid var(--line);margin-bottom:30px}.tabs button{font-size:10px;letter-spacing:.3px;border:0;border-bottom:2px solid transparent;background:none;padding:17px 0;color:#83907f}.tabs button span{font-size:12px;letter-spacing:0;margin-left:8px;color:var(--muted)}.tabs button.active{border-color:#234838}.tabs button.active span{color:#234838;font-weight:650}.demo-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:38px}.device-label{display:flex;justify-content:space-between;gap:16px;font-size:9px;letter-spacing:1.3px;color:#7d8977;margin-bottom:16px}.device-label span:first-child{color:#435e48}.phone{background:#f8faf5;border:6px solid #24372f;border-radius:37px;box-shadow:0 14px 20px -22px #183527;overflow:hidden;max-width:330px;margin:0 auto}.phone-top{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:10px;font-weight:600}.island{height:17px;width:75px;border-radius:15px;background:#18241f}.phone-body{padding:9px 17px 12px}.app-heading{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600}.app-heading small{display:block;font-size:9px;font-weight:400;color:var(--muted);margin-top:2px}.app-icon{display:grid;place-items:center;border-radius:9px;background:#193f2d;color:var(--accent);width:33px;height:33px;font-size:24px}h2{font-size:29px;letter-spacing:-1px;font-weight:550;margin:20px 0 8px}.phone-intro{font-size:11px;margin:0 0 14px}.phone fieldset{padding:0;border:0;margin:0}.model-option{position:relative;display:block;border:1px solid #d6ddd1;border-radius:10px;background:#fff;padding:11px 12px;margin:7px 0;cursor:pointer}.model-option:has(input:checked){background:#e9f2e7;border-color:#567d60}.model-option input{position:absolute;right:11px;top:12px;accent-color:#2a6144;margin:0}.model-title{display:block;font-size:12px;font-weight:600;padding-right:15px}.model-meta{display:block;font-size:9px;color:var(--muted);margin-top:5px}.cache-toggle{display:flex;align-items:center;gap:5px;font-size:9px;color:var(--muted);margin:12px 0}.cache-toggle input{width:12px;height:12px;margin:0;accent-color:#285c40}.button{display:flex;align-items:center;justify-content:center;width:100%;min-height:42px;padding:10px 14px;border-radius:9px;border:1px solid #cbd9c6;font-size:11px;text-align:center;text-decoration:none;font-weight:550}.primary{background:#234b36;color:#eff9ec;border-color:#234b36}.primary:hover:enabled{background:#315c44}.secondary{background:#e7eddf}.small-note{font-size:10px;margin:10px 0}.text-button{padding:7px 0;border:0;background:none;text-decoration:underline;text-underline-offset:4px;font-size:10px;min-height:34px}.voice-row{display:flex;align-items:center;justify-content:space-between;padding:13px 0;margin-top:4px;border-top:1px solid var(--line);gap:8px}.voice-row label{font-size:11px;font-weight:550}.voice-row small{display:block;font-size:8px;font-weight:400;color:var(--muted);margin-top:4px}.voice-row select{background:transparent;border:0;max-width:105px;font-size:10px;min-height:34px}.privacy{font-size:9px;line-height:1.6;color:#6d786a;margin:9px 0 15px}.home-indicator{height:4px;width:85px;background:#273d30;border-radius:10px;margin:0 auto 8px}.device-footnote{font-size:10px;color:var(--muted);line-height:1.6;margin:13px 8px;text-align:center}.car-frame{padding:10px;background:linear-gradient(130deg,#303832,#111714 65%);border:1px solid #111a15;border-radius:25px;box-shadow:0 20px 25px -26px #1c3127}.car-screen{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);aspect-ratio:1.91;background:#070909;color:#fff;border-radius:16px;overflow:hidden}.system-rail{background:linear-gradient(160deg,#353c3c,#20292a);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:16px 0 13px}.system-clock{font-size:17px;font-weight:550;text-align:center;line-height:1.3;letter-spacing:.2px}.system-clock small{display:block;font-size:9px;letter-spacing:1px;margin-top:4px}.system-apps{display:flex;flex-direction:column;gap:14px}.system-apps span{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;font-size:26px}.map-icon{background:linear-gradient(120deg,#f9f9ef 25%,#8fcfa7 27%,#8fcfa7 60%,#5cacdc 62%);color:#1767b8}.music-icon{background:linear-gradient(#ff5963,#df153a)}.cabin-icon{background:#204b37;color:#c1f4d0}.system-home{width:25px;display:grid;grid-template-columns:repeat(3,5px);gap:3px}.system-home i{height:5px;background:#eee;border-radius:1px}.native-template{position:relative;min-width:0;background:radial-gradient(ellipse at 10% 0%,#182021,#080a0b 68%)}.native-nav{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:13px 17px;gap:12px;font-size:15px;font-weight:550}.native-nav>span{color:#aeb6b7;font-size:12px;font-weight:450}.native-nav>div{display:flex;gap:8px}.native-nav button{border:0;border-radius:9px;background:#2c3236;color:#f5f6f6;font-size:15px;min-height:42px;padding:7px 17px;font-weight:550}.native-nav button:disabled{opacity:.3}.voice-state{position:absolute;inset:51px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding-bottom:26px}.phase-icon{width:58px;height:58px;color:#f3f4f4}.phase-icon svg{display:block;width:100%;height:100%}#carplay-state{font-size:25px;font-weight:500;letter-spacing:-.4px;text-align:center;margin:9px 15px;line-height:1.25}.car-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:13px 0 0}.car-caption p{font-size:11px;color:#6c7968;margin:0}.car-caption strong{color:#3b5942;font-weight:550}.parity-note{font-size:10px;color:#788371;line-height:1.7;max-width:680px;margin:7px 0 21px}.parity-note code{font-family:inherit;color:#576c55}.session-status{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px;min-height:53px;font-size:11px}.session-status p{line-height:1.7;margin:12px 0}.session-status .dot{background:#a3ac9e}.session-status .dot.on{background:#4c9660}.session-status.error{color:#9a4339}.preview-tools,.test-tools{border-bottom:1px solid var(--line);padding:16px 0}summary{display:flex;justify-content:space-between;gap:15px;font-size:11px;list-style:none}summary::-webkit-details-marker{display:none}summary>span{color:#809277;font-size:15px}.state-buttons{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.state-buttons button,.test-actions>button,.upload-label{font-size:10px;background:#e9eee2;border:1px solid #d5ddce;border-radius:6px;padding:9px 10px;min-height:34px}.state-buttons button.active{background:#2d563e;color:white;border-color:#2d563e}.test-tools form{display:flex;border:1px solid #cad5c2;padding:5px;border-radius:7px;background:#fafcf7;margin:14px 0 10px}.test-tools input[type=text],#question{min-width:0;flex:1;background:none;border:0;padding:9px;font-size:11px;outline:none}.test-tools form button{width:34px;height:34px;background:#dfe9d6;border:0;border-radius:4px;font-size:20px}.test-actions{display:flex;flex-wrap:wrap;align-items:center;gap:7px}.upload-label{position:relative;overflow:hidden;cursor:pointer}.upload-label input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;font-size:0}.upload-label:has(input:disabled){opacity:.38;cursor:not-allowed}#conversation{font-size:12px;line-height:1.8;overflow-wrap:anywhere;white-space:pre-wrap}#playback{margin:15px 0}#playback .button{width:auto}#progress-wrap{font-size:9px;margin:10px 0}progress{width:100%;height:5px;accent-color:#377648;display:block;margin-bottom:6px}.execution-note{border-top:1px solid var(--line);margin-top:29px;padding:20px 0 0;display:grid;grid-template-columns:300px 1fr;gap:38px}.execution-note .eyebrow{font-size:9px;color:#687c60;align-self:start;margin-top:3px}.execution-note p{font-size:11px;line-height:1.8;margin:0;color:#65725f}.execution-note strong{color:#354c38}.build-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:40px 60px}.build-grid h2{font-size:39px;line-height:1.12;margin:12px 0 20px}.build-grid>div>p{font-size:13px;line-height:1.8;color:var(--muted)}.build-grid>div>a:not(.button){font-size:12px}.build-grid .button{max-width:330px}.build-grid .small-note{font-size:10px}.status-banner{background:#e5eddc;border:1px solid #d3dfc7;border-radius:6px;padding:14px;font-size:9px;letter-spacing:1px}.roadmap{padding-left:23px}.roadmap li{padding:14px 0;border-bottom:1px solid var(--line);font-size:12px}.roadmap h3{font-weight:600;font-size:14px;margin:0 0 8px}.roadmap p{font-size:12px;color:var(--muted);line-height:1.8;margin:0}.comparison{grid-column:1/-1}.comparison h3{font-size:16px;font-weight:550}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;font-size:11px;text-align:left;line-height:1.8}th,td{padding:13px 17px;border-bottom:1px solid var(--line)}th{font-weight:600}thead{background:#e6eddf}td{color:var(--muted)}.notes{display:grid;grid-template-columns:1fr 1fr;gap:35px;border-top:1px solid var(--line);margin-top:30px;padding:18px 0}.notes p{font-size:11px;line-height:1.8;color:var(--muted)}footer{padding:22px 0 30px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:18px;font-size:9px;color:#7b8774}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(min-width:1450px){.car-screen{aspect-ratio:2}.voice-state{padding-bottom:35px}}@media(max-width:1050px){.shell{padding:0 4%}.demo-grid{grid-template-columns:270px minmax(0,1fr);gap:23px}.car-screen{aspect-ratio:1.6;grid-template-columns:53px 1fr}.native-nav{padding:10px}.native-nav button{padding:7px 12px;font-size:13px}.native-nav>span{font-size:10px}.system-apps span{width:31px;height:31px}.system-clock{font-size:15px}#carplay-state{font-size:21px}.execution-note{grid-template-columns:270px 1fr;gap:23px}}@media(max-width:760px){.topbar{height:75px}.edition{display:none}.intro{padding:28px 0 19px}.intro-note{width:210px;font-size:12px}h1{font-size:43px}.intro-note .muted{font-size:10px}.demo-grid{display:flex;flex-direction:column;gap:25px}.phone-column{order:1;max-width:400px;margin:auto;width:100%}.car-column{order:0}.car-screen{aspect-ratio:1.9}.phone{width:300px}.tabs{margin-bottom:21px}.device-label{margin-bottom:12px}.execution-note{display:block}.execution-note p{margin-top:12px}.build-grid{grid-template-columns:1fr;gap:25px}.comparison{grid-column:auto}.notes{gap:20px}.native-nav>span{font-size:12px}.voice-state{padding-bottom:12px}.phase-icon{width:45px;height:45px}}@media(max-width:440px){h1{font-size:37px}.intro-note{width:148px;font-size:11px}.intro-note .muted{font-size:10px}.eyebrow{font-size:8px}.brand{font-size:24px}.car-frame{padding:7px;border-radius:19px}.car-screen{grid-template-columns:45px 1fr;aspect-ratio:1.65}.system-rail{padding:12px 0}.system-clock{font-size:13px}.system-apps{gap:9px}.system-apps span{height:26px;width:26px;font-size:20px}.system-home{transform:scale(.8)}.native-nav{padding:8px}.native-nav>span{font-size:10px}.native-nav button{min-height:36px;font-size:12px;padding:6px 10px}.native-nav>div{gap:5px}.phase-icon{width:40px;height:40px}#carplay-state{font-size:19px}.notes{grid-template-columns:1fr;gap:20px}footer{flex-direction:column;gap:8px}.car-caption p{font-size:10px}.parity-note{font-size:9px}.build-grid th,.build-grid td{min-width:130px;padding:10px}.tabs{gap:25px}}

/* Cabin voice identity: scoped to the CarPlay display. */
.car-frame{background:linear-gradient(135deg,#2b4034,#10261e 65%);border-color:#35503d;box-shadow:0 16px 24px -21px #162a27}
.car-screen{background:var(--forest-edge,#142720)}
.system-rail{background:linear-gradient(150deg,#2c3b35,#1c3027)}
.native-template{background:radial-gradient(ellipse at 48% 44%,var(--forest-glow,#304b32) 0%,#20382b 33%,var(--forest-edge,#142720) 76%)}
.native-nav .car-brand{display:flex;align-items:center;gap:9px;color:#d9e8d9;letter-spacing:1.5px;font-size:10px;font-weight:600}
.car-brand>span{color:var(--voice-mint,#c3edb0);font-size:19px;line-height:1}
.native-nav button{border:1px solid #54735b;color:#d6edcc;background:#344f38;border-radius:9px}
.native-nav button:enabled:hover{background:#426344}
.native-nav #stop{background:#20372a}
.voice-state{inset:59px 0 0;gap:8px;padding-bottom:24px}
#carplay-state{color:#e8f4e8;font-weight:450;margin:0 14px 5px}
.voice-orb{position:relative;display:grid;place-items:center;flex-shrink:0;width:128px;height:128px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--voice-mint,#c3edb0);touch-action:manipulation;-webkit-user-select:none;user-select:none}
.voice-orb:disabled{opacity:.75;cursor:default}
.voice-orb:enabled:hover .orb-core{box-shadow:0 0 34px #b9ef9c26,inset 0 0 24px #b9f8a21c;border-color:#b4d79899}
.voice-orb:enabled:active{transform:scale(.97)}
.voice-orb:focus-visible{outline:2px solid var(--voice-mint,#c3edb0);outline-offset:6px}
.orb-halo{position:absolute;inset:8px;border:1px solid #78987f38;border-radius:50%;box-shadow:0 0 0 8px #7da66b0b,0 0 0 17px #7da66b06;pointer-events:none}
.orb-core{display:grid;place-items:center;position:relative;width:88px;height:88px;border:1px solid #91b27888;border-radius:50%;background:radial-gradient(circle at 35% 20%,color-mix(in srgb,var(--orb-top) 44%,transparent),var(--orb-bottom,#243e2c) 80%);box-shadow:0 0 25px #9be5ad14,inset 0 0 20px #b9f8a20b;pointer-events:none;transition:box-shadow .18s,border-color .18s}
.voice-orb .phase-icon{display:grid;place-items:center;width:47px;height:47px;color:var(--voice-mint,#c3edb0)}
.orb-wave{display:flex;align-items:center;justify-content:center;gap:3px;width:58px;height:40px}
.orb-wave i{display:block;width:3px;height:var(--bar-height);border-radius:3px;background:var(--voice-mint,#c3edb0)}
.orb-hint{color:#b0c4ad;font-size:10px;line-height:1.4;letter-spacing:.2px;min-height:14px}
.car-screen[data-state=listening] .orb-wave i,.car-screen[data-state=speaking] .orb-wave i{animation:cabin-wave .8s ease-in-out infinite alternate}
.car-screen[data-state=listening] .orb-wave i:nth-child(2n),.car-screen[data-state=speaking] .orb-wave i:nth-child(2n){animation-delay:-.25s}
.car-screen[data-state=listening] .orb-wave i:nth-child(3n),.car-screen[data-state=speaking] .orb-wave i:nth-child(3n){animation-delay:-.5s}
.car-screen[data-state=thinking] .orb-halo,.car-screen[data-state=loading] .orb-halo{animation:cabin-breathe 1.8s ease-in-out infinite}
.car-screen[data-state=error] .orb-core{border-color:#c9ae7799}
@keyframes cabin-wave{to{transform:scaleY(.45)}}
@keyframes cabin-breathe{50%{transform:scale(1.06);opacity:.45}}
@media(max-width:1050px){.native-nav .car-brand{font-size:9px;letter-spacing:1px;gap:6px}}
@media(max-width:760px){.voice-state{inset:48px 0 0;gap:2px;padding-bottom:10px}.voice-orb{width:102px;height:102px}.orb-core{width:74px;height:74px}.orb-halo{inset:8px}#carplay-state{margin-bottom:1px}.native-nav .car-brand{font-size:9px}}
@media(max-width:440px){.voice-state{inset:44px 0 0;padding-bottom:8px}.voice-orb{width:80px;height:80px}.orb-core{width:58px;height:58px}.orb-halo{inset:5px;box-shadow:0 0 0 5px #7da66b0b,0 0 0 10px #7da66b06}.voice-orb .phase-icon{width:34px;height:34px}.orb-wave{transform:scale(.72)}.orb-hint{font-size:9px;min-height:12px}.car-brand>span{font-size:15px}.native-nav .car-brand{font-size:8px;letter-spacing:.6px}}
@media(prefers-reduced-motion:reduce){.car-screen *,.car-screen *::before,.car-screen *::after{animation:none!important;transition:none!important}}

	:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#19352b;background:#f1f3ec;font-synthesis:none;--muted:#667468;--line:#d8ded2;--accent:#b1efc7}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,summary,select{-webkit-tap-highlight-color:transparent}button,summary,select{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.38}a{color:inherit;text-underline-offset:4px}button{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #5d9c78;outline-offset:3px}[hidden]{display:none!important}.shell{max-width:1420px;margin:auto;padding:0 5%}.topbar{height:95px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-size:27px;font-weight:650;letter-spacing:-1.3px;text-decoration:none;display:flex;align-items:center;gap:6px}.brand>span:last-child{font-weight:400}.brandmark{display:grid;place-items:center;border-radius:12px;background:#14392a;color:#c6f4d2;width:36px;height:36px;font-size:29px;margin-right:8px}.edition{font-size:10px;letter-spacing:1.6px;color:var(--muted)}.topbar>a:last-child{font-size:12px;text-decoration:none}.intro{display:flex;justify-content:space-between;align-items:center;padding:39px 0 28px}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:650;display:flex;align-items:center;gap:8px}.dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#6b9b7a;flex-shrink:0}h1{font-size:56px;line-height:1.05;font-weight:500;letter-spacing:-2.6px;margin:21px 0 0}h1 span{color:#849081}.intro-note{width:312px;font-size:15px;line-height:1.7}.intro-note .muted{font-size:12px}.muted,.small-note{color:var(--muted);line-height:1.6}.tabs{display:flex;gap:35px;border-bottom:1px solid var(--line);margin-bottom:30px}.tabs button{font-size:10px;letter-spacing:.3px;border:0;border-bottom:2px solid transparent;background:none;padding:17px 0;color:#83907f}.tabs button span{font-size:12px;letter-spacing:0;margin-left:8px;color:var(--muted)}.tabs button.active{border-color:#234838}.tabs button.active span{color:#234838;font-weight:650}.demo-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:38px}.device-label{display:flex;justify-content:space-between;gap:16px;font-size:9px;letter-spacing:1.3px;color:#7d8977;margin-bottom:16px}.device-label span:first-child{color:#435e48}.phone{background:#f8faf5;border:6px solid #24372f;border-radius:37px;box-shadow:0 14px 20px -22px #183527;overflow:hidden;max-width:330px;margin:0 auto}.phone-top{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:10px;font-weight:600}.island{height:17px;width:75px;border-radius:15px;background:#18241f}.phone-body{padding:9px 17px 12px}.app-heading{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600}.app-heading small{display:block;font-size:9px;font-weight:400;color:var(--muted);margin-top:2px}.app-icon{display:grid;place-items:center;border-radius:9px;background:#193f2d;color:var(--accent);width:33px;height:33px;font-size:24px}h2{font-size:29px;letter-spacing:-1px;font-weight:550;margin:20px 0 8px}.phone-intro{font-size:11px;margin:0 0 14px}.phone fieldset{padding:0;border:0;margin:0}.model-option{position:relative;display:block;border:1px solid #d6ddd1;border-radius:10px;background:#fff;padding:11px 12px;margin:7px 0;cursor:pointer}.model-option:has(input:checked){background:#e9f2e7;border-color:#567d60}.model-option input{position:absolute;right:11px;top:12px;accent-color:#2a6144;margin:0}.model-title{display:block;font-size:12px;font-weight:600;padding-right:15px}.model-meta{display:block;font-size:9px;color:var(--muted);margin-top:5px}.cache-toggle{display:flex;align-items:center;gap:5px;font-size:9px;color:var(--muted);margin:12px 0}.cache-toggle input{width:12px;height:12px;margin:0;accent-color:#285c40}.button{display:flex;align-items:center;justify-content:center;width:100%;min-height:42px;padding:10px 14px;border-radius:9px;border:1px solid #cbd9c6;font-size:11px;text-align:center;text-decoration:none;font-weight:550}.primary{background:#234b36;color:#eff9ec;border-color:#234b36}.primary:hover:enabled{background:#315c44}.secondary{background:#e7eddf}.small-note{font-size:10px;margin:10px 0}.text-button{padding:7px 0;border:0;background:none;text-decoration:underline;text-underline-offset:4px;font-size:10px;min-height:34px}.voice-row{display:flex;align-items:center;justify-content:space-between;padding:13px 0;margin-top:4px;border-top:1px solid var(--line);gap:8px}.voice-row label{font-size:11px;font-weight:550}.voice-row small{display:block;font-size:8px;font-weight:400;color:var(--muted);margin-top:4px}.voice-row select{background:transparent;border:0;max-width:105px;font-size:10px;min-height:34px}.privacy{font-size:9px;line-height:1.6;color:#6d786a;margin:9px 0 15px}.home-indicator{height:4px;width:85px;background:#273d30;border-radius:10px;margin:0 auto 8px}.device-footnote{font-size:10px;color:var(--muted);line-height:1.6;margin:13px 8px;text-align:center}.car-frame{padding:10px;background:linear-gradient(130deg,#303832,#111714 65%);border:1px solid #111a15;border-radius:25px;box-shadow:0 20px 25px -26px #1c3127}.car-screen{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);aspect-ratio:1.91;background:#070909;color:#fff;border-radius:16px;overflow:hidden}.system-rail{background:linear-gradient(160deg,#353c3c,#20292a);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:16px 0 13px}.system-clock{font-size:17px;font-weight:550;text-align:center;line-height:1.3;letter-spacing:.2px}.system-clock small{display:block;font-size:9px;letter-spacing:1px;margin-top:4px}.system-apps{display:flex;flex-direction:column;gap:14px}.system-apps span{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;font-size:26px}.map-icon{background:linear-gradient(120deg,#f9f9ef 25%,#8fcfa7 27%,#8fcfa7 60%,#5cacdc 62%);color:#1767b8}.music-icon{background:linear-gradient(#ff5963,#df153a)}.cabin-icon{background:#204b37;color:#c1f4d0}.system-home{width:25px;display:grid;grid-template-columns:repeat(3,5px);gap:3px}.system-home i{height:5px;background:#eee;border-radius:1px}.native-template{position:relative;min-width:0;background:radial-gradient(ellipse at 10% 0%,#182021,#080a0b 68%)}.native-nav{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:13px 17px;gap:12px;font-size:15px;font-weight:550}.native-nav>span{color:#aeb6b7;font-size:12px;font-weight:450}.native-nav>div{display:flex;gap:8px}.native-nav button{border:0;border-radius:9px;background:#2c3236;color:#f5f6f6;font-size:15px;min-height:42px;padding:7px 17px;font-weight:550}.native-nav button:disabled{opacity:.3}.voice-state{position:absolute;inset:51px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding-bottom:26px}.phase-icon{width:58px;height:58px;color:#f3f4f4}.phase-icon svg{display:block;width:100%;height:100%}#carplay-state{font-size:25px;font-weight:500;letter-spacing:-.4px;text-align:center;margin:9px 15px;line-height:1.25}.car-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:13px 0 0}.car-caption p{font-size:11px;color:#6c7968;margin:0}.car-caption strong{color:#3b5942;font-weight:550}.parity-note{font-size:10px;color:#788371;line-height:1.7;max-width:680px;margin:7px 0 21px}.parity-note code{font-family:inherit;color:#576c55}.session-status{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px;min-height:53px;font-size:11px}.session-status p{line-height:1.7;margin:12px 0}.session-status .dot{background:#a3ac9e}.session-status .dot.on{background:#4c9660}.session-status.error{color:#9a4339}.preview-tools,.test-tools{border-bottom:1px solid var(--line);padding:16px 0}summary{display:flex;justify-content:space-between;gap:15px;font-size:11px;list-style:none}summary::-webkit-details-marker{display:none}summary>span{color:#809277;font-size:15px}.state-buttons{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.state-buttons button,.test-actions>button,.upload-label{font-size:10px;background:#e9eee2;border:1px solid #d5ddce;border-radius:6px;padding:9px 10px;min-height:34px}.state-buttons button.active{background:#2d563e;color:white;border-color:#2d563e}.test-tools form{display:flex;border:1px solid #cad5c2;padding:5px;border-radius:7px;background:#fafcf7;margin:14px 0 10px}.test-tools input[type=text],#question{min-width:0;flex:1;background:none;border:0;padding:9px;font-size:11px;outline:none}.test-tools form button{width:34px;height:34px;background:#dfe9d6;border:0;border-radius:4px;font-size:20px}.test-actions{display:flex;flex-wrap:wrap;align-items:center;gap:7px}.upload-label{position:relative;overflow:hidden;cursor:pointer}.upload-label input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;font-size:0}.upload-label:has(input:disabled){opacity:.38;cursor:not-allowed}#conversation{font-size:12px;line-height:1.8;overflow-wrap:anywhere;white-space:pre-wrap}#playback{margin:15px 0}#playback .button{width:auto}#progress-wrap{font-size:9px;margin:10px 0}progress{width:100%;height:5px;accent-color:#377648;display:block;margin-bottom:6px}.execution-note{border-top:1px solid var(--line);margin-top:29px;padding:20px 0 0;display:grid;grid-template-columns:300px 1fr;gap:38px}.execution-note .eyebrow{font-size:9px;color:#687c60;align-self:start;margin-top:3px}.execution-note p{font-size:11px;line-height:1.8;margin:0;color:#65725f}.execution-note strong{color:#354c38}.build-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:40px 60px}.build-grid h2{font-size:39px;line-height:1.12;margin:12px 0 20px}.build-grid>div>p{font-size:13px;line-height:1.8;color:var(--muted)}.build-grid>div>a:not(.button){font-size:12px}.build-grid .button{max-width:330px}.build-grid .small-note{font-size:10px}.status-banner{background:#e5eddc;border:1px solid #d3dfc7;border-radius:6px;padding:14px;font-size:9px;letter-spacing:1px}.roadmap{padding-left:23px}.roadmap li{padding:14px 0;border-bottom:1px solid var(--line);font-size:12px}.roadmap h3{font-weight:600;font-size:14px;margin:0 0 8px}.roadmap p{font-size:12px;color:var(--muted);line-height:1.8;margin:0}.comparison{grid-column:1/-1}.comparison h3{font-size:16px;font-weight:550}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;font-size:11px;text-align:left;line-height:1.8}th,td{padding:13px 17px;border-bottom:1px solid var(--line)}th{font-weight:600}thead{background:#e6eddf}td{color:var(--muted)}.notes{display:grid;grid-template-columns:1fr 1fr;gap:35px;border-top:1px solid var(--line);margin-top:30px;padding:18px 0}.notes p{font-size:11px;line-height:1.8;color:var(--muted)}footer{padding:22px 0 30px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:18px;font-size:9px;color:#7b8774}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(min-width:1450px){.car-screen{aspect-ratio:2}.voice-state{padding-bottom:35px}}@media(max-width:1050px){.shell{padding:0 4%}.demo-grid{grid-template-columns:270px minmax(0,1fr);gap:23px}.car-screen{aspect-ratio:1.6;grid-template-columns:53px 1fr}.native-nav{padding:10px}.native-nav button{padding:7px 12px;font-size:13px}.native-nav>span{font-size:10px}.system-apps span{width:31px;height:31px}.system-clock{font-size:15px}#carplay-state{font-size:21px}.execution-note{grid-template-columns:270px 1fr;gap:23px}}@media(max-width:760px){.topbar{height:75px}.edition{display:none}.intro{padding:28px 0 19px}.intro-note{width:210px;font-size:12px}h1{font-size:43px}.intro-note .muted{font-size:10px}.demo-grid{display:flex;flex-direction:column;gap:25px}.phone-column{order:1;max-width:400px;margin:auto;width:100%}.car-column{order:0}.car-screen{aspect-ratio:1.9}.phone{width:300px}.tabs{margin-bottom:21px}.device-label{margin-bottom:12px}.execution-note{display:block}.execution-note p{margin-top:12px}.build-grid{grid-template-columns:1fr;gap:25px}.comparison{grid-column:auto}.notes{gap:20px}.native-nav>span{font-size:12px}.voice-state{padding-bottom:12px}.phase-icon{width:45px;height:45px}}@media(max-width:440px){h1{font-size:37px}.intro-note{width:148px;font-size:11px}.intro-note .muted{font-size:10px}.eyebrow{font-size:8px}.brand{font-size:24px}.car-frame{padding:7px;border-radius:19px}.car-screen{grid-template-columns:45px 1fr;aspect-ratio:1.65}.system-rail{padding:12px 0}.system-clock{font-size:13px}.system-apps{gap:9px}.system-apps span{height:26px;width:26px;font-size:20px}.system-home{transform:scale(.8)}.native-nav{padding:8px}.native-nav>span{font-size:10px}.native-nav button{min-height:36px;font-size:12px;padding:6px 10px}.native-nav>div{gap:5px}.phase-icon{width:40px;height:40px}#carplay-state{font-size:19px}.notes{grid-template-columns:1fr;gap:20px}footer{flex-direction:column;gap:8px}.car-caption p{font-size:10px}.parity-note{font-size:9px}.build-grid th,.build-grid td{min-width:130px;padding:10px}.tabs{gap:25px}}

	/* Cabin voice identity: scoped to the CarPlay display. */
	.car-frame{background:linear-gradient(135deg,#2b4034,#10261e 65%);border-color:#35503d;box-shadow:0 16px 24px -21px #162a27}
	.car-screen{background:var(--forest-edge,#142720)}
	.system-rail{background:linear-gradient(150deg,#2c3b35,#1c3027)}
	.native-template{background:radial-gradient(ellipse at 48% 44%,var(--forest-glow,#304b32) 0%,#20382b 33%,var(--forest-edge,#142720) 76%)}
	.native-nav .car-brand{display:flex;align-items:center;gap:9px;color:#d9e8d9;letter-spacing:1.5px;font-size:10px;font-weight:600}
	.car-brand>span{color:var(--voice-mint,#c3edb0);font-size:19px;line-height:1}
	.native-nav button{border:1px solid #54735b;color:#d6edcc;background:#344f38;border-radius:9px}
	.native-nav button:enabled:hover{background:#426344}
	.native-nav #stop{background:#20372a}
	.voice-state{inset:59px 0 0;gap:8px;padding-bottom:24px}
	#carplay-state{color:#e8f4e8;font-weight:450;margin:0 14px 5px}
	.voice-orb{position:relative;display:grid;place-items:center;flex-shrink:0;width:128px;height:128px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--voice-mint,#c3edb0);touch-action:manipulation;-webkit-user-select:none;user-select:none}
	.voice-orb:disabled{opacity:.75;cursor:default}
	.voice-orb:enabled:hover .orb-core{box-shadow:0 0 34px #b9ef9c26,inset 0 0 24px #b9f8a21c;border-color:#b4d79899}
	.voice-orb:enabled:active{transform:scale(.97)}
	.voice-orb:focus-visible{outline:2px solid var(--voice-mint,#c3edb0);outline-offset:6px}
	.orb-halo{position:absolute;inset:8px;border:1px solid #78987f38;border-radius:50%;box-shadow:0 0 0 8px #7da66b0b,0 0 0 17px #7da66b06;pointer-events:none}
	.orb-core{display:grid;place-items:center;position:relative;width:88px;height:88px;border:1px solid #91b27888;border-radius:50%;background:radial-gradient(circle at 35% 20%,color-mix(in srgb,var(--orb-top) 44%,transparent),var(--orb-bottom,#243e2c) 80%);box-shadow:0 0 25px #9be5ad14,inset 0 0 20px #b9f8a20b;pointer-events:none;transition:box-shadow .18s,border-color .18s}
	.voice-orb .phase-icon{display:grid;place-items:center;width:47px;height:47px;color:var(--voice-mint,#c3edb0)}
	.orb-wave{display:flex;align-items:center;justify-content:center;gap:3px;width:58px;height:40px}
	.orb-wave i{display:block;width:3px;height:var(--bar-height);border-radius:3px;background:var(--voice-mint,#c3edb0)}
	.orb-hint{color:#b0c4ad;font-size:10px;line-height:1.4;letter-spacing:.2px;min-height:14px}
	.car-screen[data-state=listening] .orb-wave i,.car-screen[data-state=speaking] .orb-wave i{animation:cabin-wave .8s ease-in-out infinite alternate}
	.car-screen[data-state=listening] .orb-wave i:nth-child(2n),.car-screen[data-state=speaking] .orb-wave i:nth-child(2n){animation-delay:-.25s}
	.car-screen[data-state=listening] .orb-wave i:nth-child(3n),.car-screen[data-state=speaking] .orb-wave i:nth-child(3n){animation-delay:-.5s}
	.car-screen[data-state=thinking] .orb-halo,.car-screen[data-state=loading] .orb-halo{animation:cabin-breathe 1.8s ease-in-out infinite}
	.car-screen[data-state=error] .orb-core{border-color:#c9ae7799}
	@keyframes cabin-wave{to{transform:scaleY(.45)}}
	@keyframes cabin-breathe{50%{transform:scale(1.06);opacity:.45}}
	@media(max-width:1050px){.native-nav .car-brand{font-size:9px;letter-spacing:1px;gap:6px}}
	@media(max-width:760px){.voice-state{inset:48px 0 0;gap:2px;padding-bottom:10px}.voice-orb{width:102px;height:102px}.orb-core{width:74px;height:74px}.orb-halo{inset:8px}#carplay-state{margin-bottom:1px}.native-nav .car-brand{font-size:9px}}
	@media(max-width:440px){.voice-state{inset:44px 0 0;padding-bottom:8px}.voice-orb{width:80px;height:80px}.orb-core{width:58px;height:58px}.orb-halo{inset:5px;box-shadow:0 0 0 5px #7da66b0b,0 0 0 10px #7da66b06}.voice-orb .phase-icon{width:34px;height:34px}.orb-wave{transform:scale(.72)}.orb-hint{font-size:9px;min-height:12px}.car-brand>span{font-size:15px}.native-nav .car-brand{font-size:8px;letter-spacing:.6px}}
	@media(prefers-reduced-motion:reduce){.car-screen ,.car-screen ::before,.car-screen *::after{animation:none!important;transition:none!important}}