/* finesse · register=shared-product-system · page=responsive-radius-scale · palette=existing-light-dark-champagne-market-semantics · type=DM-Sans+Noto-Sans-SC · radius=client-mobile-4-6-8-10-12+web-and-admin-control-6-panel-8-badge-4 */
/* Shared client/admin foundations. Palette follows AGENTS.md and DESIGN.md.
   Portal hosts receive data-client-theme from Prototype; native admin dialogs inherit html. */
:root {
  --ui-radius-xs:4px;
  --ui-radius-sm:6px;
  --ui-radius-md:8px;
  --ui-radius-lg:10px;
  --ui-radius-xl:12px;
  --ui-radius-control:var(--ui-radius-md);
  --ui-radius-card:var(--ui-radius-md);
  --ui-radius-panel:var(--ui-radius-lg);
  --ui-radius-overlay:var(--ui-radius-xl);
  --ui-radius-badge:var(--ui-radius-xs);
  --ui-bottom-navigation-height:60px;
  --radius-control:var(--ui-radius-control);
  --radius-panel:var(--ui-radius-panel);
}

/* Admin keeps compact corners at every viewport width. */
:root:has(#app) {
  --ui-radius-xs:4px;
  --ui-radius-sm:6px;
  --ui-radius-md:8px;
  --ui-radius-lg:8px;
  --ui-radius-xl:8px;
  --ui-radius-control:var(--ui-radius-sm);
  --ui-radius-card:var(--ui-radius-lg);
  --ui-radius-panel:var(--ui-radius-lg);
  --ui-radius-overlay:var(--ui-radius-xl);
}

