/* [claude-opus-5-5 2026-10-01] Amber theme, adapted from razzphox's Unquant design study (Discord, 1 October 2026).
   Owner direction: bring his palette, type and surface treatment in as a selectable theme, inside the site's own
   compact layout; elevation and bevels only on things people interact with, flat defined surfaces elsewhere.
   Amber starts from Graphite's full rule set (styles.css lists it beside Graphite); this file only adds the
   differences. Sizes and spacing are never changed here. Headings use Barlow Condensed (SIL OFL 1.1,
   assets/fonts/BarlowCondensed-OFL.txt). */

@font-face{font-family:'Barlow Condensed';src:url('/assets/fonts/BarlowCondensed-SemiBold.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}

:root[data-theme=amber]{--bg:#0d1113;--sidebar:#12181b;--panel:#172024;--raised:#232c30;--line:#3d474c;--text:#f0f1ea;--muted:#c0c7c4;--subtle:#a3aca8;--mint:#ffc348;--amber-strong:#ffd36f;--amber-deep:#c98a1c}
[data-theme=amber] body{background-color:var(--bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='96' height='96' opacity='.045' filter='url(%23g)'/%3E%3C/svg%3E")}
[data-theme=amber] ::selection{background:#ffc348;color:#161208}
[data-theme=amber] :focus-visible{outline:2px solid #ffc348;outline-offset:3px}

/* Type: condensed display face for headings only; text and code fonts come from the site type block at the end of
   styles.css. [claude-opus-5-5 2026-10-01] Owner: the sidebar wordmark keeps its Segoe UI on every theme. */
[data-theme=amber] :is(h1,h2,.page-head h1){font-family:'Barlow Condensed',var(--font),sans-serif;font-weight:600;letter-spacing:.005em}
[data-theme=amber] :is(.eyebrow,.text-button,.code-string){color:#ffc348}
[data-theme=amber] .text-button:hover{color:#ffd36f}

/* Flat, defined surfaces: borders carry the structure, depth is reserved for controls. */
[data-theme=amber] .sidebar{background:linear-gradient(90deg,#151c1f,#10161a);border-right-color:#3a4449;box-shadow:1px 0 0 #05080a}
[data-theme=amber] .topbar{background:linear-gradient(#1a2226,#13191c);border-bottom-color:#3d474c;box-shadow:0 1px 0 #05080a}
[data-theme=amber] :is(.panel,.stat){background:#161e22;border-color:#3a4449;box-shadow:0 1px 0 #05080a}
[data-theme=amber] .panel::before{display:none}
[data-theme=amber] .model-card{background:linear-gradient(115deg,#1d262a,#161e22 70%);border-color:#465157}
[data-theme=amber] .help-box{background:#141b1e;border-color:#3a4449}
[data-theme=amber] .preview-bar{background:#12181b;border-color:#3a4449}
[data-theme=amber] .model-tags span{background:#121a1d;border-color:#465157;color:#d6dbd6}
[data-theme=amber] .model-sculpture i{border-color:#ffc34855}
[data-theme=amber] :is(.model-symbol,.workspace-icon,.tile-icon){background:linear-gradient(#2c363b,#1a2226);border-color:#56636a;color:#ffc348}
[data-theme=amber] dialog{background:linear-gradient(160deg,#1d262a,#141b1e);border-color:#4f5b61}
[data-theme=amber] .auth-aside{background:radial-gradient(ellipse at 50% 40%,#2a3236,#161e22 58%,#0d1113)}

/* Wells: inputs and code sit below the surface. */
[data-theme=amber] :is(.field-copy,input,select,textarea,.secret-box){background:#0a0e10;border-color:#465157;box-shadow:inset 0 2px 4px #000a,0 1px 0 #ffffff08}
[data-theme=amber] :is(input,select,textarea):focus{border-color:#c98a1c}
[data-theme=amber] .code-panel{background:#0a0e10;border-color:#3a4449}
[data-theme=amber] .code-header{background:linear-gradient(#232c30,#182023);border-color:#465157}

/* Controls carry the elevation: bevelled metal, and the gold primary action. */
[data-theme=amber] .button.primary{background:linear-gradient(#ffd36f,#f0ab26);border-color:#ffe08f #b97a12 #94600a;color:#1a1408;box-shadow:inset 0 1px 0 #fff3c4b3,0 2px 4px #0009;text-shadow:0 1px 0 #ffe9a866}
[data-theme=amber] .button.primary:not(.control-surface):hover{background:linear-gradient(#ffdd86,#f6b83a)}
[data-theme=amber] :is(.button.ghost,.workspace-switch,.quick-link,.theme-trigger,.currency-trigger,.plan-picker-trigger){background:linear-gradient(#2c363b,#1b2327);border-color:#56636a #3a4449 #232b2f;color:#eef0ea;box-shadow:inset 0 1px 0 #ffffff14,0 2px 3px #0007}
[data-theme=amber] :is(.button.ghost,.workspace-switch,.quick-link,.theme-trigger,.currency-trigger):not(:disabled):hover{border-color:#8f7637 #56636a #2c363b}
[data-theme=amber] :is(.field-copy .icon-button,.code-header>.icon-button){background:linear-gradient(#2c363b,#1b2327);border-color:#56636a;color:#e3e6e0}
[data-theme=amber] .nav a:hover{background-color:#1f282c}
[data-theme=amber] .nav a.active{background:linear-gradient(#273136,#1c2428);color:#ffd36f;box-shadow:inset 0 1px 0 #ffffff12,0 2px 4px #0006}
[data-theme=amber] .nav a.active::after{background-color:#ffc348}
[data-theme=amber] .brand-dot{color:#ffc348}
[data-theme=amber] .tabs .tab[aria-selected=true]{background:linear-gradient(#11171a,#1e272b);border-color:#c98a1c99;color:#ffd36f}
[data-theme=amber] .plan-label,[data-theme=amber] .plan-panel .button.ghost{color:#ffd36f}

/* Theme picker swatch (the picker is on public pages too, so its styles cover .public-root). */
:is(.workspace-root,.public-root) [data-swatch=amber],.theme-swatch[data-swatch=amber]{background:linear-gradient(135deg,#ffc348 0 48%,#172024 51%)}

/* [claude-opus-5-5 2026-10-03] razzphox: the stacked-plans tabs and stream pips in amber, Barlow tab names. */
[data-theme=amber] .stream-pips i.on{background:linear-gradient(var(--amber-strong),var(--amber-deep));box-shadow:inset 0 1px #fff6,inset 0 -1px #0005}
[data-theme=amber] .plan-tab strong{font-family:"Barlow Condensed","Wine Tahoma",Tahoma,Arial,sans-serif;font-size:14px;letter-spacing:.01em}
[data-theme=amber] .plan-tab[data-pool]{--tab-strip:var(--amber-strong)}