[hidden]{display:none!important}
@font-face{font-family:"DM Sans";src:url(fonts/dmsans-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"DM Sans";src:url(fonts/dmsans-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"DM Sans";src:url(fonts/dmsans-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"DM Serif";src:url(fonts/dmserif-latin-400-normal.woff2) format("woff2");font-display:swap}
@font-face{font-family:"DM Serif";src:url(fonts/dmserif-latin-400-italic.woff2) format("woff2");font-style:italic;font-display:swap}
:root{--paper:#f3ede1;--card:#fffdf8;--ink:#1f1d18;--muted:#6d665a;--line:#ddd4c3;--moss:#3f6b3a;--moss-2:#e3ecd9;--clay:#b8572f;--clay-2:#f6e3d7;--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 "DM Sans",system-ui,sans-serif}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--moss)}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}
header.top{border-bottom:1px solid var(--line);background:var(--paper)}
header.top .wrap{display:flex;align-items:center;gap:16px;min-height:72px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand svg{width:40px;height:40px}
.brand b{font:400 28px/1 "DM Serif",Georgia,serif;letter-spacing:-.01em}
.top nav{margin-left:auto;display:flex;gap:18px;font-size:15px}
.top nav a{color:var(--ink);text-decoration:none;border-bottom:1px solid transparent;padding:10px 0}
.top nav a:hover{border-color:var(--ink)}
.hero{padding:44px 0 28px}
.hero h1{font:400 clamp(38px,5.4vw,66px)/1.02 "DM Serif",Georgia,serif;margin:0 0 14px;letter-spacing:-.02em;max-width:900px}
.hero h1 i{color:var(--moss)}
.hero p{max-width:640px;margin:0;color:var(--muted);font-size:18px}
.steps{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px;font-family:var(--mono);font-size:13px}
.steps span{border:1px solid var(--line);background:var(--card);padding:7px 12px;border-radius:999px}
.grid{display:grid;grid-template-columns:340px 1fr;gap:22px;padding-bottom:60px;align-items:start}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px}
.card h2{font:400 24px/1.1 "DM Serif",Georgia,serif;margin:0 0 4px}
.card .sub{color:var(--muted);font-size:14px;margin:0 0 14px}
.drop{border:1.5px dashed #b9ad97;border-radius:12px;padding:18px;text-align:center;cursor:pointer;background:#fbf7ef}
.drop.over{background:var(--moss-2);border-color:var(--moss)}
.drop strong{display:block}
.drop small{color:var(--muted)}
textarea{width:100%;min-height:110px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff;resize:vertical;font-family:var(--mono);font-size:13px;margin-top:12px}
.row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.btn{border:1px solid var(--ink);background:var(--card);border-radius:10px;padding:11px 16px;min-height:44px;cursor:pointer;font-weight:500}
.btn:hover{background:#f5efe3}
.btn.primary{background:var(--ink);color:#fffdf8;width:100%;font-size:17px;padding:14px 18px}
.btn.primary:hover{background:#000}
.btn.primary:disabled{opacity:.55;cursor:progress}
.btn.ghost{border-color:var(--line)}
.btn.small{min-height:36px;padding:6px 12px;font-size:14px}
.chats{list-style:none;margin:14px 0 0;padding:0;font-size:14px}
.chats li{display:flex;justify-content:space-between;gap:8px;padding:8px 0;border-top:1px solid var(--line)}
.chats li span:last-child{color:var(--muted);font-family:var(--mono);font-size:12px;white-space:nowrap}
details{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
summary{cursor:pointer;font-weight:500;min-height:32px;display:flex;align-items:center}
label{display:block;font-size:13px;color:var(--muted);margin:12px 0 4px}
input[type=text],input[type=password],select{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fff;min-height:44px}
.hint{font-size:13px;color:var(--muted);margin:8px 0 0}
.go{margin-top:18px}
.status{font-family:var(--mono);font-size:12.5px;color:var(--muted);margin-top:10px;min-height:20px}
.status.err{color:var(--clay)}
/* order book */
.book-head{display:flex;align-items:end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.stats{display:flex;gap:22px;flex-wrap:wrap}
.stats div{font-family:var(--mono);font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.stats b{display:block;font:400 30px/1.1 "DM Serif",Georgia,serif;color:var(--ink);letter-spacing:0;text-transform:none}
table{width:100%;border-collapse:collapse;font-size:14.5px}
th{text-align:left;font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:10px 8px;border-bottom:1.5px solid var(--ink)}
td{padding:12px 8px;border-bottom:1px solid var(--line);vertical-align:top}
td.num{text-align:right;font-family:var(--mono);white-space:nowrap}
tr.cancel td{color:#9a9183;text-decoration:line-through}
tr.cancel td:last-child,tr.cancel td.keep{text-decoration:none}
.cust b{display:block}
.cust small{color:var(--muted);font-size:12.5px}
.items div{min-width:170px}
td.rep{min-width:300px}
.why{display:block;color:var(--clay);font-size:12px;margin-top:4px;max-width:160px}
.tag{display:inline-block;font:500 11px var(--mono);padding:2px 7px;border-radius:999px;background:var(--moss-2);color:var(--moss);text-transform:uppercase;letter-spacing:.04em;margin-top:4px}
.tag.warn{background:var(--clay-2);color:var(--clay)}
.paid{border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 12px;cursor:pointer;font-size:13px;min-height:32px}
.paid.on{background:var(--moss);border-color:var(--moss);color:#fff}
.empty{border:1px dashed var(--line);border-radius:12px;padding:44px 20px;text-align:center;color:var(--muted)}
.empty svg{width:84px;height:84px;opacity:.85}
.reply{font-size:13.5px;background:#f8f4ea;border-radius:10px;padding:8px 10px;white-space:pre-wrap;margin-bottom:6px}
.qs{margin-top:22px}
.qs h3{font:400 20px "DM Serif",Georgia,serif;margin:0 0 8px}
.q{border-top:1px solid var(--line);padding:10px 0;font-size:14.5px}
.q i{color:var(--muted);display:block;font-size:13.5px}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
.log{font-family:var(--mono);font-size:12px;color:var(--muted);margin-top:14px}
/* receipt */
dialog{border:0;padding:0;background:transparent;max-width:92vw}
dialog::backdrop{background:rgba(31,29,24,.55)}
.receipt{width:380px;max-width:92vw;background:#fffefa;font-family:var(--mono);font-size:13.5px;padding:26px 24px 30px;box-shadow:0 20px 50px rgba(0,0,0,.3);
 -webkit-mask:radial-gradient(circle 7px at 50% 100%,#0000 98%,#000) 50% 100%/18px 100% repeat-x,linear-gradient(#000,#000);mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/16px 100%}
.receipt h3{text-align:center;font:400 26px "DM Serif",Georgia,serif;margin:0}
.receipt .c{text-align:center;color:#6d665a;margin:2px 0 12px}
.receipt hr{border:0;border-top:1.5px dashed #b9ad97;margin:12px 0}
.receipt .l{display:flex;justify-content:space-between;gap:10px}
.receipt .big{font-size:20px;font-weight:700}
.receipt .note{font-family:"DM Sans",sans-serif;font-size:14.5px;line-height:1.45}
.receipt .btn{margin-top:16px;width:100%;font-family:"DM Sans",sans-serif}
footer{border-top:1px solid var(--line);padding:22px 0 40px;color:var(--muted);font-size:14px}
@media (max-width:900px){.grid{grid-template-columns:1fr}.top nav{display:none}.hero{padding:30px 0 18px}
 table,thead,tbody,tr,td{display:block}thead{display:none}tr{border-bottom:1px solid var(--line);padding:10px 0}td{border:0;padding:4px 0}td.num{text-align:left}td.rep{min-width:0}}