/* Web uses compact semantic corners; mobile retains its existing radius scale. */
@media (min-width:1024px) {
  :root:has(#root) {
    --ui-radius-xs:4px;
    --ui-radius-sm:6px;
    --ui-radius-md:6px;
    --ui-radius-lg:8px;
    --ui-radius-xl:8px;
    --ui-radius-control:var(--ui-radius-sm);
    --ui-radius-card:var(--ui-radius-lg);
    --ui-radius-panel:var(--ui-radius-lg);
    --ui-radius-overlay:var(--ui-radius-xl);
  }
  :root:has(#root) .device-screen[data-client-theme] {
    --ui-radius-xs:4px;
    --ui-radius-sm:6px;
    --ui-radius-md:8px;
    --ui-radius-lg:10px;
    --ui-radius-xl:12px;
    --ui-radius-control:var(--ui-radius-md);
    --ui-radius-card:var(--ui-radius-md);
    --ui-radius-panel:var(--ui-radius-lg);
    --ui-radius-overlay:var(--ui-radius-xl);
  }
}
:root[data-theme="light"],
:root .prototype-shell[data-theme="light"],
:root :is(.browser-app,.device-screen)[data-client-theme="light"],
:root .product-menu[data-theme="light"] {
  color-scheme:light;
  --ui-space-1:4px; --ui-space-2:8px; --ui-space-3:12px; --ui-space-4:16px;
  --ui-space-5:20px; --ui-space-6:24px; --ui-space-8:32px;
  --ui-page-gutter:20px; --ui-control-padding-inline:16px; --ui-select-arrow-inset:16px; --ui-select-end-clearance:44px;
  --ui-touch-target:44px;
  --ui-icon-inline:16px; --ui-icon-action:20px;
  --ui-text-title:18px; --ui-text-section:16px; --ui-text-body:14px; --ui-text-meta:12px;
  --ui-motion-duration:160ms; --ui-motion-easing:cubic-bezier(.22,1,.36,1);
  --ui-layer-sticky:20;
  --gold-gradient:linear-gradient(135deg,#ead6a8 0%,#d3b57c 52%,#b88e52 100%);
  --on-accent:#201b12;
  --overlay-shadow:0 24px 64px rgba(0,0,0,.32);
  --trade-buy-fill:#b42333; --trade-sell-fill:#176b45;
  --paper:#ffffff;
  --surface:#ffffff;
  --surface-soft:#f0f0f0;
  --field-surface:#f0f0f0;
  --surface-elevated:#ffffff;
  --drawer-surface:var(--surface);
  --drawer-option-surface:#ffffff;
  --ink:#262521;
  --muted:#625f59;
  --line:#d8d4cb;
  --gold:#866a3e;
  --gold-dark:#72562f;
  --accent-soft:#f1e9dc;
  --market-up:#b42333;
  --market-down:#176b45;
  --positive:#176b45;
  --positive-soft:#e9f5ee;
  --negative:#a51f2d;
  --negative-soft:#fdf0f1;
  --warning:#745000;
  --warning-soft:#fff6e3;
  --info:#315a86;
  --info-soft:#edf3fa;
  --focus:#72562f;
  --card-shadow:0 2px 8px rgba(31,29,24,.06);
  --page-bg:var(--paper);
  --accent:var(--gold); --accent-strong:var(--gold-dark);
  --web3-accent:var(--gold); --web3-accent-soft:var(--accent-soft);
  --state-success:var(--positive); --state-error:var(--negative);
  --state-warning:var(--warning); --state-info:var(--info);
  --green:var(--market-down); --red:var(--market-up);
  --shadow:var(--card-shadow);
}

/* Shared focus feedback: no rings; keyboard targets use text or surface feedback. */
:root :is(.browser-app,#app,dialog) :is(:focus,:focus-visible,:focus-within,[data-highlighted],.is-focus-visible),
:root :is(.browser-app,#app,dialog) :focus-visible::before,
:root :is(.browser-app,#app,dialog) :focus-visible::after,
:root .shared-filter-option input:focus-visible+.shared-filter-choice {
  outline:none!important;
  outline-offset:0!important;
}
:root :is(.browser-app,#app,dialog) :is(input,textarea,select):focus,
:root .browser-app .core-symbol-editing:focus-within {
  box-shadow:none!important;
}
:root :is(.browser-app,#app,dialog) :is(input,textarea,select):focus:not([aria-invalid="true"]):not(.is-invalid):not(.invalid),
:root .browser-app :is(.access-phone,.access-password,.access-code,.access-captcha,.otc-exercise-limit-control):focus-within:not(:has([aria-invalid="true"])) {
  border-color:var(--line)!important;
}
:root :is(.browser-app,#app,dialog) :is(input,textarea,select):focus-visible,
:root .browser-app :is(.core-symbol-editing,.core-row-field):has(input:focus-visible) {
  background-color:color-mix(in srgb,var(--focus) 10%,var(--field-surface));
}
:root :is(.browser-app,#app,dialog) :is(button,a,summary):focus-visible {
  text-decoration:none;
  background-color:color-mix(in srgb,var(--focus) 10%,var(--field-surface));
}
:root[data-theme="dark"],
:root .prototype-shell[data-theme="dark"],
:root :is(.browser-app,.device-screen)[data-client-theme="dark"],
:root .product-menu[data-theme="dark"] {
  color-scheme:dark;
  --ui-space-1:4px; --ui-space-2:8px; --ui-space-3:12px; --ui-space-4:16px;
  --ui-space-5:20px; --ui-space-6:24px; --ui-space-8:32px;
  --ui-page-gutter:20px; --ui-control-padding-inline:16px; --ui-select-arrow-inset:16px; --ui-select-end-clearance:44px;
  --ui-touch-target:44px;
  --ui-icon-inline:16px; --ui-icon-action:20px;
  --ui-text-title:18px; --ui-text-section:16px; --ui-text-body:14px; --ui-text-meta:12px;
  --ui-motion-duration:160ms; --ui-motion-easing:cubic-bezier(.22,1,.36,1);
  --ui-layer-sticky:20;
  --gold-gradient:linear-gradient(135deg,#ead6a8 0%,#d3b57c 52%,#b88e52 100%);
  --on-accent:#201b12;
  --overlay-shadow:0 24px 64px rgba(0,0,0,.32);
  --trade-buy-fill:#b42333; --trade-sell-fill:#176b45;
  --paper:#101113;
  --surface:#191a1c;
  --surface-soft:#202123;
  --field-surface:#202123;
  --surface-elevated:#29292a;
  --drawer-surface:var(--surface);
  --drawer-option-surface:#202123;
  --ink:#f5f2ec;
  --muted:#b8b3a9;
  --line:#3d3b37;
  --gold:#d6b782;
  --gold-dark:#e8cca0;
  --accent-soft:#383025;
  --market-up:#ff858d;
  --market-down:#55c7a4;
  --positive:#49b99a;
  --positive-soft:#19352f;
  --negative:#e87575;
  --negative-soft:#3a2528;
  --warning:#e1b66f;
  --warning-soft:#382f22;
  --info:#9ab7d4;
  --info-soft:#24303b;
  --focus:#e8cca0;
  --card-shadow:0 2px 8px rgba(0,0,0,.22);
  --page-bg:var(--paper);
  --accent:var(--gold); --accent-strong:var(--gold-dark);
  --web3-accent:var(--gold); --web3-accent-soft:var(--accent-soft);
  --state-success:var(--positive); --state-error:var(--negative);
  --state-warning:var(--warning); --state-info:var(--info);
  --green:var(--market-down); --red:var(--market-up);
  --shadow:var(--card-shadow);
}
