:root{--bg:#f7f8fa;--surface:#fff;--ink:#14161a;--muted:#6b7280;--border:#e5e7eb;--accent:#f97316;--accent-dark:#ea580c;--accent-soft:#fff4ec;--green:#16a34a;--green-soft:#f0fdf4;--red:#dc2626;--red-soft:#fef2f2;--amber:#d97706;--amber-soft:#fffbeb;--blue:#2563eb;--blue-soft:#eff6ff;--radius:12px;--shadow:0 1px 3px rgba(0,0,0,.06),0 4px 14px rgba(0,0,0,.05);--sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono:"SF Mono","JetBrains Mono",Monaco,monospace}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.55;-webkit-font-smoothing:antialiased}a{color:var(--accent-dark);text-decoration:none}button{cursor:pointer;font-family:inherit}.container{margin:0 auto;max-width:1080px;padding:0 1.25rem}.site-header{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}.site-header .container{height:60px;justify-content:space-between}.brand,.site-header .container{align-items:center;display:flex}.brand{color:var(--ink);font-size:1.15rem;font-weight:800;gap:.5rem;letter-spacing:-.02em}.brand .dot{background:var(--accent);border-radius:50%;display:inline-block;height:10px;width:10px}.site-nav{display:flex;gap:.25rem}.site-nav a{border-radius:8px;color:var(--muted);font-size:.9rem;font-weight:500;padding:.45rem .8rem;transition:.15s}.site-nav a:hover{background:var(--bg);color:var(--ink)}.site-nav a.router-link-active{background:var(--accent-soft);color:var(--accent-dark)}.hero{padding:4rem 0 2.5rem;text-align:center}.hero h1{font-size:clamp(2rem,5vw,3rem);letter-spacing:-.03em;line-height:1.1;margin:0 auto 1rem;max-width:760px}.hero p{color:var(--muted);font-size:1.1rem;margin:0 auto 1.75rem;max-width:560px}.btn{align-items:center;background:var(--accent);border:none;border-radius:10px;color:#fff;display:inline-flex;font-size:1rem;font-weight:600;gap:.5rem;padding:.8rem 1.6rem;text-decoration:none;transition:.15s}.btn:hover{background:var(--accent-dark);transform:translateY(-1px)}.btn.secondary{background:var(--surface);border:1px solid var(--border);color:var(--ink)}.btn.secondary:hover{border-color:var(--muted)}.btn.small{border-radius:8px;font-size:.85rem;padding:.45rem .9rem}.btn:disabled{cursor:not-allowed;opacity:.5;transform:none}.btn.danger{background:var(--red)}.btn.green{background:var(--green)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.25rem}.card+.card{margin-top:1rem}.grid{display:grid;gap:1rem}.grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.steps{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));margin-top:2.5rem;text-align:left}.step{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem}.step .num{color:var(--accent);font-family:var(--mono);font-size:.8rem;font-weight:700}.step h3{font-size:1rem;margin:.4rem 0 .3rem}.step p{font-size:.875rem}.step p,label{color:var(--muted)}label{display:block;font-size:.8rem;font-weight:600;letter-spacing:.04em;margin-bottom:.35rem;text-transform:uppercase}input,select,textarea{background:var(--surface);border:1px solid var(--border);border-radius:9px;color:var(--ink);font-family:inherit;font-size:.95rem;padding:.65rem .8rem;transition:.15s;width:100%}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}textarea{min-height:72px;resize:vertical}.field{margin-bottom:1rem}.chips{display:flex;flex-wrap:wrap;gap:.5rem}.chip{background:var(--surface);border:1px solid var(--border);border-radius:999px;color:var(--ink);font-size:.875rem;font-weight:500;padding:.5rem .9rem;transition:.12s}.chip.active,.chip:hover{border-color:var(--accent)}.chip.active{background:var(--accent-soft);color:var(--accent-dark);font-weight:600}.chip small{color:var(--muted);display:block;font-weight:400}.quote-box{background:linear-gradient(135deg,var(--accent-soft),#fff);border:1px solid #fed7aa;border-radius:var(--radius);padding:1.25rem}.quote-row{color:var(--muted);display:flex;font-size:.9rem;justify-content:space-between;padding:.3rem 0}.quote-row.total{border-top:1px solid #fed7aa;color:var(--ink);font-size:1.15rem;font-weight:700;margin-top:.5rem;padding-top:.8rem}.quote-row.total .amt{color:var(--accent-dark)}.dropzone{background:var(--surface);border:2px dashed var(--border);border-radius:var(--radius);cursor:pointer;padding:2.5rem 1rem;text-align:center;transition:.15s}.dropzone.drag,.dropzone:hover{background:var(--accent-soft);border-color:var(--accent)}.dropzone input{display:none}.dropzone .big{font-size:1.05rem;font-weight:600}.dropzone .sub{color:var(--muted);font-size:.85rem;margin-top:.3rem}.badge{align-items:center;border-radius:999px;display:inline-flex;font-size:.75rem;font-weight:600;gap:.35rem;padding:.22rem .6rem}.badge.paid,.badge.review{background:var(--blue-soft);color:var(--blue)}.badge.accepted,.badge.queued{background:var(--amber-soft);color:var(--amber)}.badge.printing{background:var(--accent-soft);color:var(--accent-dark)}.badge.qc,.badge.shipped{background:#f3e8ff;color:#7c3aed}.badge.complete,.badge.ready{background:var(--green-soft);color:var(--green)}.badge.cancelled,.badge.failed,.badge.rejected{background:var(--red-soft);color:var(--red)}.timeline{list-style:none;margin-top:1rem}.timeline li{display:flex;gap:.8rem;padding:.45rem 0;position:relative}.timeline .tl-dot{background:var(--border);border-radius:50%;flex-shrink:0;height:10px;margin-top:.35rem;width:10px}.timeline li.done .tl-dot{background:var(--green)}.timeline li.current .tl-dot{background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.timeline .tl-label{font-size:.875rem;font-weight:500}.timeline .tl-time{color:var(--muted);font-family:var(--mono);font-size:.78rem}.timeline li.done .tl-label{color:var(--green)}.timeline li.current .tl-label{color:var(--accent-dark);font-weight:600}.status-group{margin-bottom:2rem}.status-group h3{align-items:center;color:var(--muted);display:flex;font-size:.95rem;gap:.5rem;letter-spacing:.05em;margin-bottom:.75rem;text-transform:uppercase}.status-group h3 .count{background:var(--border);border-radius:999px;color:var(--ink);font-size:.8rem;padding:.1rem .55rem}.order-row{align-items:center;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}.order-row .left{min-width:0}.order-code{font-family:var(--mono);font-size:.95rem;font-weight:700}.order-meta{color:var(--muted);font-size:.82rem;margin-top:.15rem}.order-actions{display:flex;flex-wrap:wrap;gap:.45rem}table{border-collapse:collapse;font-size:.875rem;width:100%}th{color:var(--muted);font-size:.75rem;letter-spacing:.05em;padding:.55rem .6rem;text-align:left;text-transform:uppercase}td,th{border-bottom:1px solid var(--border)}td{padding:.6rem;vertical-align:middle}tr:last-child td{border-bottom:none}tr:hover td{background:#fafbfc}.toast{animation:toast-in .25s ease;background:var(--ink);border-radius:10px;bottom:1.25rem;box-shadow:0 8px 24px #0003;color:#fff;font-size:.9rem;left:50%;padding:.8rem 1.4rem;position:fixed;transform:translate(-50%);z-index:100}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(12px)}to{opacity:1;transform:translate(-50%)}}.preview-wrap{background:#101418;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;position:relative}.preview-wrap canvas{display:block;height:260px;width:100%}.preview-tag{background:#0009;border-radius:6px;color:#fff;font-family:var(--mono);font-size:.72rem;left:.6rem;padding:.25rem .55rem;position:absolute;top:.6rem}.muted{color:var(--muted)}.small{font-size:.82rem}.mono{font-family:var(--mono)}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.flex{align-items:center;display:flex;flex-wrap:wrap;gap:.75rem}.grow{flex:1}.divider{border:none;border-top:1px solid var(--border);margin:1.5rem 0}.section-title{font-size:1.35rem;font-weight:700;letter-spacing:-.02em;margin-bottom:1.25rem}.empty{color:var(--muted);padding:3rem 1rem;text-align:center}.empty .big{font-size:1.05rem;font-weight:600;margin-bottom:.3rem}footer{border-top:1px solid var(--border);color:var(--muted);font-size:.82rem;margin-top:4rem;padding:1.5rem 0;text-align:center}@media(max-width:640px){.site-nav a{font-size:.82rem;padding:.4rem .55rem}.hero{padding:2.5rem 0 1.5rem}.order-actions{width:100%}}
