:root { color-scheme: dark; --bg:#111b1a; --panel:#192624; --line:#35423b; --ink:#f3ecd9; --muted:#b6c1b5; --gold:#e6b45d; font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); line-height:1.55; }
header,main,footer { max-width:960px; margin:auto; padding:24px; }
header { display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line); }
a { color:var(--gold); text-underline-offset:4px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--ink); text-decoration:none; font-weight:800; letter-spacing:.14em; }
.brand-mark { display:grid; place-items:center; width:40px; height:40px; border:2px solid var(--gold); color:var(--gold); font:bold 30px/1 Georgia,serif; box-shadow:4px 4px 0 #080f0d; }
nav { display:flex; gap:18px; font-size:14px; }
main { padding-top:36px; display:grid; gap:22px; }
h1 { margin:4px 0 12px; font:normal clamp(34px,6vw,54px)/1.1 Georgia,serif; letter-spacing:-.03em; }
h2 { margin:0 0 16px; font-size:21px; }
p { margin:0 0 12px; }
.eyebrow { color:var(--gold); font:700 12px/1.4 ui-monospace,monospace; letter-spacing:.13em; text-transform:uppercase; }
.intro { max-width:690px; }
.muted { color:var(--muted); font-size:14px; }
.panel { padding:24px; background:var(--panel); border:1px solid var(--line); border-radius:12px; }
.profile-grid { display:grid; grid-template-columns:120px 1fr; gap:22px; align-items:start; }
.profile-symbol { width:96px; height:96px; border-radius:10px; object-fit:contain; }
.avatar-frame { display:grid; place-items:center; padding:14px; border:1px solid #59705b; background:#111b1a; }
#avatarPreview, #identityAvatar { display:block; width:96px; height:96px; image-rendering:pixelated; }
.fields { display:grid; gap:16px; }
.avatar-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
label { display:block; font-weight:600; font-size:14px; margin:0 0 5px; }
input,select,button { font:inherit; }
input,select { display:block; width:100%; min-width:0; min-height:46px; padding:10px 12px; color:var(--ink); background:#0e1715; border:1px solid #526153; border-radius:6px; }
input[type=checkbox] { width:20px; min-height:20px; accent-color:var(--gold); }
button,.button { display:inline-block; padding:12px 18px; border:1px solid #5c715d; border-radius:6px; background:#25392d; color:var(--ink); cursor:pointer; text-decoration:none; text-align:center; font-size:15px; font-weight:650; }
button:hover,.button:hover { background:#334b38; }
button:disabled { opacity:.45; cursor:default; }
.primary { background:var(--gold); color:#1d2119; border-color:var(--gold); min-height:54px; font-size:17px; }
.primary:hover { background:#f2c87f; }
.secondary { background:transparent; }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:18px; }
.actions p { margin:0; }
summary { cursor:pointer; font-weight:650; }
details[open]>summary { margin-bottom:16px; }
.support { border-top:1px solid var(--line); padding-top:16px; margin-top:20px; }
.support .actions { margin-top:12px; }
.pill { display:inline-block; color:var(--gold); border:1px solid #72613f; border-radius:30px; font:600 12px ui-monospace,monospace; padding:5px 10px; margin-bottom:16px; }
.identity-grid { display:grid; grid-template-columns:184px minmax(0,1fr); gap:24px; align-items:center; }
.qr { background:white; padding:0; width:176px; height:176px; image-rendering:pixelated; }
.address,.identity-url,.recovery { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; word-break:break-word; }
.address { font-size:clamp(15px,3vw,20px); line-height:1.6; margin:8px 0 12px; }
.identity-url { display:block; font-size:13px; margin:8px 0; }
.status { margin:0; min-height:22px; font-size:14px; overflow-wrap:anywhere; }
.bad { color:#ffb4a8; } .ok { color:#b3e4ac; }
.status:empty { min-height:0; }
.recovery { padding:16px; background:#0e1715; font-size:15px; }
.print-row { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.print-row .primary { flex:1 1 200px; }
.print-preview { overflow:auto; padding:16px; background:#39443b; border-radius:6px; margin-top:14px; text-align:center; }
.print-preview img { width:100%; max-width:1280px; height:auto; background:#fff; image-rendering:pixelated; display:block; margin:auto; }
progress { width:100%; margin:14px 0; accent-color:var(--gold); }
.card-preview { margin-top:24px; padding-top:20px; border-top:1px solid var(--line); }
.card-preview h3 { margin:0 0 8px; }
.preview-actions { margin-top:10px; }
.print-help { margin:12px 0 0; }
.copy-status { min-height:22px; margin-top:10px; }
.public-heading { display:flex; align-items:center; gap:22px; }
.public-heading>div:last-child { min-width:0; }
.public-heading h1 { font-size:clamp(30px,5vw,44px); }
.public-heading h1 { overflow-wrap:anywhere; }
.note { border-left:3px solid var(--gold); padding-left:12px; }
.checkbox { display:flex; gap:10px; align-items:flex-start; margin-top:14px; }
.checkbox label { font-weight:400; }
footer { color:var(--muted); font-size:13px; border-top:1px solid var(--line); margin-top:30px; padding-bottom:36px; }
:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
[hidden] { display:none!important; }
@media(max-width:600px) {
 header,main,footer { padding:18px; } header { gap:10px; } nav { gap:12px; } .brand { letter-spacing:.07em; }
 main { padding-top:28px; } .panel { padding:18px; } .profile-grid { grid-template-columns:80px minmax(0,1fr); gap:16px; }
 .profile-symbol { width:64px; height:64px; } #avatarPreview { width:64px; height:64px; } .avatar-frame { padding:8px; } .avatar-fields { grid-template-columns:1fr; gap:10px; }
 .identity-grid { grid-template-columns:1fr; gap:12px; } .identity-grid>.qr { margin:auto; }
 .actions>.primary { width:100%; } .public-heading { gap:14px; } .public-heading h1 { font-size:30px; }
}
@media print { header,footer,.no-print { display:none!important; } body { background:#fff; color:#000; } .panel { background:#fff; color:#000; border:1px solid #777; } }