/* Frontend presentation and browser-local appearance preferences. */
:root {
  color-scheme: dark;
  --bg:#111416; --sidebar:#15191b; --panel:#1b2023; --panel-raised:#23292d;
  --field:#14191c; --line:#30383d; --line-strong:#48545c; --text:#f0f4f3;
  --muted:#a1acb2; --subtle:#859198; --mint:#c0f5c7; --mint-ink:#16281b;
  --mint-soft:#c0f5c712; --orange:#ffbf9c; --danger-bg:#ffbf9c0c;
  --shadow:0 12px 28px #00000012; --radius:16px; --sidebar-width:240px;
  --page-gutter:clamp(24px,3.2vw,48px); --duration:180ms;
}
html[data-theme="light"] {
  color-scheme:light;
  --bg:#f4f6f3; --sidebar:#ffffff; --panel:#ffffff; --panel-raised:#f2f5f1;
  --field:#f7f9f6; --line:#dde3dc; --line-strong:#a6b4a8; --text:#202c25;
  --muted:#56665c; --subtle:#607266; --mint:#2d6f40; --mint-ink:#ffffff;
  --mint-soft:#2d6f400c; --orange:#9c3d18; --danger-bg:#9c3d1808;
  --shadow:0 12px 28px #1d352909;
}
*{box-sizing:border-box}
html{min-width:0;scroll-behavior:smooth;scrollbar-gutter:stable}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
body.nav-open{overflow:hidden}
button,input,select,textarea{font:inherit}
button{cursor:pointer}button,a{touch-action:manipulation}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button:disabled{opacity:.48;cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--mint);outline-offset:4px}
::selection{background:var(--mint);color:var(--mint-ink)}
a{color:var(--mint);text-underline-offset:4px}
svg{vertical-align:middle;flex-shrink:0}img{max-width:100%}
button svg,.ui-icon,.nav-icon{width:20px;height:20px;flex-shrink:0}
h1,h2,h3,p{overflow-wrap:anywhere}
h1{margin:0 0 10px;font-size:clamp(27px,2.7vw,36px);line-height:1.2;letter-spacing:-.045em;font-weight:650}
h2{margin:0;font-size:16px;line-height:1.4;letter-spacing:-.02em;font-weight:600}
h3{margin:0;font-size:16px;line-height:1.4;letter-spacing:-.02em;font-weight:600}
p{color:var(--muted);margin:0;line-height:1.7}small{font-size:12px}
code,pre,textarea[spellcheck="false"]{font-family:"Cascadia Code","SFMono-Regular",Consolas,monospace}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:-100px;z-index:100;padding:12px 18px;border-radius:10px;color:var(--mint-ink);background:var(--mint);text-decoration:none;font-weight:650}
.skip-link:focus{top:16px}

