/* V18: render icons at their intended size; separate material from geometry.
   Avoid noise, dashed seams and sub-pixel decoration on 1x displays. */
body[data-edition] {
  --finish-surface: #191a19;
  --finish-raised: #242523;
  --finish-edge: #c9c3b22e;
  --finish-highlight: #eee7d51a;
  --finish-label: #d7d5cd;
  --finish-muted: #a29f95;
  --finish-icon: #cebea0;
  --finish-shadow: #0004;
  --finish-composer: linear-gradient(155deg, #282925f5, #1b1d1bf7);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Microsoft YaHei UI', 'Microsoft YaHei', sans-serif;
}
body[data-edition="titanium"] {
  --finish-surface: #141d25; --finish-raised: #25323c;
  --finish-edge: #b9d1df30; --finish-highlight: #e0f2ff19;
  --finish-label: #d8e4ec; --finish-muted: #9caebc; --finish-icon: #b9d4e5;
  --finish-composer: linear-gradient(155deg, #283640f5, #17232cf7);
}
body[data-edition="ivory"] {
  --finish-surface: #efebe3; --finish-raised: #f9f6ef;
  --finish-edge: #84755b35; --finish-highlight: #ffffffc2;
  --finish-label: #3e463f; --finish-muted: #797a6d; --finish-icon: #817356;
  --finish-shadow: #5e513b16;
  --finish-composer: linear-gradient(155deg, #f8f5eefc, #e9e5dcfa);
}
body[data-edition="original"] {
  --finish-surface: #141d21; --finish-raised: #273239;
  --finish-edge: #c3c9ba30; --finish-label: #dbe2da; --finish-muted: #a1b0ad;
  --finish-composer: linear-gradient(155deg, #29373cf5, #17242df7);
}

/* Continuous surfaces instead of simulated grain and etched pixel lines. */
body[data-edition] .sidebar {
  background: radial-gradient(ellipse at 0 0, var(--finish-highlight), transparent 64%), var(--finish-surface);
  border-right: 1px solid var(--finish-edge);
  box-shadow: 6px 0 24px #0002;
}
body[data-edition] .sidebar::before,
body[data-edition] .sidebar::after,
body[data-edition] .new-chat::before,
body[data-edition] .new-chat::after,
body[data-edition] .access-panel::before,
body[data-edition] .access-panel::after,
body[data-edition] .composer::before,
body[data-edition] .composer::after,
body[data-edition] .topbar::after { content: none; }
body[data-edition] .identity-mark {
  width: 44px; height: 44px; border-radius: 14px;
  border: 1px solid var(--finish-edge);
  background: linear-gradient(145deg, var(--finish-raised), var(--finish-surface));
  box-shadow: inset 0 1px var(--finish-highlight), 0 4px 12px var(--finish-shadow);
}
body[data-edition="obsidian"] .identity-mark { width: 50px; height: 40px; border-radius: 20px; }
body[data-edition="ivory"] .identity-mark { border-radius: 50%; }
body[data-edition] .identity-mark .brand-glyph { width: 24px; height: 24px; filter: none; }
body[data-edition] .identity strong { font-size: 20px; font-weight: 500; letter-spacing: .035em; }
body[data-edition] .identity-sub { font-size: 9px; line-height: 14px; margin-top: 5px; letter-spacing: .055em; }
body[data-edition] .sidebar-edition-stamp { padding-block: 10px; border-color: var(--finish-edge); gap: 2px 10px; }
body[data-edition] .sidebar-edition-stamp strong { font-size: 12px; line-height: 18px; letter-spacing: .06em; }
body[data-edition] .sidebar-edition-stamp small { font-size: 9px; line-height: 14px; letter-spacing: .07em; }
body[data-edition] .new-chat {
  border-radius: 10px; box-shadow: inset 0 1px var(--finish-highlight), 0 5px 14px var(--finish-shadow);
}
body[data-edition="obsidian"] .new-chat { background: linear-gradient(120deg, #373831, #272923); border-color: #d2c3a84a; }
body[data-edition="titanium"] .new-chat { background: linear-gradient(120deg, #dfe9ee, #b8c9d3); border-color: #deebf39c; }
body[data-edition="ivory"] .new-chat { background: linear-gradient(120deg, #3c4d43, #2a3b31); }
body[data-edition] .new-chat-copy strong { font-size: 14px; font-weight: 500; letter-spacing: .025em; text-shadow: none; }
body[data-edition] .new-chat:hover { box-shadow: inset 0 1px var(--finish-highlight), 0 7px 20px var(--finish-shadow); }

/* The shell owns the border. The SVG keeps its full 24 x 24 viewBox. */
body[data-edition] .studio-nav {
  padding: 8px 6px; gap: 2px; border-radius: 12px;
  border: 1px solid var(--finish-edge);
  background: linear-gradient(135deg, var(--finish-highlight), transparent 70%);
  box-shadow: inset 0 1px #ffffff05;
}
body[data-edition] .studio-nav::after { content: none; }
body[data-edition] .studio-nav-item {
  min-height: 48px; padding: 5px 6px; gap: 10px;
  border-radius: 8px; font-size: 13px; font-weight: 400; letter-spacing: .015em;
  color: var(--finish-label);
}
body[data-edition] .studio-nav-item > .nav-icon-shell {
  display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px;
  border: 1px solid var(--finish-edge); border-radius: 10px;
  color: var(--finish-icon); background: linear-gradient(150deg, var(--finish-raised), var(--finish-surface));
  box-shadow: inset 0 1px var(--finish-highlight);
}
body[data-edition] .studio-nav-item > .nav-icon-shell + span { flex: 1; white-space: nowrap; }
body[data-edition] .nav-icon-shell .ui-icon {
  display: block; width: 24px; height: 24px; padding: 0; border: 0;
  background: none; box-shadow: none; filter: none; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
}
body[data-edition="titanium"] .studio-nav-item > .nav-icon-shell { border: 0; background: none; box-shadow: none; }
body[data-edition="ivory"] .studio-nav-item > .nav-icon-shell { border-radius: 50%; }
body[data-edition] .studio-nav-item :is(kbd, .nav-detail) { font-size: 9px; letter-spacing: 0; color: var(--finish-muted); }
body[data-edition] .studio-nav-item:hover { background: var(--finish-highlight); }
body[data-edition] .studio-nav-item:hover .nav-icon-shell { border-color: var(--finish-icon); }
body[data-edition] :is(.conversation-empty > .ui-icon, .conversation-search > .ui-icon) {
  width: 20px; height: 20px; padding: 0; border: 0; border-radius: 0; stroke-width: 1.8; filter: none;
}
body[data-edition] .sidebar-section-heading { font-size: 11px; letter-spacing: .04em; }
body[data-edition] .conversation-search { border-radius: 8px; box-shadow: none; border-color: var(--finish-edge); }
body[data-edition] .conversation-search input { font-size: 12px; }
body[data-edition] .conversation-empty { font-size: 12px; line-height: 1.65; }
body[data-edition] .conversation-open { font-size: 13px; }
body[data-edition] .conversation-group { font-size: 11px; }

/* A single soft edge and light source, with readable secondary information. */
body[data-edition] .access-panel {
  border-radius: 12px; border: 1px solid var(--finish-edge);
  background: linear-gradient(145deg, var(--finish-raised), var(--finish-surface));
  box-shadow: inset 0 1px var(--finish-highlight), 0 8px 24px var(--finish-shadow);
}
body[data-edition] .access-panel-head { font-size: 9px; letter-spacing: .09em; }
body[data-edition] .access-state { font-size: 10px; }
body[data-edition] .usage-heading-label { font-size: 12px; }
body[data-edition] .usage-mini strong { font-size: 28px; text-shadow: none; }
body[data-edition] .usage-mini small { font-size: 11px; line-height: 1.6; }
body[data-edition] .usage-track { height: 3px; border-radius: 3px; overflow: hidden; box-shadow: none; }
body[data-edition] .usage-track::after { content: none; }
body[data-edition] .access-trigger { border-top-color: var(--finish-edge); box-shadow: none; background: transparent; }
body[data-edition] .access-icon { width: 32px; height: 32px; border-radius: 10px; box-shadow: none; background: transparent; }
body[data-edition] .access-icon .ui-icon { width: 24px; height: 24px; stroke-width: 1.6; }
body[data-edition] .access-copy strong { font-size: 13px; }
body[data-edition] .access-copy small { font-size: 10px; line-height: 16px; }
body[data-edition] .side-footnote { font-size: 10px; letter-spacing: .02em; }
body[data-edition] .topbar { background: var(--finish-surface); border-bottom-color: var(--finish-edge); box-shadow: 0 4px 16px #0002; }
body[data-edition] .topbar-overline { font-size: 10px; letter-spacing: .1em; line-height: 14px; }
body[data-edition] .topbar-title { font-size: 13px; }
body[data-edition] :is(.sidebar-toggle, .ambience-trigger, .immersive-trigger, .edition-trigger, .access-primary) {
  border-radius: 8px; border-color: var(--finish-edge); background: var(--finish-highlight); box-shadow: none;
}
body[data-edition] :is(.ambience-trigger, .immersive-trigger, .edition-trigger, .top-access, .live-indicator) { font-size: 11px; }
body[data-edition] :is(.sidebar-toggle, .edition-trigger, .immersive-trigger) .ui-icon { width: 20px; height: 20px; stroke-width: 1.8; }
body[data-edition] .ui-icon { shape-rendering: auto; stroke-linecap: round; stroke-linejoin: round; }
body[data-edition] :is(.hero-sigil, .new-chat-icon) .ui-icon { filter: none; width: 24px; height: 24px; stroke-width: 1.6; }
body[data-edition] .experience-edition { font-size: 10px; letter-spacing: .14em; }
body[data-edition] .experience-edition i { width: 4px; height: 4px; border: 0; border-radius: 50%; background: var(--cabin-accent); transform: none; }
body[data-edition] .experience-scenes button { font-size: 11px; }
body[data-edition] .empty-state .hero-eyebrow { font-size: 12px; letter-spacing: .18em; }
body[data-edition] .empty-state .hero-description { font-size: 14px; letter-spacing: .06em; }
body[data-edition] .hero-action-note { font-size: 12px; letter-spacing: .02em; }
body[data-edition] .hero-explore { font-size: 13px; border-radius: 10px; box-shadow: inset 0 1px #ffffff0d, 0 5px 16px #0003; }
body[data-edition] .composer {
  background: var(--finish-composer); border: 1px solid var(--finish-edge); border-radius: 18px;
  box-shadow: inset 0 1px var(--finish-highlight), 0 16px 48px #0005;
}
body[data-edition] .composer:focus-within { border-color: var(--cabin-accent); box-shadow: 0 0 0 3px rgb(var(--cabin-rgb) / .06), 0 16px 48px #0005; }
body[data-edition] .composer-head { font-size: 11px; letter-spacing: .06em; }
body[data-edition] .composer-shortcut { font-size: 10px; }
body[data-edition] .composer-controls { box-shadow: none; border-color: var(--finish-edge); }
body[data-edition] :is(.model-picker, .mode-picker) { border-radius: 8px; box-shadow: none; border-color: var(--finish-edge); }
body[data-edition] .model-picker { font-size: 13px; font-weight: 500; }
body[data-edition] .mode-picker select { font-size: 12px; font-weight: 400; }
body[data-edition] :is(.model-cost, .char-count) { font-size: 11px; }
body[data-edition] .send-button { box-shadow: none; }
body[data-edition] .send-button .ui-icon { width: 24px; height: 24px; stroke-width: 1.6; }
body[data-edition] .quick-actions button { font-size: 12px; border-radius: 8px; box-shadow: none; background: #182023a6; }
body[data-edition] .quick-actions button .ui-icon { width: 18px; height: 18px; stroke-width: 1.8; }
body[data-edition] .inspiration-card { border-color: #c7cab32c; box-shadow: none; background: #152026ad; border-radius: 14px; }
body[data-edition] .inspiration-emblem { box-shadow: none; }
body[data-edition] .inspiration-emblem .ui-icon { width: 24px; height: 24px; stroke-width: 1.6; }
body[data-edition] .inspiration-eyebrow { font-size: 10px; }
body[data-edition] .inspiration-eyebrow span { font-size: 9px; letter-spacing: .06em; }
body[data-edition] .inspiration-copy h2 { font-size: 14px; }
body[data-edition] .inspiration-copy p { font-size: 12px; }
body[data-edition] #inspiration-use { font-size: 12px; box-shadow: none; }
body[data-edition] .composer-note { font-size: 11px; line-height: 1.6; }

/* Preview cards follow the same finish; decorative captions remain readable. */
body[data-edition] .editions-dialog { border-color: #c6c3b535; border-radius: 20px; background: linear-gradient(145deg, #282b2b, #171e22); box-shadow: inset 0 1px #f2eddf12, 0 28px 90px #0008; }
body[data-edition] .edition-card { border-radius: 13px; box-shadow: none; }
body[data-edition] .edition-card[aria-pressed="true"] { box-shadow: none; border-color: #c2b392a3; }
body[data-edition] .edition-card-heading strong { font-size: 14px; }
body[data-edition] .edition-preview-rail { background-image: none; }
body[data-edition] [data-edition-option="obsidian"] .edition-preview-rail { background: linear-gradient(135deg, #303129, #181b17); }
body[data-edition] [data-edition-option="titanium"] .edition-preview-rail { background: linear-gradient(135deg, #2f3c45, #15212a); }
body[data-edition] [data-edition-option="ivory"] .edition-preview-rail { background: linear-gradient(135deg, #f5f1e9, #dfd9cd); }
body[data-edition] .edition-preview-stage > span { font-size: 12px; }
body[data-edition] .edition-caption { font-size: 9px; letter-spacing: .04em; }
body[data-edition] .edition-description { font-size: 12px; }
body[data-edition] :is(#editions-description, .editions-selection-status, .editions-view) { font-size: 12px; }
body[data-edition] :is(.editions-storage-note, .editions-eyebrow) { font-size: 10px; }
body[data-edition] .studio-tools-dialog .ui-icon { stroke-width: 1.8; }
body[data-edition] .studio-template-glyph .ui-icon { width: 24px; height: 24px; stroke-width: 1.6; }

@media (min-width: 761px) and (min-height: 501px), (min-width: 951px) {
  body[data-edition].sidebar-collapsed .sidebar-top { padding-inline: 0; }
  body[data-edition].sidebar-collapsed .identity-mark { width: 44px; height: 40px; }
  body[data-edition].sidebar-collapsed .studio-nav { border: 0; background: none; box-shadow: none; padding: 8px 0; }
  body[data-edition].sidebar-collapsed .studio-nav-item { padding: 5px 0; }
  body[data-edition].sidebar-collapsed .studio-nav-item > .nav-icon-shell { display: grid; flex: 0 0 34px; }
  body[data-edition].sidebar-collapsed .access-panel { background: none; border: 0; box-shadow: none; }
}
@media (max-height: 820px), (max-width: 760px) and (max-height: 900px) {
  body[data-edition] .sidebar { padding-top: 18px; padding-bottom: 12px; overflow-y: auto; }
  body[data-edition] .sidebar-top { padding-bottom: 10px; }
  body[data-edition] .sidebar-edition-stamp { margin-bottom: 10px; padding-block: 5px; }
  body[data-edition] .studio-nav { margin-top: 8px; padding-block: 4px; gap: 0; }
  body[data-edition] .studio-nav-item { min-height: 40px; padding-block: 3px; }
  body[data-edition] .studio-nav-item > .nav-icon-shell { width: 32px; height: 32px; flex-basis: 32px; }
  body[data-edition] .sidebar-section-heading { margin-block: 13px 8px; }
  body[data-edition] .conversation-list { min-height: 44px; flex: 1 1 44px; }
  body[data-edition] .conversation-empty { padding-block: 6px; font-size: 11px; flex-direction: row; align-items: center; gap: 9px; }
  body[data-edition] .sidebar-bottom { padding-top: 8px; }
  body[data-edition] .access-panel-head { padding-top: 12px; }
  body[data-edition] .usage-mini { padding-block: 12px 9px; }
  body[data-edition] .usage-track { margin-top: 10px; }
  body[data-edition] .access-trigger { min-height: 50px; padding-block: 8px; }
  body[data-edition] .side-footnote { margin-top: 9px; }
}
@media (max-width: 1100px) and (min-width: 761px) {
  body[data-edition] .topbar-overline { display: none; }
  body[data-edition] .studio-nav-item :is(kbd, .nav-detail) { display: none; }
}
@media (max-width: 760px) {
  body[data-edition] .studio-nav-item { min-height: 44px; }
  body[data-edition] .identity-sub { font-size: 8px; }
  body[data-edition] .topbar-overline { display: none; }
  body[data-edition] .edition-trigger { width: 32px; height: 32px; padding: 5px; }
  body[data-edition] .topbar #export-chat { font-size: 0; }
  body[data-edition] .top-access { font-size: 10px; }
  body[data-edition] .experience-edition { font-size: 9px; letter-spacing: .06em; }
  body[data-edition] .empty-state .hero-eyebrow { font-size: 11px; }
  body[data-edition] .empty-state .hero-description { font-size: 13px; letter-spacing: .02em; }
  body[data-edition] .hero-action-note { font-size: 11px; }
  body[data-edition] .composer { border-radius: 14px; }
  body[data-edition] .model-picker { font-size: 12px; }
  body[data-edition] .quick-actions { gap: 6px; }
  body[data-edition] .quick-actions button { font-size: 11px; padding-inline: 9px; }
  body[data-edition] .inspiration-copy p { font-size: 11px; }
  body[data-edition] .inspiration-eyebrow span { display: none; }
  body[data-edition] .composer-note { font-size: 10px; }
  body[data-edition] .edition-card-heading strong { font-size: 12px; }
  body[data-edition] .edition-caption { font-size: 8px; padding-left: 2px; }
  body[data-edition] .edition-description { font-size: 10px; }
  body[data-edition] .edition-preview-stage > span { font-size: 10px; }
  body[data-edition] .editions-storage-note { font-size: 10px; }
}