/* Plasma shared visual contract. Run node scripts/sync-design.cjs after editing. */
:root {
  color-scheme: dark;
  --ui-font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bg: #0c0913;
  --bg2: #110c1c;
  --panel: #171020;
  --surface-rim: rgba(210, 177, 240, .13);
  --surface-light: rgba(255, 236, 255, .055);
  --panel2: #21172f;
  --text: #f0f1f7;
  --txt: var(--text);
  --muted: #adb3c8;
  --dim: #959db5;
  --line: #362442;
  --line2: #806491;
  --violet: #c0a1ff;
  --pink: #ff92d5;
  --cyan: #85d9dc;
  --green: #82dfb3;
  --red: #ff9cae;
  --amber: #efce91;
  --accent-fill: #9843c7;
  --accent-gradient: linear-gradient(125deg, #bb328d, #7844d7);
  --message-public: linear-gradient(125deg, #a52b79, #922b6c);
  --message-private: linear-gradient(125deg, #593aab, #6941b6);
  --message-private-incoming: linear-gradient(135deg, rgba(166, 105, 255, .22), rgba(215, 87, 186, .08));
  --accent-soft: #301a40;
  --private-fill: #382047;
  --glass-base: #191222;
  --glass-tint: rgba(32, 25, 43, .14);
  --glass-sheen: linear-gradient(135deg, rgba(244,225,255,.07), rgba(183,159,214,.015) 48%, rgba(215,192,240,.04));
  --glass-blur: 8px;
  --dock-glass-tint: rgba(32, 25, 43, .04);
  --dock-glass-sheen: linear-gradient(135deg, rgba(244,225,255,.04), rgba(183,159,214,.008) 48%, rgba(215,192,240,.02));
  --dock-glass-selected: linear-gradient(140deg, #ecdcff1a, #d4b4f70a 55%, #e1c4ff14);
  --glass-rim: rgba(242, 220, 255, .22);
  --glass-highlight: rgba(239, 217, 255, .13);
  --glass-selected: linear-gradient(145deg, rgba(213, 176, 255, .25), rgba(162, 93, 203, .19) 48%, rgba(106, 66, 150, .22));
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 24px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --glow: 0 12px 32px #00000020;
  --motion-fast: 140ms;
}

/* One shared language control for web, Mini App and extension. */
.plasma-language {
  display: inline-flex; flex: 0 0 auto; gap: 3px; padding: 4px;
  border: 1px solid var(--glass-rim); border-radius: 20px;
  background: linear-gradient(130deg, #d77daf12, #9e7ac909), var(--bg);
  box-shadow: inset 0 1px #ffe5f70c;
}
.plasma-language > button {
  appearance: none; -webkit-appearance: none; min-width: 77px; min-height: 44px;
  margin: 0; padding: 9px 11px; border: 1px solid transparent; border-radius: 15px;
  background: transparent; color: var(--muted); font: 500 13px/1.2 var(--ui-font);
  cursor: pointer; white-space: nowrap;
  transition: background-color var(--motion-fast), color var(--motion-fast), box-shadow var(--motion-fast);
}
.plasma-language > button[aria-pressed="true"] {
  background: var(--glass-selected); color: #fff0fc; border-color: #f0c5e83d;
  box-shadow: inset 0 1px #fff0ff25, 0 3px 9px #0002;
}
.plasma-language > button:focus-visible { outline: 2px solid #e8b6f4; outline-offset: 2px; }
@media (hover: hover) { .plasma-language > button:hover { color: #fff0fc; background-color: #d8a1e214; } }
@media (prefers-reduced-motion: reduce) { .plasma-language > button { transition: none; } }

/* Shared support entry: web, Mini App, PWA and Bridge side panel. */
.plasma-support { margin: 16px 0 0; }
.settings-preferences > .plasma-support { margin: 0 15px; min-width: 0; }
.plasma-support-link { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 14px 16px; border: 1px solid var(--glass-rim); border-radius: var(--radius-md); background: var(--glass-sheen), linear-gradient(120deg, #cf87b812, #ad8bdd0c); box-shadow: inset 0 1px #ffffff14; color: var(--text); text-decoration: none; transition: background-color var(--motion-fast), border-color var(--motion-fast); }
.shell > .plasma-support .plasma-support-link { min-height: 60px; padding: 12px 14px; }
.plasma-support-link svg { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.plasma-support-icon { width: 22px; height: 22px; color: #ddb3e9; }
.plasma-support-copy { flex: 1; min-width: 0; }
.plasma-support-copy strong { display: block; font: 500 14px/1.5 var(--ui-font); }
.plasma-support-copy > span { display: block; margin-top: 2px; color: var(--muted); font: 400 12px/1.5 var(--ui-font); }
.plasma-support-arrow { width: 18px; height: 18px; color: var(--muted); }
.plasma-support-credit { margin: 10px 0 0; color: var(--muted); text-align: center; font: 500 11px/1.6 var(--ui-font); letter-spacing: .025em; }
.plasma-support-credit span { font-weight: 400; }
.plasma-support-link:focus-visible { outline: 2px solid #e8b6f4; outline-offset: 3px; }
.plasma-support-link:active { background-color: #c0a1ff18; }
@media (hover: hover) { .plasma-support-link:hover { border-color: #d7aeff66; background-color: #c0a1ff0c; } }
@media (prefers-reduced-motion: reduce) { .plasma-support-link { transition: none; } }

/* Shared native-language sheet: touch targets, keyboard, reduced transparency. */
.plasma-language{padding:0;border-radius:18px;max-width:100%}
.plasma-language>.language-trigger{display:flex;align-items:center;gap:9px;min-width:0;min-height:44px;color:var(--text);padding:10px 13px}
.language-current{font-size:12px}.language-trigger svg{color:var(--pink);flex-shrink:0}
.plasma-language-dialog{box-sizing:border-box;width:min(400px,calc(100vw - 28px));max-height:calc(100dvh - 32px);overflow:auto;padding:20px;border:1px solid var(--glass-rim);border-radius:30px;background:linear-gradient(145deg,#46304b66,#16101deb),#171020;color:var(--text);box-shadow:inset 0 1px #ffffff22,0 24px 90px #0008;font-family:var(--ui-font)}
.plasma-language-dialog::backdrop{background:#08050da6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.plasma-language-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.language-eyebrow{font-size:9px;letter-spacing:.2em;color:var(--pink)}
.plasma-language-dialog h2{font-size:20px;font-weight:600;margin:5px 0 0;letter-spacing:-.025em}
.language-close{width:44px;height:44px;border:1px solid var(--glass-rim);border-radius:50%;background:#ffffff08;color:var(--text);font:300 26px var(--ui-font);cursor:pointer;flex-shrink:0}
.language-options{display:grid;gap:6px}.language-options>button{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:9px 13px;border:1px solid transparent;border-radius:17px;background:transparent;color:var(--text);font:500 14px var(--ui-font);text-align:left;cursor:pointer;transition:background .15s,border-color .15s}
.language-code{width:34px;flex-shrink:0;font-size:10px;letter-spacing:.04em;color:var(--muted)}.language-check{margin-left:auto;color:var(--pink);visibility:hidden}.language-options>[aria-pressed=true]{background:var(--glass-selected);border-color:#e7c5ee44;box-shadow:inset 0 1px #fff2}.language-options>[aria-pressed=true] .language-check{visibility:visible}
.language-options>button:focus-visible,.language-close:focus-visible{outline:2px solid var(--pink);outline-offset:2px}
@media(hover:hover){.language-options>button:hover{background-color:#d8a1e214}}
@media(prefers-reduced-motion:reduce){.language-options>button{transition:none}}
@media(prefers-reduced-transparency:reduce){.plasma-language-dialog{background:#21172f}.plasma-language-dialog::backdrop{backdrop-filter:none;-webkit-backdrop-filter:none}}