
:root{
  --paper:#f5f0e6;
  --paper-deep:#ebe3d3;
  --surface:#fffdf8;
  --ink:#1a1511;
  --ink-soft:#4d4339;
  --line:#d8ccb8;
  --danger:#a3281c;
  --accent:#8a3b12;
  --on-accent:#ffffff;
  --font-body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-display:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --radius:14px;
  --tap:3.25rem;
  --s1:.25rem;--s2:.5rem;--s3:.75rem;--s4:1rem;--s5:1.5rem;--s6:2.25rem;--s7:3.5rem;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scrollbar-color:var(--line) var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font:1rem/1.55 var(--font-body);min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
::selection{background:var(--accent);color:var(--on-accent)}
img,svg{max-width:100%;display:block}
h1,h2,h3{margin:0;line-height:1.15;text-wrap:balance}
p{margin:0;text-wrap:pretty}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:4px}
input,textarea,button{font:inherit;color:inherit;caret-color:var(--accent)}
[hidden]{display:none!important}

.pole{height:.5rem;background:repeating-linear-gradient(135deg,var(--accent) 0 .6rem,var(--paper-deep) .6rem 1.2rem)}
.wrap{width:100%;max-width:30rem;margin:0 auto;padding:var(--s5) var(--s4) var(--s6)}
.wrap-wide{max-width:64rem}
main{flex:1}
.stack>*+*{margin-top:var(--s4)}
.stack-lg>*+*{margin-top:var(--s6)}
.muted{color:var(--ink-soft)}
.small{font-size:.875rem}
.center{text-align:center}
.mt-2{margin-top:var(--s2)}
.mt-4{margin-top:var(--s4)}
.break{word-break:break-all}

/* Identity */
.identity{display:flex;align-items:center;gap:var(--s4)}
.mark{position:relative;flex:none;width:4.5rem;height:4.5rem;border-radius:var(--radius);background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font:700 1.75rem/1 var(--font-display);letter-spacing:.02em;overflow:hidden}
.mark img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--surface)}
.shop{font:700 1.85rem/1.1 var(--font-display);letter-spacing:-.01em;overflow-wrap:anywhere}
.attended{margin-top:var(--s1);color:var(--ink-soft);overflow-wrap:anywhere}

/* Actions */
.btn{display:flex;align-items:center;justify-content:center;gap:var(--s2);min-height:var(--tap);padding:.8rem 1.25rem;border-radius:var(--radius);border:2px solid var(--ink);background:transparent;color:var(--ink);font-weight:650;text-align:center;text-decoration:none;cursor:pointer;transition:transform .15s var(--ease),background-color .15s var(--ease)}
.btn:active{transform:scale(.985)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-size:1.1rem;min-height:3.75rem}
.btn-quiet{border-color:var(--line);background:var(--surface)}
.btn-quiet:hover{border-color:var(--ink)}
.btn-sm{min-height:2.75rem;padding:.5rem .9rem;font-size:.9rem}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.hint{display:block;margin-top:var(--s2);color:var(--ink-soft);font-size:.875rem}

/* Sections on the business page: separated by rules and space, never boxed twice */
.section{padding-top:var(--s5);border-top:1px solid var(--line)}
.section h2{font:700 1.3rem/1.2 var(--font-display);margin-bottom:var(--s2)}

