:root{
  --paper:#EFF3F4; --surface:#FFFFFF; --ink:#15283B; --muted:#5B6B7A;
  --line:#D5DEE3; --accent:#0E6B57; --accent-dark:#0A5140; --accent-soft:#E2F0EC;
  --danger:#B4232A; --warn-bg:#FBF3DF; --warn-ink:#7A5A10; --warn-line:#E8D5A0;
}
*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;line-height:1.5}
a{color:var(--accent-dark)}
code,.mono{font-family:ui-monospace,"Cascadia Mono","JetBrains Mono",Consolas,monospace;font-size:.92em}
.wrap{max-width:960px;margin:0 auto;padding:0 20px 64px}
header.top{display:flex;align-items:center;gap:14px;padding:22px 0 18px;border-bottom:1px solid var(--line);margin-bottom:26px}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.logo strong{font-size:1.15rem;letter-spacing:-.01em}
.logo span{color:var(--muted);font-size:.85rem}
nav.main{margin-left:auto;display:flex;gap:4px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
nav.main a,nav.main button.link{padding:7px 11px;border-radius:4px;text-decoration:none;color:var(--ink);font-size:.92rem;background:none;border:0;cursor:pointer;font-family:inherit}
nav.main a:hover,nav.main button.link:hover{background:#E4EAED}
nav.main a.on{background:var(--ink);color:#fff}
nav.main .who{color:var(--muted);font-size:.85rem;padding:0 8px}
h1{font-size:1.45rem;margin:0 0 4px;letter-spacing:-.015em}
h2{font-size:1.05rem;margin:0 0 12px}
h3{font-size:.95rem;margin:16px 0 8px}
.sub{color:var(--muted);margin:0 0 22px;font-size:.93rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:20px 22px;margin-bottom:20px}
.card.narrow{max-width:460px;margin:40px auto}
label{display:block;font-size:.88rem;margin-bottom:5px;color:var(--ink);font-weight:600}
label.chk{font-weight:400;display:flex;gap:8px;align-items:flex-start}
label.chk input{margin-top:4px}
.hint{font-weight:400;color:var(--muted)}
p.hint{font-size:.85rem;margin:6px 0 0}
input[type=text],input[type=url],input[type=password],input[type=email],input[type=date],textarea,select{
  width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:4px;font:inherit;background:#fff;color:var(--ink)}
textarea{min-height:80px;resize:vertical}
input:focus,textarea:focus,select:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
input[type=color]{width:44px;height:34px;padding:2px;border:1px solid var(--line);border-radius:4px;background:#fff;cursor:pointer}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
@media(max-width:640px){.row,.row3{grid-template-columns:1fr}}
.field{margin-bottom:16px}
button,.btn{display:inline-block;padding:9px 16px;border-radius:4px;border:1px solid transparent;font:inherit;font-size:.93rem;cursor:pointer;text-decoration:none;color:var(--ink)}
button.primary,.btn.primary{background:var(--accent);color:#fff}
button.primary:hover{background:var(--accent-dark)}
button.ghost,.btn.ghost{background:#fff;border-color:var(--line)}
button.ghost:hover{background:#F2F5F6}
button.danger{background:#fff;border-color:var(--line);color:var(--danger)}
button.danger:hover{border-color:var(--danger)}
button.sm,.btn.sm{padding:5px 10px;font-size:.85rem}
button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.flash{padding:11px 14px;border-radius:4px;margin-bottom:16px;font-size:.93rem;border:1px solid}
.flash.ok{background:var(--accent-soft);border-color:#BBDCD2;color:var(--accent-dark)}
.flash.err{background:#FBE9EA;border-color:#EBC3C5;color:var(--danger)}
.flash.warn{background:var(--warn-bg);border-color:var(--warn-line);color:var(--warn-ink)}
.notice{padding:12px 15px;border-radius:6px;border:1px solid var(--warn-line);background:var(--warn-bg);color:var(--warn-ink);font-size:.9rem;margin:0 0 16px}
.notice code{background:#fff;padding:3px 7px;border-radius:3px;word-break:break-all}
table.data{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:6px;overflow:hidden}
table.data th{text-align:left;font-size:.82rem;color:var(--muted);font-weight:600;padding:10px 14px;border-bottom:1px solid var(--line);background:#F7FAFA}
table.data td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:.93rem}
table.data tr:last-child td{border-bottom:0}
table.data tbody tr:hover td{background:#F7FAF9}
.slugchip{background:#EDF2F4;border:1px solid var(--line);border-radius:4px;padding:2px 7px;white-space:nowrap}
.target{color:var(--muted);max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:bottom}
.count{font-variant-numeric:tabular-nums;text-align:right}
.off{color:var(--muted)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:1px}
.dot.on{background:var(--accent)}.dot.offd{background:#B7C2CA}.dot.exp{background:#D9A441}
.badge{display:inline-block;font-size:.75rem;padding:2px 7px;border-radius:3px;background:#EDF2F4;color:var(--muted);border:1px solid var(--line)}
.badge.warn{background:var(--warn-bg);color:var(--warn-ink);border-color:var(--warn-line)}
.badge.admin{background:var(--accent-soft);color:var(--accent-dark);border-color:#BBDCD2}
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.toolbar input{max-width:260px}
.toolbar .sp{flex:1}
.qrbox{display:flex;gap:26px;flex-wrap:wrap;align-items:flex-start}
#qr{width:260px;min-width:260px;border:1px solid var(--line);border-radius:6px;padding:10px;background:#fff}
#qr svg{width:100%;height:auto;display:block}
.qrmeta{flex:1;min-width:260px}
.urlline{display:flex;gap:8px;align-items:center;margin:6px 0 14px;flex-wrap:wrap}
.urlline code{background:#EDF2F4;border:1px solid var(--line);border-radius:4px;padding:5px 9px;word-break:break-all}
.dl{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
select.inline{width:auto;display:inline-block}
.chart{display:flex;align-items:flex-end;gap:2px;height:72px;margin-top:8px}
.chart .b{flex:1;background:var(--accent);border-radius:2px 2px 0 0;min-height:2px;opacity:.85}
.chart .b.zero{background:#DCE4E8}
.chartlbl{display:flex;justify-content:space-between;color:var(--muted);font-size:.78rem;margin-top:4px}
.stats{display:flex;gap:28px;margin:4px 0 10px;flex-wrap:wrap}
.stats div strong{font-size:1.3rem;font-variant-numeric:tabular-nums;display:block}
.stats div span{color:var(--muted);font-size:.85rem}
.empty{text-align:center;padding:46px 20px;color:var(--muted)}
footer{margin-top:40px;color:var(--muted);font-size:.82rem}
.inline{display:inline}
.design{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;align-items:start}
@media(max-width:640px){.design{grid-template-columns:1fr}}
.design .field{margin-bottom:8px}
.swatches{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.swatches button{width:26px;height:26px;padding:0;border-radius:4px;border:1px solid var(--line)}
.logoprev{display:flex;gap:10px;align-items:center}
.logoprev img{width:44px;height:44px;object-fit:contain;border:1px solid var(--line);border-radius:4px;background:#fff;padding:3px}
.warnline{color:var(--warn-ink);font-size:.85rem;margin-top:6px;display:none}
.warnline.show{display:block}
.public{max-width:560px;margin:80px auto;text-align:center}
.public h1{font-size:1.5rem;margin-bottom:10px}
.public p{color:var(--muted)}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.audit td.d{color:var(--muted);font-size:.85rem;word-break:break-word}
@media(max-width:560px){
  header.top{flex-wrap:wrap;gap:10px;padding-top:16px}
  .logo span{display:none}
  nav.main{margin-left:auto}
  nav.main a,nav.main button.link{padding:6px 9px;font-size:.86rem}
  .wrap{padding:0 14px 48px}
  #qr{width:100%;min-width:0}
  h1{font-size:1.25rem}
  .target{max-width:150px}
}
