:root {
    --ink:#16213a; --ink-soft:#2c3e63; --accent:#d98324; --ok:#1f8a52;
    --bg:#f5f6f8; --card:#fff; --line:#e2e5ea; --muted:#6b7280; --danger:#c0392b;
    --radius:14px; --shadow:0 1px 2px rgba(16,24,40,.06),0 4px 16px rgba(16,24,40,.06);
    --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.45;-webkit-text-size-adjust:100%;}
a{color:var(--ink);}
.wrap{max-width:640px;margin:0 auto;padding:16px 16px 48px;}
.topbar{background:var(--ink);color:#fff;padding:14px 16px;position:sticky;top:0;z-index:20;}
.topbar .inner{max-width:640px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;}
.topbar h1{font-size:17px;margin:0;font-weight:700;letter-spacing:.2px;}
.topbar a{color:#cdd6e8;text-decoration:none;font-size:14px;}
.topbar a:hover{color:#fff;}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;margin-bottom:16px;}
.card h2{font-size:16px;margin:0 0 12px;}
label.field{display:block;margin-bottom:12px;font-size:14px;color:var(--muted);}
label.field span{display:block;margin-bottom:5px;font-weight:600;color:var(--ink);}
input[type=text],input[type=tel],input[type=password],input[type=search],select,textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-size:16px;font-family:inherit;background:#fff;color:var(--ink);}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ink);outline-offset:1px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 18px;border:0;border-radius:10px;background:var(--ink);color:#fff;font-size:15px;font-weight:600;font-family:inherit;cursor:pointer;text-decoration:none;min-height:48px;}
.btn:hover{background:var(--ink-soft);}
.btn.full{width:100%;}
.btn.accent{background:var(--accent);}
.btn.accent:hover{filter:brightness(.95);}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line);}
.btn.ghost:hover{background:#f3f4f6;}
.btn.danger{background:var(--danger);}
.btn.sm{padding:8px 12px;min-height:38px;font-size:13px;}
.result{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;margin-bottom:10px;text-decoration:none;color:var(--ink);}
.result:hover{border-color:var(--ink);}
.result .meta{font-size:13px;color:var(--muted);margin-top:2px;}
.result .chev{color:var(--accent);font-weight:700;font-size:22px;}
.tag{display:inline-block;background:#eef1f6;color:var(--ink-soft);font-size:12px;padding:2px 8px;border-radius:999px;margin-left:6px;}
.progress{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted);margin-bottom:14px;}
.progress .bar{flex:1;height:8px;background:#e7eaef;border-radius:999px;overflow:hidden;}
.progress .bar>i{display:block;height:100%;background:var(--ok);width:0;transition:width .3s ease;}
.slot{border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px;background:#fff;}
.slot.done{border-color:var(--ok);background:#f3fbf6;}
.slot .head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.slot .name{font-weight:600;font-size:15px;}
.slot .status{font-size:13px;color:var(--muted);}
.slot.done .status{color:var(--ok);font-weight:600;}
.slot .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.slot .preview{margin-top:12px;display:none;}
.slot .preview img{max-width:100%;max-height:220px;border-radius:10px;border:1px solid var(--line);display:block;}
.slot.done .preview{display:block;}
.spinner{width:18px;height:18px;border:3px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;display:inline-block;}
@keyframes spin{to{transform:rotate(360deg);}}
.hidden-input{display:none;}
.notice{padding:12px 14px;border-radius:10px;font-size:14px;margin-bottom:14px;}
.notice.ok{background:#e8f6ee;color:#14663d;}
.notice.err{background:#fdecea;color:#962a1f;}
.notice.info{background:#eef2fb;color:#25406e;}
.muted{color:var(--muted);font-size:14px;}
.center{text-align:center;}
table.tbl{width:100%;border-collapse:collapse;font-size:14px;}
table.tbl th,table.tbl td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);}
table.tbl th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.4px;}
table.tbl tr:hover td{background:#fafbfc;}
.thumbgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
.thumbgrid figure{margin:0;}
.thumbgrid img{width:100%;border-radius:10px;border:1px solid var(--line);}
.thumbgrid figcaption{font-size:12px;color:var(--muted);margin-top:4px;text-align:center;}
.row{display:flex;gap:10px;flex-wrap:wrap;}
.row>*{flex:1;min-width:0;}