/* Forms */
.field{display:block}
.field>span{display:block;font-weight:600;margin-bottom:var(--s1)}
.field small{display:block;margin-top:var(--s1);color:var(--ink-soft)}
input[type=text],input[type=password],input[type=url],input[type=number],input[type=search],input[type=tel],input[type=date],textarea,select{width:100%;min-height:var(--tap);padding:.7rem .85rem;border:2px solid var(--line);border-radius:var(--radius);background:var(--surface)}
textarea{min-height:8rem;resize:vertical}
input:focus,textarea:focus,select:focus{border-color:var(--ink);outline:none}
::placeholder{color:#6f6354;opacity:1}
.check{display:flex;gap:var(--s3);align-items:flex-start;padding:var(--s2) 0;min-height:var(--tap)}
.check input{flex:none;width:1.5rem;height:1.5rem;margin:.1rem 0 0;accent-color:var(--accent)}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.notice{padding:var(--s3) var(--s4);border-radius:var(--radius);background:var(--paper-deep)}
.notice-error{background:#f7e1dc;color:#5c130b}
.notice-error ul{margin:0;padding-left:1.1rem}

/* Link lists */
.links{list-style:none;margin:0;padding:0;display:grid;gap:var(--s3)}

/* Page-level text (privacy, notices) */
.prose h1{font:700 2rem/1.1 var(--font-display);margin-bottom:var(--s4)}
.prose h2{font:700 1.25rem/1.2 var(--font-display);margin:var(--s5) 0 var(--s2)}
.prose p+p,.prose ul{margin-top:var(--s3)}
.prose ul{padding-left:1.2rem}
.prose li+li{margin-top:var(--s1)}

.foot{padding:var(--s4);text-align:center;color:var(--ink-soft);font-size:.875rem}
.foot a{display:inline-block;margin:0 var(--s1);padding:.8rem .5rem}

/* ---------- Owner panel ----------
   Phone first: one column, a five-destination bar fixed at the bottom of the screen
   (it moves to the top from 48rem). No boxes inside boxes: rows are separated by rules. */
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.demo-banner{background:var(--ink);color:var(--paper);padding:var(--s3) var(--s4);text-align:center;font-weight:600}
.demo-banner span{font-weight:400;opacity:.85}
.linkbtn-light{color:var(--paper)}
.linkbtn-light:hover{color:#fff}
.note{display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.note b{font:700 1.4rem/1 var(--font-display);font-variant-numeric:tabular-nums}
.notes h3{font:700 1rem/1.3 var(--font-body)}
.phead{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding-bottom:var(--s3)}
.phead-name{font:700 1.35rem/1.15 var(--font-display);overflow-wrap:anywhere}
.linkbtn{background:none;border:0;padding:var(--s2) 0;min-height:2.75rem;color:var(--ink-soft);text-decoration:underline;text-underline-offset:.2em;cursor:pointer;font-size:.9rem}
.linkbtn:hover{color:var(--ink)}
.pnav{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.pnav a{position:relative;display:flex;align-items:center;justify-content:center;gap:.3rem;min-height:3.5rem;padding:.25rem .1rem;text-decoration:none;font-size:.8125rem;font-weight:600;color:var(--ink-soft);border-top:3px solid transparent;margin-top:-1px}
.pnav a[aria-current=page]{color:var(--ink);border-top-color:var(--accent)}
.badge{display:inline-grid;place-items:center;min-width:1.3rem;height:1.3rem;padding:0 .35rem;border-radius:999px;background:var(--accent);color:var(--on-accent);font-size:.75rem;font-weight:700;font-variant-numeric:tabular-nums}
.has-pnav .foot{padding-bottom:5.5rem}
.panel-page{padding-bottom:var(--s5)}
.panel-page>*+*{margin-top:var(--s5)}
.page-title{font:700 1.9rem/1.1 var(--font-display);overflow-wrap:anywhere}
.lead{color:var(--ink-soft);margin-top:var(--s2)}
.psec{padding-top:var(--s5);border-top:1px solid var(--line)}
.psec h2{font:700 1.3rem/1.2 var(--font-display);margin-bottom:var(--s2)}
.flash{padding:var(--s3) var(--s4);border-radius:var(--radius);background:var(--paper-deep);font-weight:600}

/* Hand-noted review count */
.reviews{display:flex;align-items:baseline;gap:var(--s3);flex-wrap:wrap;margin:var(--s3) 0}
.reviews .big{font:700 3.25rem/1 var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.reviews .arrow{font:400 2rem/1 var(--font-display);color:var(--ink-soft)}

/* Numbers table: label, last 7 days, last 30 days. Stays a table at 390px: three short columns. */
.nums{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.nums th,.nums td{padding:var(--s3) 0;border-top:1px solid var(--line);text-align:right;vertical-align:baseline}
.nums thead th{border-top:0;padding-top:0;font-size:.8125rem;font-weight:600;color:var(--ink-soft)}
.nums tbody th{text-align:left;font-weight:600;padding-right:var(--s3)}
.nums tbody th small{display:block;font-weight:400;color:var(--ink-soft);font-size:.8125rem;line-height:1.35}
.nums td{width:4.5rem;font:700 1.6rem/1 var(--font-display)}
.nums td.dim{color:var(--ink-soft)}

/* Daily bars and NFC / QR split: inline SVG, colors from tokens */
.bars{width:100%;height:5rem;display:block}
.bars rect{fill:var(--accent)}
.bars rect.zero{fill:var(--line)}
.axis{display:flex;justify-content:space-between;font-size:.8125rem;color:var(--ink-soft);margin-top:var(--s1)}
.split{width:100%;height:.9rem;display:block;border-radius:999px;overflow:hidden}
.split .nfc{fill:var(--accent)}
.split .qr{fill:var(--ink)}
.legend{display:flex;gap:var(--s5);margin-top:var(--s2);font-variant-numeric:tabular-nums}
.legend b{font:700 1.25rem/1 var(--font-display)}
.dot{display:inline-block;width:.7rem;height:.7rem;border-radius:50%;margin-right:.4rem}
.dot-nfc{background:var(--accent)}
.dot-qr{background:var(--ink)}

/* Weekly summary */
.copybox{font:.9rem/1.5 var(--font-body);min-height:11rem;background:var(--surface)}
.ovbox{padding:var(--s4);border:1px dashed var(--line);border-radius:var(--radius);color:var(--ink-soft)}

/* Rows for cards, people and messages */
.rows{list-style:none;margin:var(--s3) 0 0;padding:0}
.row{padding:var(--s4) 0;border-top:1px solid var(--line)}
.row:first-child{border-top:0}
.row-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3)}
.row-head h2,.row-head h3{font:700 1.2rem/1.2 var(--font-display);overflow-wrap:anywhere}
.tag{flex:none;display:inline-block;padding:.15rem .6rem;border:1px solid var(--line);border-radius:999px;font-size:.8125rem;font-weight:600;background:var(--surface)}
.tag-off{border-color:var(--ink-soft);color:var(--ink-soft)}
.tag-new{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.facts{display:flex;gap:var(--s5);margin:var(--s3) 0;flex-wrap:wrap}
.fact b{display:block;font:700 1.6rem/1 var(--font-display);font-variant-numeric:tabular-nums}
.fact span{font-size:.8125rem;color:var(--ink-soft)}
.actions{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:center;margin-top:var(--s3)}
.actions form{display:flex;gap:var(--s2);align-items:center}
.actions select,.actions input[type=text]{width:auto;min-width:0;flex:1 1 9rem;min-height:2.75rem;padding:.4rem .7rem}
.addform{display:flex;gap:var(--s2);align-items:flex-end;flex-wrap:wrap}
.addform .field{flex:1 1 12rem}
.msg{white-space:pre-wrap;overflow-wrap:anywhere;margin:var(--s2) 0;font-size:1.05rem}
.meta{color:var(--ink-soft);font-size:.875rem;overflow-wrap:anywhere}
.row-unread .meta:first-of-type{color:var(--ink)}
.group{padding-top:var(--s5);border-top:1px solid var(--line)}
.group h2{font:700 1.25rem/1.2 var(--font-display);margin-bottom:var(--s3)}
.group .field+.field{margin-top:var(--s4)}
.price-list{list-style:none;padding:0;margin:var(--s3) 0}
.price-list li{display:flex;justify-content:space-between;gap:var(--s4);padding:var(--s3) 0;border-top:1px solid var(--line)}
.price-list b{font:700 1.4rem/1 var(--font-display);white-space:nowrap}

/* Print page */
.stand{display:grid;justify-items:center;text-align:center;gap:var(--s3);padding:var(--s5) 0;break-inside:avoid;border-top:1px solid var(--line)}
.stand .qr{width:min(18rem,100%)}
.stand h2{font:700 1.9rem/1.1 var(--font-display)}
.stand p{font-size:1.1rem}
.stickers{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4);margin-top:var(--s4)}
.sticker{display:grid;justify-items:center;text-align:center;gap:var(--s1);padding:var(--s3);border:1px dashed var(--line);break-inside:avoid}
.sticker .qr{width:100%;max-width:7rem}
.sticker strong{font-size:.85rem;line-height:1.2}
.sticker small{font-size:.7rem;color:var(--ink-soft)}

/* ---------- Admin ----------
   Plainer than the panel, same tokens. One column at every width, big inputs, no tables:
   the seller uses it standing in a shop, on a phone, with one thumb. */
.ahead{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding-bottom:var(--s3)}
.ahead-name{font:700 1.1rem/1.2 var(--font-display);letter-spacing:.02em}
.anav{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:var(--s5)}
.anav a{display:flex;align-items:center;justify-content:center;text-align:center;min-height:3.25rem;padding:.25rem .4rem;text-decoration:none;font-size:.875rem;font-weight:600;color:var(--ink-soft);border-bottom:3px solid transparent}
.anav a[aria-current=page]{color:var(--ink);border-bottom-color:var(--accent)}
.copy{margin:var(--s3) 0 0;padding:var(--s3) var(--s4);background:var(--surface);border:2px solid var(--line);border-radius:var(--radius);font:.95rem/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;user-select:all;-webkit-user-select:all}
.secret{font-weight:700;font-size:1.25rem;letter-spacing:.04em;background:var(--paper-deep);padding:.1rem .4rem;border-radius:6px}
.notice-warn{background:#fbeccb;color:#4a3205}
.result{margin-top:var(--s3)}
.result h3{font:700 1rem/1.3 var(--font-body)}
.result p{margin-top:var(--s1);overflow-wrap:anywhere}
.fact-wide{flex-basis:100%}
.stack-sm>*+*{margin-top:var(--s3)}

@media (min-width:48rem){
  .pnav{position:static;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:var(--s5);padding:0;overflow:hidden}
  .pnav a{min-height:3rem;margin-top:0;border-top:0;border-bottom:3px solid transparent;font-size:.9rem}
  .pnav a[aria-current=page]{border-bottom-color:var(--accent)}
  .has-pnav .foot{padding-bottom:var(--s4)}
  .stickers{grid-template-columns:repeat(4,1fr)}
}
@media print{
  @page{margin:12mm}
  .pnav,.foot,.phead,.demo-banner,.noprint{display:none!important}
  .wrap,.wrap-wide{max-width:none;padding:0}
  .stand{border-top:0;padding:0 0 10mm}
  .stand .qr{width:11cm}
  .stickers{grid-template-columns:repeat(3,1fr);gap:4mm}
  .sticker{border:1px dashed #999;padding:3mm}
  .sticker .qr{max-width:4cm}
}

@media (min-width:40rem){.wrap{padding-top:var(--s6)}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{.pole,.foot{display:none}body{background:#fff}}
