/* Sawiha 2026 — Quiet Emerald Editorial Studio. Existing IDs and behavior stay owned by index.html. */
:root{--ground:#f7f6f1;--panel:#fbfaf6;--panel-2:#edf3f0;--panel-3:#dfe8e4;--ink:#17362f;--ink-soft:#687772;--ink-faint:#8c9894;--rule:rgba(23,54,47,.1);--accent:#087a64;--accent-ink:#06604f;--accent-wash:#dff2ea;--warn:#b9781d;--danger:#b73d45;--ok:#087a64;--shadow:0 18px 55px rgba(23,54,47,.09),0 2px 9px rgba(23,54,47,.05);--lift:0 8px 28px rgba(23,54,47,.06);--float:0 -2px 8px rgba(23,54,47,.05),0 -24px 55px rgba(23,54,47,.16);--sidebar-w:15.5rem;--r-md:14px;--r-lg:20px;--r-xl:26px;--t-display:clamp(2.55rem,1.25rem + 4.3vw,5rem)}
:root[data-theme="dark"]{--accent:#35b397;--accent-ink:#79d4c0;--accent-wash:#0d332b}
body{background:var(--ground);background-image:radial-gradient(circle at 8% 12%,rgba(8,122,100,.055),transparent 27%),radial-gradient(circle at 88% 88%,rgba(216,154,50,.04),transparent 24%)}
#sidebar{padding:1.25rem 1rem;border-inline-end:1px solid var(--rule);background:color-mix(in srgb,var(--ground) 90%,transparent);backdrop-filter:blur(22px)}
.side-top{min-height:3rem;padding-inline:.45rem}.brand{display:inline-flex;align-items:center;gap:.6rem;font-size:1.05rem;font-weight:800;letter-spacing:-.04em}.brand-mark{width:2.1rem;height:2.1rem;display:grid;place-items:center;border-radius:.72rem;background:var(--panel);color:var(--accent);box-shadow:var(--lift);font-weight:900}.brand-word{color:var(--ink)}
.side-item{position:relative;min-height:2.75rem;padding:.58rem .72rem;border-radius:12px;color:var(--ink-soft);font-weight:600}.side-item:hover,.side-item.on{background:var(--panel);color:var(--ink);box-shadow:0 5px 18px rgba(23,54,47,.055)}.side-item.on:before{content:"";position:absolute;inset-inline-start:-1rem;width:3px;height:1.35rem;border-radius:0 3px 3px 0;background:var(--accent)}
.side-label{margin-top:.75rem;color:var(--ink-faint);font-weight:700;letter-spacing:.08em}.side-bottom{margin:.75rem 0 0;padding:.75rem;border:0;border-radius:16px;background:var(--ink);color:#fff}.side-bottom .who-mail,.side-bottom .icon-btn{color:#dbe7e2}
#view-dashboard{overflow:auto;padding-bottom:4rem}.hero{width:min(100%,76rem);margin:0 auto;padding:clamp(3.5rem,7vw,6.5rem) clamp(1rem,4vw,4rem) 1.5rem;text-align:initial}.hero-kicker{display:flex;align-items:center;gap:.45rem;margin-bottom:.7rem;color:var(--accent);font-size:var(--t-meta);font-weight:800}.hero-kicker:before{content:"✣"}.hero h1{max-width:12ch;margin:0;font-size:var(--t-display);line-height:1.08;letter-spacing:-.055em}.hero>p{max-width:46rem;margin:.75rem 0 1.75rem;color:var(--ink-soft);font-size:1.03rem}.hero-promise{display:flex;align-items:center;gap:.55rem;margin-bottom:1rem;color:var(--ink-faint);font-size:var(--t-meta)}.hero-promise b{color:var(--accent);font-family:var(--mono);font-size:var(--t-micro)}.hero-promise i{width:2.5rem;height:1px;background:linear-gradient(90deg,var(--rule),transparent)}
.composer-card{position:relative;overflow:hidden;padding:1rem;border:1px solid color-mix(in srgb,var(--accent) 16%,var(--rule));border-radius:var(--r-xl);background:linear-gradient(120deg,color-mix(in srgb,var(--panel) 97%,transparent),color-mix(in srgb,var(--accent-wash) 48%,var(--panel)));box-shadow:0 30px 80px rgba(23,54,47,.1),var(--lift)}.composer-card:after{content:"";position:absolute;inset:-40% -10% auto auto;width:22rem;height:22rem;border:1px solid rgba(8,122,100,.08);border-radius:45% 55% 65% 35%;transform:rotate(-16deg);pointer-events:none}.composer-card textarea{position:relative;z-index:1;min-height:9.5rem;padding:1rem;border:0;background:transparent;font-size:1.05rem;line-height:1.9}.composer-row{position:relative;z-index:1;padding-top:.8rem;border-top:1px solid var(--rule)}.composer-row select,.composer-row .bordered{min-height:2.4rem;background:color-mix(in srgb,var(--panel) 84%,transparent);border-color:var(--rule)}#hero-send{width:auto;min-width:2.8rem;height:2.8rem;border-radius:13px;box-shadow:0 9px 22px rgba(8,122,100,.23)}
.chips{justify-content:flex-start;margin-top:.85rem}.chip{background:transparent;border-color:transparent;color:var(--ink-soft)}.chip:hover{background:var(--panel);border-color:var(--rule);color:var(--accent)}
.grid-head{position:relative;width:min(100%,76rem);margin:3.4rem auto 0;padding-inline:clamp(1rem,4vw,4rem);align-items:end}.grid-head h2{font-size:1.8rem;letter-spacing:-.04em}.grid-head:before{content:"مساحة العمل";position:absolute;inset-inline-start:clamp(1rem,4vw,4rem);transform:translateY(-1.7rem);color:var(--accent);font-size:var(--t-micro);font-weight:800}.cards{width:min(100%,76rem);margin:0 auto;padding:1rem clamp(1rem,4vw,4rem) 0;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.card-proj{overflow:hidden;border:1px solid var(--rule);border-radius:20px;background:color-mix(in srgb,var(--panel) 92%,transparent);box-shadow:var(--lift)}.card-proj:hover{border-color:color-mix(in srgb,var(--accent) 30%,var(--rule));box-shadow:var(--shadow);transform:translateY(-4px)}.thumb{min-height:12rem;background:linear-gradient(145deg,var(--accent-wash),color-mix(in srgb,var(--panel-3) 60%,var(--panel)));font-size:2rem}.card-body{padding:.85rem 1rem .95rem;background:var(--panel)}.card-name{font-size:.92rem}.card-actions button{background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(12px)}
#view-editor{background:var(--panel)}.topbar{min-height:3.8rem;padding:.5rem .75rem;background:color-mix(in srgb,var(--panel) 94%,transparent);backdrop-filter:blur(18px)}.topbar .tabs{background:var(--panel-2)}.topbar .tabs button.on{background:var(--panel);box-shadow:0 2px 8px rgba(23,54,47,.08)}#agent-state.busy:before{content:"";width:.45rem;height:.45rem;display:inline-block;margin-inline-end:.4rem;border-radius:50%;background:var(--accent);animation:sawiha-pulse 1.7s infinite}.editor-main{background:var(--panel-3)}.chat{background:var(--panel);border-inline-end:1px solid var(--rule)}.chat .log{padding:1rem}.chat-composer{background:var(--panel)}.chat-composer .box{border-radius:15px;background:var(--ground)}.panel{background:#0c211b}.panel-bar{min-height:3rem;border-color:rgba(255,255,255,.09);background:#0f2a23;color:#dce9e4}.panel-bar button,.panel-bar .url,.panel-bar #device-size{color:#c6d6d0}.panel-bar .mode-toggle{background:rgba(255,255,255,.08)}.panel-bar .mode-toggle button.on{background:var(--panel);color:var(--ink)}.stage{padding:1rem;background:#081b16;background-image:radial-gradient(circle at 20% 10%,rgba(8,122,100,.12),transparent 30%)}.stage iframe{border-radius:12px;box-shadow:0 28px 80px rgba(0,0,0,.28)}
@keyframes sawiha-pulse{0%,100%{box-shadow:0 0 0 0 rgba(8,122,100,.26)}50%{box-shadow:0 0 0 7px rgba(8,122,100,0)}}
@media(max-width:64rem){#app{grid-template-columns:1fr}.hero{padding:2.25rem 1rem 1rem}.hero h1{font-size:clamp(2.35rem,10vw,3.5rem)}.hero>p{font-size:.92rem}.hero-promise{display:none}.composer-card{padding:.72rem;border-radius:18px}.composer-card textarea{min-height:8rem;padding:.8rem;font-size:.95rem}.composer-row{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.25rem}.composer-row>*{flex:none}.composer-row .spacer{display:none}.chips{overflow-x:auto;flex-wrap:nowrap}.chip{flex:none}.grid-head{margin-top:2.5rem;padding-inline:1rem}.grid-head:before{inset-inline-start:1rem}.cards{padding-inline:1rem;grid-template-columns:1fr}.thumb{min-height:10rem}.stage{padding:.55rem}.panel-bar{background:#0f2a23}.topbar{min-height:3.65rem}}
@media(max-width:44rem){.topbar #publish-btn{background:var(--accent);color:#fff}.topbar{gap:.3rem}.topbar #agent-state{max-width:7rem}.card-proj{border-radius:17px}.grid-head h2{font-size:1.55rem}}

/* Authentication belongs to the product studio rather than a generic centered card. */
#auth{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(24rem,29rem);align-items:center;gap:clamp(2rem,7vw,7rem);min-height:100dvh;padding:clamp(1.25rem,5vw,5rem);overflow:hidden;background:linear-gradient(115deg,color-mix(in srgb,var(--accent-wash) 58%,var(--ground)),var(--ground) 54%)}
#auth:before{content:"من الفكرة إلى نسخة تعمل";grid-column:1;grid-row:1;min-height:min(72vh,42rem);display:flex;align-items:flex-end;padding:clamp(2rem,5vw,4rem);border-radius:32px;background:radial-gradient(circle at 25% 20%,rgba(216,154,50,.22),transparent 13%),linear-gradient(145deg,#17362f,#0a574b);color:#eff8f4;font-size:clamp(2.4rem,5vw,5.5rem);font-weight:800;line-height:1.12;letter-spacing:-.055em;box-shadow:0 40px 100px rgba(23,54,47,.2)}
#auth:after{content:"ابنِ · عاين · انشر";position:absolute;z-index:-1;inset-inline-start:clamp(3.25rem,7vw,7rem);inset-block-start:clamp(3.25rem,7vw,7rem);color:#9dd8c8;font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.08em}
#auth .sheet{grid-column:2;grid-row:1;width:100%;max-width:29rem;padding:clamp(1.5rem,4vw,2.6rem);border:1px solid color-mix(in srgb,var(--accent) 15%,var(--rule));border-radius:26px;background:color-mix(in srgb,var(--panel) 94%,transparent);box-shadow:var(--shadow);backdrop-filter:blur(22px)}
#auth .sheet h2{display:flex;align-items:center;gap:.7rem;margin-bottom:.7rem;color:var(--ink);font-size:2rem;letter-spacing:-.05em}#auth .sheet h2:before{content:"س";width:2.7rem;height:2.7rem;display:grid;place-items:center;border-radius:13px;background:var(--accent);color:#fff;font-size:1.15rem;box-shadow:0 10px 24px rgba(8,122,100,.2)}
#auth .sheet>p{margin-bottom:1.5rem;color:var(--ink-soft);line-height:1.8}#auth input{min-height:3.15rem;padding-inline:.9rem;border-color:var(--rule);border-radius:12px;background:var(--ground)}#auth input:focus{background:var(--panel);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 11%,transparent)}#auth .primary{min-height:3.1rem;border-radius:12px;box-shadow:0 10px 25px rgba(8,122,100,.2)}#auth-note{margin-top:.7rem}
@media(max-width:58rem){#auth{grid-template-columns:1fr;padding:1rem;background:linear-gradient(160deg,var(--accent-wash),var(--ground) 45%)}#auth:before{display:none}#auth:after{inset-inline-start:1.5rem;inset-block-start:1.35rem}#auth .sheet{grid-column:1;max-width:30rem;margin:auto;border-radius:22px}}

/* Marketplace: templates are a separate discovery surface, not an intake select. */
.marketplace{width:min(100%,76rem);margin:4.75rem auto 0;padding:0 clamp(1rem,4vw,4rem) 4rem}.marketplace-head{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:1.1rem}.marketplace-head h2{margin:.25rem 0;font-size:clamp(1.7rem,2vw,2.35rem);letter-spacing:-.05em}.marketplace-head p{max-width:38rem;margin:0;color:var(--ink-soft);line-height:1.7}.template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.template-card{overflow:hidden;border:1px solid var(--rule);border-radius:22px;background:var(--panel);box-shadow:var(--lift);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.template-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--accent) 28%,var(--rule));box-shadow:var(--shadow)}.template-preview{position:relative;min-height:11.5rem;overflow:hidden;background:linear-gradient(135deg,#e1eee9,#bddbd1 55%,#f2dfba);isolation:isolate}.template-preview:before{content:"";position:absolute;inset:1.4rem 1.2rem 1.1rem;border-radius:10px;background:var(--panel);box-shadow:0 16px 34px rgba(23,54,47,.15);transform:rotate(-1.5deg)}.template-preview:after{content:"";position:absolute;inset:2.2rem 2rem auto;height:1.7rem;border-radius:5px;background:var(--accent);opacity:.8}.template-preview-bar,.template-preview-panel,.template-preview-content{position:absolute;z-index:1;display:block;border-radius:4px}.template-preview-bar{inset:4.8rem 2rem auto;height:.8rem;width:30%;background:color-mix(in srgb,var(--ink) 78%,transparent)}.template-preview-panel{inset:6.2rem auto auto 2rem;width:28%;height:3.7rem;background:var(--accent-wash)}.template-preview-content{inset:6.2rem 2rem auto auto;width:57%;height:3.7rem;background:color-mix(in srgb,var(--panel-3) 74%,var(--panel))}.template-commerce-starter{background:linear-gradient(135deg,#f2e5cc,#c5e4d9)}.template-commerce-starter:after{background:#b9781d}.template-operations-dashboard{background:linear-gradient(135deg,#d7e3ee,#c7d9d0)}.template-operations-dashboard:after{background:#285d84}.template-preview-large{min-height:18rem;border-radius:16px;margin:1rem 0}.template-card-body{padding:1rem}.template-card-top,.template-card-actions{display:flex;align-items:center;justify-content:space-between;gap:.65rem}.template-type{color:var(--accent);font-size:.76rem;font-weight:800}.template-cost{color:var(--warn);font-size:.76rem;font-weight:800}.template-card h3{margin:.5rem 0 .3rem;font-size:1.12rem}.template-card p{min-height:3.2rem;margin:0;color:var(--ink-soft);font-size:.88rem;line-height:1.7}.template-techs{display:flex;flex-wrap:wrap;gap:.35rem;margin:1rem 0}.template-techs span{padding:.25rem .5rem;border:1px solid var(--rule);border-radius:999px;color:var(--ink-soft);font-family:var(--mono);font-size:.67rem}.template-card-actions{justify-content:flex-start;margin-top:1rem}.template-card-actions button{flex:1;min-height:2.45rem}.template-preview-meta{padding:.7rem .85rem;border:1px solid var(--rule);border-radius:12px;background:var(--ground);color:var(--ink-soft);font-family:var(--mono);font-size:.76rem}
@media(max-width:64rem){.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.marketplace{padding-inline:1rem}.marketplace-head{align-items:start}}
@media(max-width:44rem){.marketplace{margin-top:3rem}.marketplace-head{display:block}.marketplace-head .bordered{width:100%;margin-top:1rem}.template-grid{grid-template-columns:1fr}.template-preview{min-height:10rem}.template-card p{min-height:0}}

.composer-source-toggle{position:relative;z-index:2;display:inline-flex;gap:.25rem;padding:.22rem;border:1px solid var(--rule);border-radius:999px;background:color-mix(in srgb,var(--panel) 75%,transparent);margin-bottom:.55rem}.composer-source-toggle button{border:0;border-radius:999px;padding:.38rem .72rem;background:transparent;color:var(--ink-soft);font:inherit;font-size:.75rem;font-weight:700;cursor:pointer}.composer-source-toggle button.on{background:var(--ink);color:var(--panel);box-shadow:0 4px 12px rgba(23,54,47,.12)}#hero-url-input{position:relative;z-index:1;width:100%;min-height:5.5rem;padding:1rem;border:1px solid var(--rule);border-radius:15px;background:color-mix(in srgb,var(--panel) 88%,transparent);color:var(--ink);font:inherit;direction:ltr;text-align:left}#hero-url-input::placeholder{direction:rtl;text-align:right;color:var(--ink-faint)}.template-preview-btn{background:var(--panel)}
@media(max-width:44rem){.composer-source-toggle{width:100%}.composer-source-toggle button{flex:1}.template-card-actions{flex-wrap:wrap}.template-card-actions button{min-width:8rem}}

.address-choice{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:.65rem 0}.address-choice button{border:1px solid var(--rule);border-radius:14px;padding:.7rem .8rem;background:var(--panel);color:var(--ink);font:inherit;font-size:.82rem;font-weight:700;cursor:pointer}.address-choice button.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent)}.address-domain-hint{font-size:.78rem;line-height:1.8;padding:.55rem .7rem;border-radius:12px;background:var(--panel-2);color:var(--ink-soft)}
@media(max-width:44rem){.address-choice{grid-template-columns:1fr}.address-choice button{text-align:center}}

.dns-records{display:grid;gap:.45rem;margin-block:.55rem}.dns-records-title{font-size:.78rem;font-weight:800;color:var(--ink-soft)}.dns-record{display:grid;grid-template-columns:6.5rem minmax(0,1fr) auto;align-items:center;gap:.5rem;padding:.5rem .6rem;border:1px solid var(--rule);border-radius:11px;background:var(--panel-2)}.dns-record-meta{font-size:.72rem;font-weight:800;color:var(--accent);direction:ltr;text-align:left}.dns-record-value{min-width:0;overflow-wrap:anywhere;font: .76rem/1.5 var(--mono);direction:ltr;text-align:left;color:var(--ink)}.dns-record button{font-size:.72rem;padding:.25rem .5rem}@media(max-width:44rem){.dns-record{grid-template-columns:1fr auto}.dns-record-value{grid-column:1/-1;grid-row:2}.dns-record-meta{font-size:.76rem}}

/* ── Clarity pass, requested by the platform's owner ─────────────────────────
   Three complaints, each measured in a real browser before this was written:
   project cards two to a row at 192px of thumbnail; the sign-in data over the
   preview drawn light-grey on a white chip over a dark bar, unreadable; and on
   a phone, a crowded chrome over a preview of the site at desktop width shrunk
   to 27%. */

/* Projects: smaller cards, more to a row. */
.cards{grid-template-columns:repeat(auto-fill,minmax(10.25rem,1fr));gap:.85rem}
.grid-head{padding-top:1.35rem}.grid-head:before{transform:none;top:0}
.thumb{min-height:0;aspect-ratio:16/9;font-size:1.4rem}
.card-body{padding:.6rem .75rem .7rem}
.card-name{font-size:.88rem}
@media(max-width:64rem){.cards{grid-template-columns:repeat(auto-fill,minmax(10.5rem,1fr))}.thumb{min-height:0}}
@media(max-width:44rem){.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;padding-inline:.75rem}.card-body{padding:.5rem .6rem .6rem}.card-name{font-size:.82rem}.card-proj{border-radius:14px}}

/* The data over the preview, readable on the dark bar it sits on. */
#bar-keys{background:#0f2a23;color:#e6f0ec}
#bar-keys .note{color:#b9ccc5;font-size:.8rem}
.key{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.14);color:#eef5f2}
.key b{color:#fff;font-size:.82rem}
.key .url,.key .key-door{color:#9fe0c8}
.key-val{color:#fff;font-size:.85rem}
.key .icon-btn{color:#dce9e4}
.key-surfaces{background:transparent;border:0;padding:0;gap:.3rem}
.key-surfaces [data-surface]{padding:.3rem .75rem;border-radius:999px;background:rgba(255,255,255,.09);color:#e6f0ec;font-size:.82rem;font-weight:600;text-decoration:none}
.key-surfaces [data-surface].on{background:#e6f0ec;color:#0f2a23}
.panel-bar .bordered{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#e6f0ec}
.panel-bar button:disabled{opacity:.4}

/* A phone: one row of tools over the preview, the site at phone width. */
@media(max-width:44rem){
  #device-toggle,#device-size,#preview-url{display:none}
  #mark,#shot{font-size:0;width:2.25rem;height:2.25rem;padding:0;justify-content:center}
  #mark::before{content:"⌖";font-size:1.05rem}
  #shot::before{content:"📷";font-size:1rem}
  #resume-wrap:has(#resume:disabled){display:none}
  #bar-preview{flex-wrap:nowrap;overflow-x:auto;gap:.35rem;min-height:2.75rem;scrollbar-width:none}
  #bar-preview::-webkit-scrollbar{display:none}
  #bar-keys{padding-block:.3rem}
  /* The two values typed elsewhere fit one phone row once the role and the
     path step aside; the surfaces take a row of their own below them. */
  .keys-list{flex-wrap:wrap;overflow-x:visible}
  .key b,.key:not(.key-surfaces) .key-door,#bar-keys>.note{display:none}
  .key{padding-inline-start:.4rem}
}

/* The agent's replies, formatted: paragraphs, lists, bold, inline code. */
.log .body p{margin:0 0 .55em}.log .body p:last-child{margin-bottom:0}
.log .body .md-h{font-weight:700}
.log .body ul,.log .body ol{margin:.2em 0 .6em;padding-inline-start:1.25em}
.log .body li{margin:.18em 0}
.log .body strong{font-weight:700}
.log .body code{font-family:var(--mono);font-size:.88em;background:rgba(15,42,35,.07);padding:.05em .35em;border-radius:6px;direction:ltr;unicode-bidi:isolate}

/* ── Mobile clarity, measured ────────────────────────────────────────────────
   An automated audit of every visible element at 390×844, in every state a
   project has (delivered, building, awaiting a step) and every sheet height,
   found: faint labels at 2.86:1 against a 4.5:1 floor, 11px text, a close
   button 18×19px, controls at 34px, and 205px of chrome over the preview. */

/* The two inks every quiet label is drawn in, raised to at least 4.5:1 on
   every light surface — the root of most of the contrast failures, fixed once. */
:root:not([data-theme="dark"]){--ink-soft:#4f5d57;--ink-faint:#5d6b65}

#surface-select{display:none}

@media(max-width:44rem){
  /* A finger, not a cursor: nothing tappable under 40px. */
  #reload,#open-tab,#mark,#shot,#attach,#send,.key .icon-btn,#dash-menu,#dash-theme,.card-actions button{min-width:40px;min-height:40px}
  .handoff-x{min-width:40px;min-height:40px;font-size:1.25rem;display:inline-grid;place-items:center}
  .composer-source-toggle button{min-height:40px}
  .key-surfaces [data-surface]{min-height:40px}
  /* Nothing a person must read under 12.5px. */
  .msg .who{font-size:.8rem}
  .msg.tool .body{font-size:.8rem}
  .handoff-stats span{font-size:.8rem}
  #grab-clock,#grab-now{font-size:.85rem}
  .conv-card .note,.conv-audit{font-size:.82rem}
  /* Every project action lives in the ⋯ menu on a phone, and «الاتّصالات» is
     one — a third control in this row costs 11px of the site's own screen. */
  #connections-btn{display:none}
  /* The surfaces as one control in the tools row, not a third row of chrome. */
  #surface-select:not(.hidden){display:block;min-height:40px;max-width:9.5rem;border-radius:999px;padding:0 .75rem;background:rgba(255,255,255,.1);color:#e6f0ec;border:1px solid rgba(255,255,255,.18);font:inherit;font-size:.85rem;font-weight:600}
  #surface-select option{color:#17362f}
  .key-surfaces{display:none}
}

/* No text a person must read below 12.5px, at any width — the same audit at
   1280 found 11px labels in the chat, the delivery card, the live band, the
   preview's own width readout and the sidebar. */
.msg .who,.msg.tool .body,.handoff-stats span,.live-step,#device-size,.side-label,.side-item .count,.count,.hero-promise b{font-size:.78rem}