/* Black Diamond: purpose-built obsidian surfaces and generated faceted icons. */
:root[data-theme="graphite"] { --bg-soft:#090c12; --bg-strong:#111620; --surface:#151b25; --surface-strong:#1e2735; --text:#f1f5fc; --muted:#a5b3c7; --primary:#b6d9f2; --primary-soft:#80c5f014; --border:#9bbdd229; --border-strong:#a9c5de66; --clx-ink:#e8f4ff; --clx-edge:#718aa740; --shadow:0 15px 36px #0005; --success:#69dfb0; --danger:#ff819c; --success-strong:#69dfb0; --primary-strong:#d7ecfa; --ring:0 0 0 3px #b6d9f259; }
[data-theme="graphite"] .app-body, [data-theme="graphite"] .auth-body { background:radial-gradient(ellipse at 15% 0,#23324680,transparent 60%),#090c12; }
[data-theme="graphite"] :is(.app-header,.card,.auth-card,.modal-card,.invitation-dialog) { color:var(--text); background:linear-gradient(140deg,#2732414d,transparent 40%),linear-gradient(165deg,#171e29,#0f141d); border:1px solid #859fb333; box-shadow:inset 0 1px 0 #deefff12,0 12px 34px #0004; border-radius:22px; }
[data-theme="graphite"] :is(.section-title,.profile-name,.identity-name,.identity-number,.history-name,.about-copy,.field-group,.auth-copy h1) { color:var(--text); }
[data-theme="graphite"] :is(.section-note,.history-meta,.field-paren,.auth-copy p,.settings-copy span,.call-secondary) { color:var(--muted); }
[data-theme="graphite"] :is(.field-group input,.field-group textarea,.surface-select,.history-search) { background:#0b1018; color:#eaf3ff; border-color:#768aab42; box-shadow:inset 0 2px 6px #0005; }
[data-theme="graphite"] :is(.field-group input,.field-group textarea)::placeholder { color:#7f8ea5; }
[data-theme="graphite"] :is(.about-row,.settings-row,.history-item,.permission-card,.compact-status-card) { background:linear-gradient(140deg,#1b2431,#121925); color:var(--text); border-color:#8ca9c52b; box-shadow:inset 0 1px 0 #d5eaff08; }
[data-theme="graphite"] :is(.copy-chip,.icon-pill,.icon-button,.nav-item,.history-action,.soft-button,.settings-toggle,.auth-tab,.share-format button) { background:linear-gradient(145deg,#2a3546,#151d29 70%); color:#d9eaff; border:1px solid #93aac54a; box-shadow:inset 0 1px 0 #e0f3ff1c,0 3px 0 #050a11,0 5px 12px #0003; }
[data-theme="graphite"] :is(.copy-chip,.icon-button,.history-action) { border-radius:13px; }
[data-theme="graphite"] .bottom-nav { gap:8px; padding-top:8px; }
[data-theme="graphite"] .nav-item { border-radius:18px; }
[data-theme="graphite"] :is(.nav-item.active,.auth-tab.active,.settings-toggle.is-on,.share-format button[aria-pressed="true"],.header-info[aria-pressed="true"]) { background:linear-gradient(135deg,#31465d,#192b3d); border-color:#b5dcf4a6; box-shadow:inset 0 1px 0 #fff4,0 3px 0 #050b13,0 0 18px #56b8f014; }
[data-theme="graphite"] .dial-key { border:1px solid #9eb5d047; border-radius:18px; background:linear-gradient(155deg,#303d50,#121c29 75%); box-shadow:inset 0 1px 0 #e6f5ff29,inset 0 -1px 0 #0008,0 4px 0 #060b12,0 8px 16px #0003; }
[data-theme="graphite"] .dial-key:active { transform:translateY(2px); box-shadow:inset 0 1px 5px #0005; }
[data-theme="graphite"] .dial-digit { color:#e7f4ff; text-shadow:0 1px 0 #fff3; }
[data-theme="graphite"] .dial-letters { color:#aec4dc; letter-spacing:.16em; }
[data-theme="graphite"] .dial-key-mark { color:#b1c5dc; }
[data-theme="graphite"] :is(.primary-button,.dial-call-button) { background:linear-gradient(140deg,#224e45,#102f2b); color:#dcfff1; border-color:#75d4b36b; box-shadow:inset 0 1px 0 #bfffe32b,0 4px 0 #051c16,0 10px 22px #0003; }
[data-theme="graphite"] :is(.status-badge,.mini-badge,.history-chip) { background:#152a30; color:#bae6de; border-color:#81a8ac33; }
[data-theme="graphite"] .theme-options button { background:#111923; border-color:#839baf44; }
[data-theme="graphite"] .theme-options button[aria-pressed="true"] { background:#203247; outline-color:#acd2ec; }
[data-theme="graphite"] .swatch-graphite { background:linear-gradient(140deg,#3d536a,#0c121c); }
[data-theme="graphite"] .logo-shell { background:linear-gradient(140deg,#233c54,#101922); border-color:#7eaccc33; box-shadow:inset 0 1px 0 #dbf0ff18; }
[data-theme="graphite"] .history-item.is-unread { background:linear-gradient(120deg,#23394f,#182635); border-color:#8ec4e187; }
[data-theme="graphite"] .history-unread { background:#b1dbf4; color:#10263b; }
[data-theme="graphite"] :is(.danger-soft,.history-action-danger) { color:#ffb4c5; background:linear-gradient(140deg,#492638,#291421); border-color:#ec81974d; }
[data-theme="graphite"] :is(.toast,.debug-report-panel) { background:#1c2839; color:#e7f3ff; border-color:#7998b352; }
[data-theme="graphite"] :is(.modal-scrim,.invitation-dialog::backdrop) { background:#03070dd9; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
/* A pseudo-element cannot sit inside :is(), so the dialog backdrop needs its own rule (U-18). */
[data-theme="graphite"] .invitation-dialog::backdrop { background:#03070dd9; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
[data-theme="graphite"] .share-format { background:#0a111b; border-color:#6c8aa533; }
[data-theme="graphite"] .call-surface { background:radial-gradient(ellipse at 100% 0,#233347bb,transparent 65%),linear-gradient(165deg,#111c2a,#090f18); border-color:#90b1cf33; }
[data-theme="graphite"] .call-command-bar .video-dock button { background:linear-gradient(140deg,#33475d,#162436 75%); border-color:#9bbbd655; box-shadow:inset 0 1px 0 #e6f5ff29,0 3px 0 #020b15; }
[data-theme="graphite"] .call-settings-panel .call-quality-main { background:linear-gradient(160deg,#203247,#101c2b); border:1px solid #8eb9d552; box-shadow:inset 0 1px 0 #e6f5ff14; }
[data-theme="graphite"] #qualityAutoBtn { background:#111d2d; border-color:#7296b755; color:#aabed4; border-radius:9px; }
[data-theme="graphite"] #qualityAutoBtn.is-active { background:#b7dff2; color:#12283e; border-color:#def5ff; }
[data-theme="graphite"] #qualitySlider { accent-color:#c8e9ff; }
[data-theme="graphite"] .quality-title { color:#d6eaff; }
[data-theme="graphite"] .call-settings-panel { background:#111e2ef2; border-color:#8babca66; box-shadow:0 10px 40px #0008; }
[data-theme="graphite"] .call-command-bar .video-dock #activeCallActionBtn { background:linear-gradient(140deg,#80364a,#40182a); border-color:#fb94ae91; box-shadow:inset 0 1px 0 #ffcfda33,0 4px 0 #200914; }
[data-theme="graphite"] .video-dock :is(#muteMicBtn.active,#muteRemoteBtn.active) { background:#672e3d; border-color:#ff99b0; }
[data-theme="graphite"] .video-dock #screenShareBtn.is-active { background:#205649; border-color:#7ee1bf; }
[data-theme="graphite"] .call-return-bar { background:#162f38; border-color:#70baa16b; color:#d9fff0; }
[data-theme="graphite"] .call-avatar, [data-theme="graphite"] .profile-avatar { background-color:#273d53; color:#dcf0ff; border-color:#a9d9f277; box-shadow:0 0 0 5px #88b9e00c,0 12px 30px #0005; }
[data-theme="graphite"] .video-stage { background:#05090f; border-color:#709bb44d; }
[data-theme="graphite"] :is(.video-stage-fs,.video-pip-chip) { background:#172638e8; border-color:#accce077; box-shadow:inset 0 1px 0 #d0eaff1a; }
[data-theme="graphite"] :focus-visible { outline:2px solid #c0e5ff; outline-offset:3px; }

[data-theme="graphite"] .dial-digit[data-clx-icon] { --clx-icon-size:clamp(24px,60cqmin,52px); }