/* Workspace shell */
#sidebar{width:var(--sidebar-width);position:fixed;inset:0 auto 0 0;z-index:40;display:flex;flex-direction:column;padding:24px 18px 16px;background:var(--sidebar);border-right:1px solid var(--line);overflow-y:auto}
.brand{display:flex;align-items:center;gap:10px;margin:0 12px;color:var(--text);font-size:22px;font-weight:700;letter-spacing:-.055em;text-decoration:none}
.brand img{width:29px;height:29px}.brand-period{color:var(--mint);margin-left:-9px}
.tag{margin:9px 12px 18px;color:var(--subtle);font-size:9px;font-weight:600;letter-spacing:.13em}
.nav-label,.nav-group-label{margin:14px 14px 7px;color:var(--subtle);font-size:10px;font-weight:600;letter-spacing:.13em;text-transform:uppercase}
nav{display:flex;flex-direction:column;gap:3px}
nav :is(button, .nav-link){position:relative;width:100%;min-height:44px;display:flex;align-items:center;gap:12px;padding:10px 14px;margin:0;background:transparent;border:1px solid transparent;border-radius:10px;color:var(--muted);text-align:left;font-size:13px;font-weight:500;transition:background var(--duration),color var(--duration),border-color var(--duration)}
nav :is(button, .nav-link):hover{background:var(--panel-raised);color:var(--text)}
nav :is(button, .nav-link).active,nav :is(button, .nav-link)[aria-current="page"]{background:var(--mint-soft);color:var(--mint)}
nav :is(button, .nav-link).active::after{content:"";position:absolute;top:15px;bottom:15px;right:12px;width:3px;border-radius:4px;background:var(--mint)}
nav :is(button, .nav-link) svg{opacity:.8;width:18px;height:18px}nav :is(button, .nav-link).active svg{opacity:1}
.workspace-card{display:flex;align-items:center;gap:10px;margin:0 4px 5px;padding:13px 12px;background:var(--panel);border:1px solid var(--line);border-radius:10px}
.workspace-icon{display:grid;place-items:center;width:31px;height:31px;flex-shrink:0;border:1px solid var(--line-strong);border-radius:8px;background:var(--field);color:var(--mint);font-size:12px;font-weight:650}
.workspace-card strong{display:block;font-size:10px;font-weight:600}
.workspace-card div>span{display:block;color:var(--subtle);font-size:9px;margin-top:3px}
.workspace-chevron{margin-left:auto;color:var(--subtle);font-size:16px}
.sidebottom{margin:auto 0 0;padding-top:16px;color:var(--muted);font-size:11px;line-height:1.8}
.workspace-status{display:flex;align-items:center;padding:0 12px 12px;color:var(--subtle);font-size:10px}
#side-status{font-size:10px;color:var(--muted)}
.workspace-status[data-state="offline"] .live-dot{background:var(--subtle);box-shadow:none}
.side-profile{display:flex;align-items:center;gap:10px;flex-shrink:0;width:100%;min-height:64px;padding:12px;border:0;border-top:1px solid var(--line);background:transparent;border-radius:0 0 10px 10px;color:var(--text);text-align:left}
.side-profile:hover{background:var(--panel)}
.side-profile>span:last-child{margin-left:auto;color:var(--subtle);font-size:15px}
.avatar{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;color:var(--mint);background:var(--mint-soft);border:1px solid var(--line);border-radius:50%;font-size:11px;font-weight:650}
.profile-meta{min-width:0}.profile-meta strong{display:block;font-size:11px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profile-meta small{display:block;margin-top:2px;color:var(--subtle);font-size:10px}
.version-label{display:block;padding:10px 12px 0;color:var(--subtle);font-size:9px}
main{margin-left:var(--sidebar-width);padding:0 var(--page-gutter) 28px;min-width:0;max-width:1840px}
main>header{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}
.header-start{display:flex;align-items:center;gap:12px;min-width:0}
.crumb{display:flex;align-items:center;gap:10px;color:var(--subtle);font-size:12px}
.crumb b{color:var(--text);font-weight:500}.crumb>span{color:var(--line-strong)}
.right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#menu-toggle,.nav-close{display:none}
#nav-scrim{position:fixed;inset:0;z-index:35;border:0;background:#0009;backdrop-filter:blur(3px)}

/* Shared controls and page headings */
.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:10px 16px;border:1px solid var(--line-strong);border-radius:9px;background:transparent;color:var(--text);font-size:12px;font-weight:550;line-height:1.5;text-decoration:none;transition:background var(--duration),border-color var(--duration),transform var(--duration)}
.btn:hover:not(:disabled){background:var(--panel-raised);border-color:var(--muted)}
.btn:active:not(:disabled){transform:translateY(1px)}
.btn.primary{background:var(--mint);border-color:var(--mint);color:var(--mint-ink);font-weight:650}
.btn.primary:hover:not(:disabled){filter:brightness(.93);background:var(--mint);border-color:var(--mint)}
.btn.danger{color:var(--orange);border-color:var(--line-strong);background:var(--danger-bg)}
.btn.danger:hover:not(:disabled){border-color:var(--orange)}
.iconbtn{width:40px;height:40px;flex-shrink:0;display:inline-grid;place-items:center;background:transparent;border:1px solid transparent;border-radius:9px;color:var(--muted);font-size:25px;line-height:1}
.nav-close{display:none}
.iconbtn:hover{color:var(--text);background:var(--panel-raised);border-color:var(--line)}
.intro{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:36px 0 28px}
.intro>div:first-child{min-width:0}.intro p{max-width:620px;font-size:13px}
.eyebrow,.section-kicker{display:block;color:var(--subtle);font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.intro>.actions{flex-shrink:0}
.link{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:4px 0;border:0;background:transparent;color:var(--mint);font-size:12px;text-decoration:none}
.link:hover{text-decoration:underline;text-underline-offset:4px}
.badge{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:4px 8px;border:1px solid #c0f5c71f;border-radius:6px;background:var(--mint-soft);color:var(--mint);font-size:9px;font-weight:600;letter-spacing:.06em;line-height:1.4;white-space:nowrap}
.badge.gray{color:var(--muted);border-color:var(--line);background:var(--panel-raised)}
.badge.error{color:var(--orange);border-color:#ffbf9c33;background:var(--danger-bg)}
.live-dot{display:inline-block;width:6px;height:6px;flex-shrink:0;margin-right:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 3px var(--mint-soft)}

/* Dashboard and existing application surfaces */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}
.stat,.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.stat{min-width:0;min-height:160px;padding:22px 24px;box-shadow:var(--shadow);transition:border-color var(--duration)}
.stat:hover{border-color:var(--line-strong)}
.stat>span{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}
.stat-icon{display:grid;place-items:center;width:22px;height:22px;flex-shrink:0;border-radius:6px;background:var(--mint-soft);color:var(--mint);font-size:16px}
.stat strong{display:block;margin:15px 0 8px;color:var(--text);font-size:34px;font-weight:550;line-height:1.1;letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.stat small{color:var(--subtle);font-size:11px}
.grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:20px}
.panel{min-width:0;overflow:hidden;box-shadow:var(--shadow)}
.panelhead{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:76px;padding:22px 24px;border-bottom:1px solid var(--line)}
.panelhead h2{font-size:14px}
.surface{min-height:320px;padding:24px;background:radial-gradient(ellipse at 50% 45%,var(--mint-soft),transparent 70%)}
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:280px;padding:40px 24px;gap:13px;text-align:center}
.empty .symbol{display:grid;place-items:center;width:56px;height:56px;margin-bottom:3px;border:1px solid var(--line);border-radius:16px;background:var(--mint-soft);color:var(--mint);font-size:27px;line-height:1}
.empty .symbol svg{width:26px;height:26px}.empty h2{font-size:16px}.empty p{max-width:390px;font-size:12px}
.empty .actions{justify-content:center;margin-top:7px}.empty>.btn{margin-top:7px}
.nodes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.node{min-width:0;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--field)}
.node strong{display:block;font-size:13px;margin:16px 0 7px;overflow-wrap:anywhere}.node p{font-size:11px}
.feed{max-height:355px;overflow-y:auto;padding:3px 24px;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
.feed .empty{min-height:296px;padding-inline:12px}
.event{display:flex;align-items:flex-start;gap:12px;padding:19px 0;border-bottom:1px solid var(--line)}
.event:last-child{border-bottom:0}
.event-icon{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border:1px solid var(--line);border-radius:10px;background:var(--mint-soft);color:var(--mint)}
.event>div:last-child{min-width:0}.event strong{font-size:12px;font-weight:550;overflow-wrap:anywhere}
.event p{font-size:11px;margin-top:4px}.event time{display:block;margin-top:7px;color:var(--subtle);font-size:10px}
.activity-feed{max-height:600px}
.section{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:30px 0 18px}
.section h2{font-size:18px;letter-spacing:-.025em}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.card{min-width:0;display:flex;flex-direction:column;padding:24px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow:hidden;box-shadow:var(--shadow);transition:border-color var(--duration),transform var(--duration)}
.card:hover{border-color:var(--line-strong);transform:translateY(-2px)}
.cardtop{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.card h3{margin:22px 0 10px}.card p{font-size:12px}
.card code{display:block;padding:12px;margin:18px 0 0;border:1px solid var(--line);border-radius:8px;background:var(--field);color:var(--muted);font-size:11px;line-height:1.7;overflow-wrap:anywhere}
.cardbottom{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:22px}
.cardbottom .btn{min-height:36px;padding:7px 11px;font-size:11px}
.tablewrap{overflow-x:auto;scrollbar-width:thin}table{width:100%;border-collapse:collapse;text-align:left;font-size:12px}
th{padding:17px 24px;border-bottom:1px solid var(--line);color:var(--subtle);font-size:10px;font-weight:550;letter-spacing:.08em;white-space:nowrap}
td{padding:20px 24px;border-bottom:1px solid var(--line);vertical-align:top}tbody tr:last-child td{border-bottom:0}
tbody tr{transition:background var(--duration)}tbody tr:hover{background:var(--panel-raised)}
td small{display:block;margin-top:7px;color:var(--subtle);font-size:11px}
.filter{width:260px;min-height:40px}.note{margin:16px 0;color:var(--subtle);font-size:11px;line-height:1.8}
footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:24px;margin-top:28px;border-top:1px solid var(--line);color:var(--subtle);font-size:10px}
.notice{display:flex;align-items:center;gap:10px;padding:14px 18px;margin-top:20px;border:1px solid #bca46d40;border-radius:10px;background:#bca46d0b;color:#d8c99e;font-size:12px;line-height:1.6}
html[data-theme="light"] .notice{color:#716027}

/* Useful workspace entry points */
.welcome-banner{position:relative;display:flex;align-items:center;justify-content:space-between;gap:30px;padding:28px 30px;margin-bottom:24px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(110deg,var(--panel),var(--mint-soft));overflow:hidden}
.welcome-banner h2{margin-bottom:9px;font-size:22px;font-weight:550;letter-spacing:-.035em}
.welcome-banner p{max-width:540px;font-size:12px}.welcome-banner .actions{margin-top:20px}
.welcome-copy{position:relative;z-index:1;min-width:0}
.welcome-mark{display:grid;place-items:center;width:210px;height:210px;flex-shrink:0;color:var(--mint)}
.welcome-mark svg{width:210px;height:210px}
.welcome-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.welcome-summary .mini-stat{min-width:0;padding:22px 24px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.welcome-summary .mini-stat>span{font-size:9px;letter-spacing:.1em}
.welcome-summary .mini-stat strong{margin:12px 0 8px;font-size:17px;font-weight:550;letter-spacing:-.025em}
.welcome-summary .mini-stat small{display:block;font-size:10px;line-height:1.7}
.workspace-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}
.workspace-link-icon{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border:1px solid var(--line);border-radius:10px;background:var(--mint-soft);color:var(--mint)}
.workspace-link-icon svg{width:19px;height:19px}
.workspace-links>button,.workspace-links>a{display:flex;align-items:center;gap:14px;min-width:0;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);text-align:left;text-decoration:none;transition:border-color var(--duration),background var(--duration)}
.workspace-links>button:hover,.workspace-links>a:hover{border-color:var(--line-strong);background:var(--panel-raised)}
.workspace-links strong{display:block;font-size:13px;font-weight:550}.workspace-links small{display:block;color:var(--muted);font-size:11px;line-height:1.6;margin-top:4px}
.workspace-links>button>svg,.workspace-links>a>svg{color:var(--mint);width:22px;height:22px}
.workspace-links>button>svg:last-child,.workspace-links>a>svg:last-child{width:16px;height:16px;margin-left:auto;color:var(--subtle)}
.progress-track{height:6px;width:100%;overflow:hidden;border-radius:20px;background:var(--line)}
.progress-track>span{display:block;height:100%;border-radius:inherit;background:var(--mint)}
.mini-stat{padding:18px 0;border-bottom:1px solid var(--line)}.mini-stat:last-child{border-bottom:0}
.mini-stat strong{display:block;margin-top:6px;font-size:24px;font-weight:550}.mini-stat span,.mini-stat small{color:var(--muted);font-size:11px}

/* Profile and browser preferences */
.profile-grid{display:grid;grid-template-columns:minmax(260px,.85fr) minmax(0,1.6fr);gap:22px;align-items:start}
.profile-card{min-width:0;padding:30px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius)}
.profile-card h2{font-size:19px;margin:0 0 8px}.profile-card h3{font-size:14px;margin-bottom:12px}.profile-card p{font-size:12px}
.profile-card .badge{margin:12px 0 0}
.profile-card>.btn{margin-top:20px}
.profile-identity>.badge{margin:0 0 20px}
.profile-identity h2{font-size:22px;letter-spacing:-.035em}
.profile-tip{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
.profile-tip .btn{margin-top:18px}
.profile-details{display:grid;gap:22px}
.profile-card .panelhead{min-height:0;margin:-4px 0 0;padding:0 0 18px;align-items:flex-start}
.profile-card .panelhead h2{font-size:17px;margin:0}
.profile-card .panelhead .section-kicker{margin-bottom:7px}
.profile-card .panelhead .ui-icon{color:var(--subtle);margin-top:15px}
.wallet-list{list-style:none;padding:0;margin:22px 0 0}
.wallet-list li{padding:16px;border:1px solid var(--line);border-radius:10px;background:var(--field)}
.wallet-list li+li{margin-top:12px}
.wallet-kind{display:block;margin-bottom:7px;font-size:11px;font-weight:600;color:var(--muted)}
.wallet-list code{font-size:11px;color:var(--text);overflow-wrap:anywhere}
.wallet-empty{padding-top:22px}.wallet-empty .note{display:block;margin:8px 0 0}
.profile-avatar{width:76px;height:76px;display:grid;place-items:center;margin-bottom:22px;border:1px solid #c0f5c72b;border-radius:22px;background:var(--mint-soft);color:var(--mint);font-size:27px;letter-spacing:-.03em;font-weight:550}
.profile-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:24px}.profile-card .actions{margin-top:24px}
.detail-list{margin:22px 0 0}.detail-list>div{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:16px 0;border-top:1px solid var(--line)}
.detail-list dt{color:var(--muted);font-size:12px}.detail-list dd{margin:0;text-align:right;color:var(--text);font-size:12px;overflow-wrap:anywhere;max-width:65%}
.detail-list dd code{color:var(--muted);font-size:11px}.accountbox{padding:28px}.accountbox p{margin:16px 0;font-size:12px}
.settings-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(250px,.8fr);gap:22px;align-items:start}
.settings-panel{min-width:0;padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.settings-panel+.settings-panel{margin-top:20px}.settings-panel>h2{margin-bottom:6px}.settings-panel>p{font-size:12px}
.settings-layout>.settings-panel+.settings-panel{margin-top:0}
.settings-row{display:block;padding:24px 0;margin:0;border:0;border-bottom:1px solid var(--line);min-width:0}
.settings-row:last-child{border-bottom:0;padding-bottom:0}
.settings-copy{min-width:0}.settings-copy h3,.settings-row h3,.settings-row legend{margin:0 0 5px;padding:0;color:var(--text);font-size:13px;font-weight:550}
.settings-row legend{float:left;width:100%;margin-bottom:6px}
.settings-copy{clear:both}
.settings-heading{padding-bottom:6px}
.settings-heading p{font-size:12px;margin-top:8px}
.settings-aside{position:static;display:block;width:auto;inset:auto;padding:26px;transform:none;overflow:visible}
.settings-aside .preference-summary{padding:18px;margin:22px 0;background:var(--field);border-radius:10px}
.settings-aside .preference-summary>span{display:block;font-size:9px;letter-spacing:.09em;color:var(--subtle)}
.settings-aside .preference-summary>strong{display:block;font-size:12px;font-weight:500;line-height:1.7;margin-top:10px}
.settings-aside .note{font-size:11px;margin-top:0}
.settings-row p{max-width:340px;font-size:11px}.settings-row fieldset{min-width:0;margin:0;padding:0;border:0}
.settings-controls{flex-shrink:0}.settings-row>label{margin:0}.settings-row>select{width:160px;flex-shrink:0}
.segmented{display:flex;flex-shrink:0;width:100%;gap:3px;padding:4px;margin-top:16px;border:1px solid var(--line);border-radius:9px;background:var(--field)}
.segmented button,.segmented label{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding:7px 12px;margin:0;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:11px;cursor:pointer;transition:background var(--duration),color var(--duration)}
.segmented label{flex:1;min-width:0;padding:12px 8px;text-align:center}
.segmented button:hover,.segmented label:hover{color:var(--text)}
.segmented button.active,.segmented button[aria-pressed="true"],.segmented label:has(input:checked){background:var(--mint-soft);color:var(--mint);box-shadow:inset 0 0 0 1.5px var(--mint)}
.segmented input{position:absolute;opacity:0;width:1px;height:1px;margin:0;min-height:0}
.segmented label:has(input:focus-visible){outline:3px solid var(--mint);outline-offset:3px}
.segmented svg{width:14px;height:14px}
.option-copy strong{display:block;font-size:11px;font-weight:550}.option-copy small{display:block;margin-top:3px;color:var(--subtle);font-size:10px}
.preference-summary{min-width:0;padding:26px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.preference-summary h2{margin:0 0 10px;font-size:15px}.preference-summary p{font-size:12px}
.preference-summary dl{margin:22px 0}.preference-summary dl>div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px}
.preference-summary dt{color:var(--muted)}.preference-summary dd{margin:0;font-weight:550}.preference-summary .btn{margin-top:18px}
.settings-actions{display:flex;align-items:flex-start;flex-direction:column;gap:0;margin-top:22px}
.settings-actions>.actions{justify-content:flex-start;margin-top:0}
.settings-actions>.note{margin:14px 0 0}
.signedout-panel>.section-kicker{margin:22px 24px 0}
.welcome-banner-compact{padding:24px 28px}
.welcome-banner-compact h2{font-size:19px}
.toggle-switch{position:relative;flex-shrink:0;width:42px;height:24px;margin:0;padding:0;border:1px solid var(--line-strong);border-radius:20px;background:var(--field);transition:background var(--duration)}
.toggle-switch::after{content:"";position:absolute;width:16px;height:16px;top:3px;left:3px;background:var(--muted);border-radius:50%;transition:transform var(--duration),background var(--duration)}
.toggle-switch[aria-checked="true"]{background:var(--mint);border-color:var(--mint)}.toggle-switch[aria-checked="true"]::after{background:var(--mint-ink);transform:translateX(18px)}

/* Forms and dialogs */
dialog{width:510px;max-width:calc(100vw - 32px);max-height:88dvh;padding:28px;border:1px solid var(--line-strong);border-radius:18px;background:var(--panel);color:var(--text);box-shadow:0 20px 100px #0005;overflow-y:auto}
dialog::backdrop{background:#050908b3;backdrop-filter:blur(5px)}
.dialoghead{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}.dialoghead h2{font-size:21px;letter-spacing:-.035em}
dialog p{margin-bottom:16px;font-size:12px}
label{display:block;margin:18px 0 8px;color:var(--muted);font-size:12px}
input,select,textarea{width:100%;min-height:44px;padding:11px 13px;border:1px solid var(--line-strong);border-radius:8px;background:var(--field);color:var(--text);font-size:12px;line-height:1.5;transition:border-color var(--duration)}
input:hover,select:hover,textarea:hover{border-color:var(--muted)}input::placeholder,textarea::placeholder{color:var(--subtle);opacity:1}
textarea{min-height:90px;resize:vertical}
input[type="checkbox"],input[type="radio"]{width:16px;height:16px;min-height:0;flex-shrink:0;accent-color:var(--mint);margin:3px 0 0}
.check{display:flex;align-items:flex-start;gap:10px;line-height:1.7}.check input{margin-top:3px}
form .actions{justify-content:flex-end;margin-top:24px}
.form-error{color:var(--orange);margin-top:16px;font-size:12px;line-height:1.7}
.wallet-option{display:flex;align-items:center;gap:16px;width:100%;padding:18px;margin:12px 0;border:1px solid var(--line);border-radius:11px;background:var(--field);color:var(--text);text-align:left;transition:border-color var(--duration),background var(--duration)}
.wallet-option:hover{border-color:var(--line-strong);background:var(--panel-raised)}.wallet-option img{width:36px;height:36px;object-fit:contain}
.wallet-option small{display:block;margin-top:5px;color:var(--subtle);font-size:11px}
.auth-tabs{display:flex;gap:8px;padding:5px;margin-bottom:24px;border:1px solid var(--line);border-radius:11px;background:var(--field)}.auth-tabs button{flex:1;border-color:transparent}
.suite-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px}
#toast,.ui-toast{position:fixed;right:28px;bottom:28px;z-index:90;max-width:min(420px,calc(100vw - 40px));padding:16px 20px;border:1px solid var(--line-strong);border-radius:12px;background:var(--panel-raised);color:var(--text);box-shadow:0 10px 40px #0004;font-size:12px;line-height:1.6}

/* Motion and density */
@keyframes enter-page{from{opacity:.35;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.page-transition{animation:enter-page 260ms ease-out both}
html[data-density="compact"] .stat{min-height:137px;padding:18px 20px}
html[data-density="compact"] .stat strong{margin-top:12px;font-size:30px}
html[data-density="compact"] .panelhead{min-height:64px;padding:18px 20px}
html[data-density="compact"] .card,html[data-density="compact"] .profile-card,html[data-density="compact"] .settings-panel{padding:22px}
html[data-density="compact"] .settings-row{padding-block:18px}html[data-density="compact"] td{padding:15px 20px}
html[data-density="compact"] .event{padding-block:14px}html[data-density="compact"] .intro{margin-block:28px 22px}

@media(min-width:1600px){main{--page-gutter:52px}.stat{padding:25px 28px}}
@media(max-width:1250px){
  main{--page-gutter:28px}.intro{align-items:flex-start}.intro>.actions{max-width:260px;justify-content:flex-end}
  .stats{gap:12px}.stat{padding:20px}.stat>span{font-size:11px}.stat small{font-size:11px}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-layout{grid-template-columns:1fr}.preference-summary{max-width:none}
  .workspace-links{gap:12px}.workspace-links>button,.workspace-links>a{padding:16px}
}
@media(max-width:1080px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stat{min-height:146px}.grid,.profile-grid{grid-template-columns:1fr}
  .workspace-links>button,.workspace-links>a{padding:18px 20px}
}
@media(max-width:800px){
  html{scrollbar-gutter:auto}
  #sidebar{width:min(290px,84vw);padding-top:30px;transform:translateX(-100%);transition:transform 220ms ease-out;box-shadow:none}
  body.nav-open #sidebar,html.nav-open #sidebar,#sidebar.is-open,#sidebar.open{transform:translateX(0);box-shadow:20px 0 60px #0003}
  .nav-close{display:inline-grid;position:absolute;top:20px;right:12px;width:32px;height:32px;font-size:23px}
  main{margin-left:0;padding-inline:24px}main>header{min-height:80px;gap:12px}
  #menu-toggle{display:inline-grid;width:40px;height:40px;place-items:center;flex-shrink:0;padding:0;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--text)}
  #menu-toggle:hover{background:var(--panel-raised)}#menu-toggle svg{width:19px;height:19px}
  .crumb{font-size:11px}.right{gap:7px}.right .btn{min-height:36px;padding:8px 11px;font-size:11px}
  .right .badge{font-size:8px;min-height:22px;padding:4px 6px}.intro{margin-top:28px}.intro>.actions{max-width:none}
  .welcome-banner{padding:24px}.welcome-mark{width:160px;height:160px}.welcome-mark svg{width:160px;height:160px}
  .settings-layout{gap:18px}footer{margin-top:26px}
}
@media(max-width:600px){
  main{padding-inline:18px;padding-bottom:22px}main>header{min-height:72px}.crumb{display:none}.right{margin-left:auto}
  #connection{max-width:84px;overflow:hidden;text-overflow:ellipsis}
  .intro{flex-direction:column;gap:20px;margin:27px 0 24px}.intro>.actions{justify-content:flex-start;width:100%}.intro>.actions .btn{flex:1}
  .intro p{font-size:12px}h1{font-size:28px}.eyebrow,.section-kicker{font-size:9px}
  .stats{gap:10px;margin-bottom:20px}.stat{min-height:138px;padding:17px;border-radius:12px}.stat>span{font-size:10px;gap:6px;align-items:center}
  .stat-icon{width:19px;height:19px;font-size:14px}.stat strong{font-size:30px;margin:15px 0 7px}.stat small{font-size:11px}
  .panelhead{min-height:68px;padding:20px}.panelhead h2{font-size:13px}.panelhead .badge{font-size:8px}
  .surface{padding:18px;min-height:300px}.empty{min-height:260px;padding:30px 18px}.empty h2{font-size:15px}.empty p{font-size:11px}
  .nodes,.cards{grid-template-columns:1fr}.feed{padding-inline:20px}.event{padding-block:17px}
  .section{flex-wrap:wrap;margin-top:26px}.section h2{font-size:16px}.filter{flex:1;width:100%;min-width:190px}.card{padding:22px}
  th,td{padding:16px 18px;min-width:135px}table{font-size:11px}
  footer{flex-direction:column;align-items:flex-start;gap:6px;line-height:1.7}
  .welcome-banner{padding:24px 22px;gap:15px}.welcome-banner h2{font-size:19px}.welcome-banner p{font-size:11px}.welcome-mark{display:none}
  .welcome-banner .actions{gap:8px}.welcome-banner .btn{padding-inline:12px;font-size:11px}
  .welcome-summary,.workspace-links{grid-template-columns:1fr}
  .welcome-summary{gap:10px}.welcome-summary .mini-stat{padding:18px 22px}
  .welcome-summary .mini-stat strong{font-size:16px;margin-top:9px}
  .profile-grid{gap:18px}.profile-card,.settings-panel,.preference-summary{padding:24px}
  .detail-list>div{flex-direction:column;gap:5px;padding:15px 0}.detail-list dd{max-width:100%;text-align:left}
  .settings-row{flex-direction:column;align-items:flex-start;gap:15px;padding-block:22px}.settings-controls{width:100%}.settings-row>select{width:100%}
  .segmented{width:100%}.segmented button,.segmented label{flex:1;padding-inline:10px}.settings-row:has(>.toggle-switch){flex-direction:row;align-items:center}
  .segmented label{padding:12px 6px}.option-copy small{font-size:11px}.option-copy strong{font-size:12px}
  .settings-actions>.actions{width:100%}.settings-actions .btn{flex:1;padding-inline:10px;font-size:11px}
  .suite-grid{grid-template-columns:1fr}dialog{padding:22px;border-radius:16px}.dialoghead h2{font-size:19px}
  #toast,.ui-toast{right:18px;bottom:18px}.notice{padding:12px 14px;font-size:11px}
}
@media(max-width:380px){main{padding-inline:14px}.right .btn{padding-inline:8px;font-size:10px}.right{gap:5px}.right .badge{max-width:66px}.stat{padding:15px 13px}.intro>.actions .btn{font-size:11px;padding-inline:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
html[data-motion="reduced"]{scroll-behavior:auto}
html[data-motion="reduced"] *,html[data-motion="reduced"] *::before,html[data-motion="reduced"] *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
@media(forced-colors:active){.btn,.badge,.panel,.stat,.card,.segmented,.avatar,.profile-avatar,.toggle-switch{border:1px solid CanvasText}nav :is(button, .nav-link).active{outline:1px solid CanvasText}.toggle-switch::after{background:ButtonText}}
@media(forced-colors:active){.segmented label:has(input:checked){outline:2px solid Highlight;outline-offset:-3px}.segmented label:has(input:focus-visible){outline:3px solid CanvasText;outline-offset:3px}}