/* sh0rt.biz · shared tool surfaces · 20260915m1
   Presentation only. State visibility and application/crypto logic stay with the app. */
:root {
  color-scheme: dark;
  --bg: #080d18; --surface: #141f36; --border: #34435f;
  --text: #eef3ff; --text-dim: #b9c6dd; --text-faint: #a8b5cd;
  --accent: #a9bcff; --accent-hover: #d1dbff; --tool-rgb:169,188,255;
  --success-bg: #112c2c; --success-border: #396762; --success-text: #9fe7cd;
  --error-bg: #321e2c; --error-border: #895066; --error-text: #ffb4c4;
  --warn-bg: #30291f; --warn-border: #786143; --warn-text: #f2d298;
  --mono: ui-monospace, 'SF Mono', Menlo, monospace;
  --glass-font: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --glass-line: rgba(var(--tool-rgb),.23); --glass-focus: var(--accent);
  --glass-ease: cubic-bezier(.2,.7,.2,1);
}
html[data-service="notes"] { --accent:#c4afff; --accent-hover:#e9ddff; --tool-rgb:196,175,255; }
html[data-service="wallet"] { --accent:#83ded2; --accent-hover:#bcf0e8; --tool-rgb:131,222,210; }
html { min-width: 280px; background: var(--bg); scroll-padding-top: 28px; }
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0; background: radial-gradient(ellipse 720px 520px at 12% 0%, #273a6538, transparent 80%), radial-gradient(ellipse 700px 700px at 100% 35%, #16455722, transparent 80%), #080d18;
  color: var(--text); font-family: var(--glass-font); font-size: 15px; line-height: 1.7;
  min-height: 100vh; -webkit-font-smoothing: antialiased;
}
::selection { background: #a5b4ff; color: #080d18; }
a { color: var(--accent); text-underline-offset: 4px; }
a:hover { color: var(--glass-focus); }
button, input, select, textarea { font-family: var(--glass-font); }
button, a, summary { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
button { line-height: 1.45; }
:where(a, button, summary, input, select, textarea):focus-visible {
  outline: 2px solid var(--glass-focus) !important; outline-offset: 4px;
}
[hidden] { display: none !important; }
.wrap, body > .container { width: 100%; max-width: 760px; margin: 0 auto; padding: 34px 28px 32px; }
.wrap.wide { max-width: 980px; }
.wrap > .container { width: 100%; max-width: none; margin: 0; padding: 0; }
h1, h2, h3, .card h2, .pw-box h2, .burned-box h2, .invalid-box h2, .not-found h2 {
  font-family: var(--glass-font); font-style: normal; font-weight: 650; letter-spacing: -.035em; line-height: 1.25; color: var(--text); text-transform: none;
}
h1 { font-size: 34px; margin-bottom: 12px; overflow-wrap: anywhere; }
.card h1 { font-size: clamp(1.75rem, 4vw, 2.35rem); margin-bottom: 14px; }
h2, .card h2 { font-size: 1.3rem; margin-bottom: 12px; }
h3 { font-size: 1.05rem; }
.kicker { display: none; align-items: center; gap: 12px; color: #b9c7e6; font: 600 .78rem/1.5 var(--glass-font); letter-spacing: 0; text-transform: none; margin-bottom: 20px; }
.kicker::before { content: ''; width: 24px; height: 1px; background: var(--glass-focus); }
.sub, .hero-sub { max-width: 58ch; color: var(--text-dim); font-size: 14px; line-height: 1.65; margin-bottom: 26px; }
.subtitle { color: var(--text-dim); max-width: 60ch; font-size: .88rem; line-height: 1.8; margin-bottom: 24px; }
.card, .pw-box {
  background: linear-gradient(135deg,rgba(var(--tool-rgb),.055),transparent 65%),#111b2c;
  border: 1px solid var(--glass-line); border-radius: 20px; padding: 28px;
  box-shadow: inset 0 1px 0 #e1edff0d, 0 22px 60px #00000030;
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  min-width: 0; overflow-wrap: anywhere;
}
.card { margin-bottom: 24px; }
.card:focus-within { border-color: #a4beff50; }
.section { margin-top: 28px; padding-top: 26px; border-color: var(--glass-line); }
.section-title, .geo-title { font: 650 .8rem/1.6 var(--glass-font); color: #c5d2ea; letter-spacing: 0; text-transform: none; }
label, .field > label:not(.coin-opt), label.lbl, .pw-label { color: #c5d2ea; font-size: .83rem; line-height: 1.6; }
/* More specific than each original field rule, including the password IDs. */
body input:is([type=text], [type=url], [type=email], [type=password], [type=number]), body select, body textarea, body #pwOptions input[type=password] {
  width: 100%; min-width: 0; max-width: 100%; border: 1px solid #435472; border-radius: 10px;
  background: #080f1fd9; color: var(--text); padding: 13px 15px; font-family: var(--glass-font); font-size: 16px; line-height: 1.55;
  box-shadow: inset 0 2px 6px #00000018; transition: border-color .2s, box-shadow .2s, background .2s;
}
body input:is([type=text], [type=url], [type=email], [type=password], [type=number]):focus, body select:focus, body textarea:focus, body #pwOptions input[type=password]:focus {
  border-color: #9eaaff; background: #0c1529; box-shadow: 0 0 0 3px #9eaaff1a; outline: none;
}
input::placeholder, textarea::placeholder { color: #96a6c2; opacity: 1; }
select option { color: var(--text); background: #111c2f; }
body textarea { min-height: 180px; resize: vertical; }
body input:-webkit-autofill { -webkit-text-fill-color: #eef3ff; box-shadow: inset 0 0 0 1000px #111c2f; caret-color: #eef3ff; }
input[type=checkbox], input[type=radio] { accent-color: var(--accent); }
.slug-input-wrap { align-items: center; background: #080f1fd9; border: 1px solid #435472; border-radius: 10px; padding-left: 14px; }
.slug-input-wrap:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px #9eaaff1a; }
.slug-prefix { font-size: .8rem; color: var(--text-faint); }
body .slug-input-wrap input { border: 0; background: transparent; box-shadow: none; width: 100%; padding-left: 6px; }
body .slug-input-wrap input:focus { background: transparent; box-shadow: none; }
body .reads-row input[type=number] { width: 78px; flex-shrink: 0; padding-inline: 8px; }
.reads-row { flex-wrap: wrap; align-items: center; gap: 10px 14px; border-color: var(--glass-line); }
.reads-row .hint { flex: 1 1 170px; font-size: .78rem; }
body .pw-wrap input { padding-right: 70px; }
.pw-toggle { right: 8px; min-width: 50px; min-height: 38px; padding: 8px; border-radius: 7px; color: #c4d1ea; font-family: var(--glass-font); }
.pw-toggle:hover { color: white; background: #a9bfff16; }
/* Actions: a quiet filled primary, outlined secondary, rose destructive. */
body button[type=submit], body .btn, body .btn-open, body .pw-submit, body .btn-go, body .cta a, body .copy-btn, body .wallet-link-card button {
  background: var(--accent); color: #101931; border: 1px solid var(--accent);
  border-radius: 10px; min-height: 46px; padding: 12px 20px; font-weight: 750; letter-spacing: 0; cursor: pointer;
  box-shadow: inset 0 1px 0 #ffffff66, 0 7px 24px #667eff16;
  transition: background .2s, border-color .2s, box-shadow .25s, transform .2s var(--glass-ease);
}
body button[type=submit]:hover, body .btn:hover, body .btn-open:hover, body .pw-submit:hover, body .btn-go:hover, body .cta a:hover, body .copy-btn:hover, body .wallet-link-card button:hover {
  background: var(--accent-hover); color: #101931; box-shadow: 0 8px 25px #657dff30; transform: translateY(-1px);
}
body .btn-secondary, body .btn-ghost, body .qr-btn, body .dl-btn, body .stats-link, body .file-clear {
  background: #a4baff08; border: 1px solid #4b5d7d; border-radius: 10px; color: #d1dcf4; box-shadow: none; min-height: 44px; padding: 10px 16px;
  transition: background .2s, border-color .2s, color .2s;
}
body .btn-secondary:hover, body .btn-ghost:hover, body .qr-btn:hover, body .dl-btn:hover, body .stats-link:hover { background: #9eaaff18; color: white; border-color: #9eaaff; box-shadow: none; }
body .btn-red, body button.btn-delete { background: var(--error-bg); border: 1px solid var(--error-border); color: var(--error-text); box-shadow: none; }
body .btn-red:hover, body button.btn-delete:hover { background: #492438; border-color: #d385a0; color: #ffd9e2; box-shadow: none; }
body button:disabled, body .btn:disabled, body .btn-open:disabled { background: #26334b !important; border-color: #43516a !important; color: #aebbd1 !important; box-shadow: none !important; transform: none !important; cursor: not-allowed; }
body .btn-sm { width: auto; padding: 8px 12px; font-size: .78rem; }
body button:active:not(:disabled), body .btn-go:active { transform: translateY(0); }
.btn-row { flex-wrap: wrap; gap: 10px; }
.btn-row > * { min-width: 0; }
.another, .back, .btn-back, .btn-cancel, .home-link { color: #b9c8e3; line-height: 1.7; }
.another, .back, .btn-back, .btn-cancel { padding-block: 12px; }
/* Tabs keep their existing class-based visibility and activation contracts. */
body .tabs { display: flex; width: fit-content; max-width: 100%; padding: 5px; gap: 5px; background: #080f1fc2; border: 1px solid var(--glass-line); border-radius: 12px; margin-bottom: 26px; overflow: visible; }
body .tab-btn { min-width: 0; min-height: 43px; margin: 0; padding: 10px 19px; color: #b3c1da; background: transparent; border: 1px solid transparent; border-radius: 8px; font: 600 .85rem/1.4 var(--glass-font); transition: background .2s, border-color .2s, color .2s; }
body .tab-btn.active { color: #eef3ff; background: #2a3b5d; border-color: #8fa8ff66; box-shadow: inset 0 1px 0 #d1dfff13; }
body .tab-btn:hover:not(.active) { color: white; background: #a3bbff0e; }
.toggle-row, .zk-row { padding:14px 0; margin:0; min-height:70px; position: relative; border-color: var(--glass-line); gap: 14px; }
.t-label, .zk-label { min-width: 0; line-height: 1.65; }
.t-label strong, .zk-label strong { font-weight: 600; }
.t-label span, .zk-label span { color: var(--text-faint); font-size: .8rem; }
/* Restore keyboard access to original display:none native checkboxes. */
body .toggle-row input[type=checkbox], body .zk-row input[type=checkbox] { display: block; position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
body .t-switch, body .zk-switch { width: 38px; height: 22px; min-height: 0; padding: 0; border: 1px solid #596984; border-radius: 20px; background: #334159; box-shadow: inset 0 2px 4px #00000030; }
body .t-switch::after, body .zk-switch::after { width: 14px; height: 14px; top: 3px; left: 3px; background: #dce5f6; box-shadow: 0 1px 3px #0005; }
body .toggle-row.active .t-switch, body .zk-row.active .zk-switch, body #expireSwitch[data-on='1'] { background: var(--accent) !important; border-color: var(--accent); }
body .toggle-row.active .t-switch::after, body .zk-row.active .zk-switch::after { left: 19px; background: #101931; }
.toggle-row:has(input:focus-visible) .t-switch, .zk-row:has(input:focus-visible) .zk-switch { outline: 2px solid var(--glass-focus); outline-offset: 4px; }
.toggle-row:hover .t-switch, .zk-row:hover .zk-switch { border-color: #a5b5d3; }
.drop-zone { background: #0b152699; border: 1px dashed #62789e; border-radius: 14px; min-height: 200px; padding: 32px 20px; }
.drop-zone:hover, .drop-zone:focus-within, .drop-zone.over, .drop-zone.paste-hint { background: #1b2d49; border-color: var(--glass-focus); box-shadow: inset 0 0 30px #82e3ed06; }
.drop-zone:focus-within { outline: 2px solid var(--glass-focus); outline-offset: 4px; }
.drop-zone.has-file { background: #142b35; border-color: #6aa6b6; }
.drop-icon { color: #a9c0ff; }
.drop-label { color: var(--text-dim); }
body .file-clear { min-height: 36px; padding: 6px 14px; }
/* Every result surface, including dynamically generated notes and wallet links. */
.url-box, .addr-box, .code-box, .dest-box, .content-box, .zk-info, .zk-badge-box, .reads-info, .file-meta, .img-box, .burned-box, .no-stats, .cta, .wallet-link-card {
  background: #091324aa; border: 1px solid var(--glass-line); border-radius: 12px; overflow-wrap: anywhere; min-width: 0;
}
.url-box, .addr-box, .code-box, .dest-box { padding: 16px 18px; line-height: 1.8; }
.url-box { color: #bdcbff; }
.addr-box { color: #c9d7ef; }
.content-box { padding: 24px; line-height: 1.85; }
.file-meta > div, .row > *, .wallet-link-card > *, .meta-list li > * { min-width: 0; }
.file-meta strong, .img-filename { overflow-wrap: anywhere; }
.error, .err, .success, .success.zk, .warn, .warn-box, .alert, .status-box, .invalid-box { border-radius: 12px; line-height: 1.8; }
.success, .success.zk { background: var(--success-bg); border-color: var(--success-border); padding: 24px; }
.error, .err, .alert-e, .invalid-box { background: var(--error-bg); border-color: var(--error-border); color: var(--error-text); }
.warn, .warn-box, .alert-w { background: var(--warn-bg); border-color: var(--warn-border); color: var(--warn-text); }
.success p, .success.zk p { color: var(--success-text); }
.warn-box p { color: var(--warn-text); }
.invalid-box h2, .invalid-box p { color: var(--error-text); }
.badge { border-radius: 6px; border: 1px solid var(--border); padding: 4px 9px; font-family: var(--glass-font); font-size: .74rem; letter-spacing: 0; max-width: 100%; white-space: normal; }
.badge.green, .badge.active { color: var(--success-text); border-color: var(--success-border); }
.badge.orange { color: var(--warn-text); border-color: var(--warn-border); }
.badge.blue, .badge.zk, .badge.reads { color: #bdcaff; border-color: #6676a3; }
#coin-badge { color: #eef3ff !important; background: #2a3954 !important; border: 1px solid #607295 !important; }
.qr-wrap { background: #091324; border: 1px solid var(--glass-line); border-radius: 12px; padding: 20px; }
.qr-wrap canvas, .qr-wrap img { max-width: 100%; height: auto; margin-inline: auto; border: 8px solid #fff; border-radius: 8px; box-sizing: content-box; }
#qrCode { max-width: 100%; }
#qrCode canvas, #qrCode img { box-sizing: border-box; }
/* Wallet's entropy bitmap is drawn in cream/ink by protected JS.
   Invert + hue rotation recolours only its visual compositing, never canvas bytes. */
body #entropy-canvas { background: #f7f4ee; border: 1px solid #c1b3a1; border-radius: 12px; filter: invert(1) hue-rotate(180deg); }
#entropy-status-row { gap: 12px; flex-wrap: wrap; margin-top: 14px; }
#entropy-bar-bg { height: 5px; border-radius: 6px; background: #34415a; margin-top: 10px; }
#entropy-bar { background: var(--accent); border-radius: inherit; }
#entropy-ok { color: #9fe7cd; }
/* Retain locked opacity/pointer-events: the design never bypasses entropy gating. */
.coins { background: transparent; gap: 8px; border: 0; grid-template-columns: repeat(2,minmax(0,1fr)); }
.field .coin-opt { display:grid; grid-template-columns:18px minmax(0,1fr); position:relative; min-height:76px; align-items:center; background: #0c1728; border: 1px solid #3d4d69; border-radius: 11px; padding: 14px 12px; margin: 0; gap: 9px; min-width: 0; }
.coin-opt:hover { background: #1b2b46; }
.coin-opt.sel { background:rgba(var(--tool-rgb),.09); border-color:var(--accent); box-shadow:none; }
.coin-opt .dot{display:none}
.coin-opt .badge-send{position:absolute;right:10px;bottom:8px;white-space:nowrap;font-size:10px;line-height:1.3;width:auto;letter-spacing:0}
.coin-opt .coin-name{font-size:13px}.coin-opt .coin-sub{font-size:11px}
.coin-opt:focus-within { outline: 2px solid var(--glass-focus); outline-offset: 3px; }
.coin-sub, .badge-send { color: #adbbd3; }
.balance-num { font-family: var(--glass-font); font-style: normal; font-size: clamp(1.8rem,5vw,2.6rem); font-weight: 600; letter-spacing: -.05em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fee-hint { margin-top: 8px; line-height: 1.65; }
#overlay, #pw-modal { background: #040914c9; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); padding: 20px; }
.pw-box { width: 420px; max-width: 100%; max-height: calc(100dvh - 40px); overflow-y: auto; }
.pw-box h2 { font-size: 1.45rem; }
.spinner { border-color: #3b4b68; border-top-color: #82e3ed; }
/* Stats and editorial surfaces share spacing, not identical card subdivisions. */
.stats-grid { background: transparent; border: 0; gap: 12px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.stat-card { padding: 23px 15px; border: 1px solid var(--glass-line); background: #0d192b; border-radius: 12px; }
.stat-card .val { font-family: var(--glass-font); font-variant-numeric: tabular-nums; color: #d8e1ff; margin-bottom: 10px; }
.stat-card .lbl { font-family: var(--glass-font); text-transform: none; letter-spacing: 0; color: #b4c2dc; }
.meta-list li { gap: 20px; align-items: baseline; border-color: var(--glass-line); }
.meta-list .mv { overflow-wrap: anywhere; }
.geo-section, .del-zone, .sep, .divider { border-color: var(--glass-line); }
.geo-table { table-layout: fixed; width: 100%; }
.geo-table td { padding: 12px 6px; border-color: var(--glass-line); overflow-wrap: anywhere; }
.geo-table .geo-cnt { width: 75px; }
.geo-table tr:hover { background: #b4c7ff07; }
.faq-q { padding: 21px 0; font-weight: 600; color: #e0e9fa; line-height: 1.7; }
.faq-item { border-color: var(--glass-line); }
.faq-item.open .faq-q { color: #bdcaff; }
.faq-q .arrow { width: 26px; height: 26px; border: 1px solid #667ba644; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.faq-a { line-height: 1.9; color: #bdcae0; padding-bottom: 24px; }
.faq-a a { text-decoration: underline; text-underline-offset: 4px; }
code, .faq-a code { border-radius: 5px; background: #090f1e; border-color: #3a4b68; color: #c1cfff; overflow-wrap: anywhere; }
body.dg-legal .wrap { max-width: 850px; }
body.dg-legal .wrap:not(:has(.card)) { width: calc(100% - 40px); margin-top: 48px; padding: clamp(24px,5vw,44px); background: linear-gradient(125deg,#22314eee,#111c2ff5); border: 1px solid var(--glass-line); border-radius: 22px; box-shadow: 0 22px 60px #00000030; }
body .copy-btn.ok { background: #193f39; color: var(--success-text); border-color: var(--success-border); box-shadow: none; }
body.dg-legal .card h2, body.dg-legal .wrap > h2 { margin-top: 32px; font-size: 1.18rem; letter-spacing: -.02em; }
body.dg-legal h3 { color: #c3d1ea; font: 650 .95rem/1.6 var(--glass-font); letter-spacing: 0; text-transform: none; }
body.dg-legal p, body.dg-legal li { font-size: .94rem; line-height: 1.9; color: var(--text-dim); }
body.dg-legal .wrap > p { max-width: 72ch; }
footer { width: 100%; max-width: 760px; color: #a8b5cd; line-height: 2; padding: 24px 24px 36px; margin: 12px auto 0; }
footer a, .disclaimer a { color: #bac8e0; }
.disclaimer { color: #a8b5cd; line-height: 1.9; margin-top: 12px; }
/* Legacy wallet deletion replaces the entire body with inline ink-on-cream text.
   These exact presentation-only overrides leave that protected script intact. */
body > div[style*="color:#35415c"] { color: var(--text) !important; padding: 64px 24px !important; max-width: 760px; width: 100%; margin: 48px auto; background: #141f36; border: 1px solid var(--glass-line); border-radius: 18px; }
body > .card > a { color: #101931; background: #bdcbff; border-radius: 10px; }
body > .card > a:hover { background: #d1dbff; color: #101931; }
footer[style], footer a[style] { color: #b9c6dd !important; }
/* Navigation is shared across the three host-local webroots. */
.suite-nav { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 96px; padding: 20px clamp(24px,5vw,72px); border-bottom: 1px solid var(--glass-line); background: #0b1220bd; backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); }
.suite-brand { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; font: 750 1.35rem/1.3 var(--glass-font); letter-spacing: -.06em; color: #eef3ff; text-decoration: none; }
.suite-brand span { color: inherit; font-weight: inherit; }
.suite-brand .suite-mark { width: 33px; height: 36px; display: inline-block; position: relative; }
.suite-mark::before, .suite-mark::after { content: ''; position: absolute; width: 15px; height: 27px; top: 2px; left: 2px; border: 1px solid #c0ccff; border-radius: 5px; background: linear-gradient(140deg,#8cb9ff88,#7585ff22); transform: skewY(-24deg); box-shadow: inset 1px 1px 5px #c4e6ff44; }
.suite-mark::after { left: 15px; top: 8px; border-color: #82e3ed99; background: linear-gradient(160deg,#82e3ed88,#8298ff11); }
.suite-tabs { display: flex; gap: 6px; min-width: 0; }
.suite-tab { display: flex; align-items: center; justify-content: center; gap: 8px; color: #b8c6de; font: 600 .82rem/1.5 var(--glass-font); padding: 11px 16px; border: 1px solid transparent; border-radius: 10px; text-decoration: none; transition: color .2s, background .2s, border-color .2s; }
.suite-tab svg { width: 16px; height: 16px; stroke: currentColor; flex-shrink: 0; }
.suite-tab:hover { color: #eef3ff; background: #a2bbff0c; border-color: #acc5ff24; }
.suite-tab.tab-active { color: #dce5ff; background: #9eaaff18; border-color: #9eaaff4a; }
.suite-tab span.suite-tab-label { display: inline; }
/* One entrance composition. No looping glows, pointer tracking or form movement. */
@keyframes dg-arrive { from { opacity: .55; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes dg-state { from { opacity: .65; } to { opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
  body > .wrap, body > .container, body > .card { animation: dg-arrive .6s var(--glass-ease); }
  .pane.active, .tab-panel.active, .faq-item.open .faq-a, .success, .error, .alert-e { animation: dg-state .22s ease-out; }
  .card { transition: border-color .25s, box-shadow .25s; }
  .coin-opt { transition: border-color .2s, background .2s, box-shadow .2s; }
}

.tool-options{border-top:1px solid var(--glass-line);margin-top:24px;padding-top:4px}
.tool-options summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;min-height:52px;list-style:none;color:var(--text-dim);font-size:13px;font-weight:600}
.tool-options summary::after{content:'+';font-size:22px;color:var(--accent)}
.tool-options[open] summary::after{content:'−'}
.tool-options summary::-webkit-details-marker{display:none}
.tool-options .section{border:0;margin:0;padding:12px 0 0}
.expire-grid>label{grid-column:1/-1;margin-bottom:0}
html[data-service] button[type=submit]{margin-top:20px;min-height:48px}
html[data-service="notes"] .tabs{width:100%;margin-bottom:20px}
html[data-service="notes"] .tab-btn{flex:1}
html[data-service="notes"] .tab-btn.active{background:rgba(var(--tool-rgb),.17);color:#e9ddff;border-color:rgba(var(--tool-rgb),.4)}
html[data-service="notes"] #noteText{min-height:160px;height:160px;margin:8px 0 16px}
html[data-service="notes"] .reads-row{padding:16px 0;margin:0}
html[data-service="wallet"] .wrap{max-width:1040px}
html[data-service="wallet"] .wrap>.container{display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px;align-items:start}
html[data-service="wallet"] #result-list{grid-column:1/-1}
html[data-service="wallet"] .wrap .card{padding:24px;margin:0}
html[data-service="wallet"] .field{margin-bottom:18px}
html[data-service="wallet"] .subtitle{font-size:13px;line-height:1.65;margin:10px 0 18px}
html[data-service="wallet"] .tab-btn.destructive{margin-left:12px;border-left:1px solid var(--error-border);color:var(--error-text)}
.copy-status{font-size:13px;line-height:1.6;margin-top:12px;min-height:1.6em}
.private-link-hint{margin-top:18px;font-size:13px;line-height:1.65}
body textarea.url-box{min-height:72px;font-family:var(--mono);font-size:14px;resize:vertical}
@media(max-width:760px){html[data-service="wallet"] .wrap>.container{grid-template-columns:minmax(0,1fr);gap:16px}html[data-service="wallet"] .wrap .card{padding:20px}}

@media (max-width: 620px) {
  .suite-nav { gap: 14px; flex-wrap: wrap; padding: 17px 20px 13px; min-height: 0; }
  .suite-brand { font-size: 1.2rem; }
  .suite-tabs { width: 100%; gap: 5px; }
  .suite-tab { flex: 1 1 0; padding: 10px 7px; font-size: .78rem; gap: 6px; }
  .suite-tab span.suite-tab-label { display: inline; }
  .wrap, body > .container { padding: 25px 20px 24px; }
  .card { border-radius: 17px; padding: 20px; }
  h1 { font-size: 28px; }
  .sub, .hero-sub { font-size: .92rem; margin-bottom: 26px; }
  body .tab-btn { padding: 10px 13px; font-size: .8rem; }
  .success, .success.zk { padding: 18px; }
  .btn-row > .copy-btn { flex-basis: 100%; }
  .qr-wrap { padding: 14px; }
  .qr-wrap canvas, .qr-wrap img { box-sizing: border-box; }
  .coin-opt { flex-wrap: wrap; gap: 7px; padding: 12px 10px; }
  .coin-opt .badge-send { display: block; }
  .wallet-link-card { flex-wrap: wrap; gap: 10px; }
  .wallet-link-card > div { flex-basis: 75% !important; }
  .wallet-link-card button { width: 100%; }
  .content-box { padding: 16px; }
  .meta-list li { font-size: .8rem; gap: 12px; }
}
@media (max-width: 360px) {
  .wrap, body > .container { padding-inline: 12px; }
  .card { padding: 20px 16px; }
  .suite-nav { padding-inline: 12px; }
  .suite-tab { font-size: .73rem; }
  .suite-tab svg { width: 14px; height: 14px; }
  body .tab-btn { padding-inline: 10px; }
  .coins { gap: 6px; }
  .coin-opt { padding-inline: 7px; }
  .coin-opt .dot { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  body button:hover, body .btn-go:hover { transform: none !important; }
}

/* Readable wallet states, including the pre-entropy locked surface. */
body .warn{color:#f1d6a4!important;background:#282218!important}
body .coin-name{color:#edf2ff!important}body .coin-sub,body .badge-send{color:#c2d0e8!important}
body .entropy-locked{opacity:1!important}body .entropy-locked:before{content:'Complete the randomness field to enable wallet creation.';display:block;color:#d0dcf2;margin-bottom:18px}
html.embedded body{background:#101a2b!important;min-height:0!important}
html.embedded .suite-nav,html.embedded footer,html.embedded .wrap>.kicker,html.embedded .wrap>h1,html.embedded .wrap>.sub,html.embedded .wrap>.hero-sub{display:none!important}
html.embedded .wrap{padding:15px!important;margin:0!important;max-width:none!important;width:100%!important}
html.embedded .container{display:block!important;padding:0!important}
html.embedded .card{margin:0 0 16px!important;padding:20px!important}
html.embedded #entropy-canvas{height:100px!important}

/* Embedded pages must not inherit a viewport-height minimum. */
html.embedded{height:auto!important;min-height:0!important}html.embedded body{height:auto!important;min-height:0!important}