:root{--bg:#0a0a0a;--bg-elevated:#121212;--surface:#1a1a1a;--surface-2:#222;--border:#2a2a2a;--text:#f5f5f5;--text-muted:#a3a3a3;--accent:#ff6a00;--accent-soft:#ff8a3d;--accent-dim:#ff6a0029;--danger:#ff4d4d;--success:#3dd68c;--radius:16px;--radius-sm:10px;--font-display:"Syne", sans-serif;--font-body:"Outfit", sans-serif;--nav-h:68px;--header-h:64px;--ease:cubic-bezier(.22, 1, .36, 1);--shadow:0 12px 40px #00000073}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:var(--font-body);background:radial-gradient(1200px 600px at 80% -10%, #ff6a002e, transparent 55%), radial-gradient(800px 400px at 0% 100%, #ff8a3d14, transparent 50%), var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}button,input,select,textarea{font:inherit;color:inherit}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}*{scrollbar-width:thin;scrollbar-color:#ff6a008c transparent}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ff6a0073;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#ff8a3dbf}.app-shell{border-inline:1px solid var(--border);background:linear-gradient(#121212eb,#0a0a0afa);flex-direction:column;width:min(480px,100%);min-height:100dvh;margin:0 auto;display:flex;position:relative;overflow:clip}.app-header{height:var(--header-h);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:10;background:#0a0a0ab8;justify-content:space-between;align-items:center;padding:0 16px;display:flex;position:sticky;top:0}.brand{font-family:var(--font-display);letter-spacing:-.03em;align-items:center;font-size:1.25rem;font-weight:800;display:flex}.brand-logo{width:auto;max-width:min(180px,52vw);height:28px;display:block}.app-main{padding:16px 16px calc(var(--nav-h) + 20px);animation:fade-up .35s var(--ease);flex:1}.app-nav{height:var(--nav-h);padding:8px 8px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--border);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:10;background:#0a0a0ae6;grid-auto-columns:1fr;grid-auto-flow:column;gap:4px;display:grid;position:sticky;bottom:0}.nav-item{color:var(--text-muted);cursor:pointer;transition:color .2s var(--ease), background .2s var(--ease), transform .15s var(--ease);background:0 0;border:0;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:.68rem;font-weight:500;display:flex}.nav-item.active{color:var(--accent-soft);background:var(--accent-dim)}.nav-item:active{transform:scale(.96)}.nav-item strong{font-size:1rem;font-weight:700;line-height:1}.page-title{font-family:var(--font-display);letter-spacing:-.04em;margin:0 0 6px;font-size:1.75rem;line-height:1.1}.page-sub{color:var(--text-muted);margin:0 0 18px;font-size:.95rem}.stack{flex-direction:column;gap:12px;display:flex}.row{align-items:center;gap:10px;display:flex}.order-item{border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);cursor:pointer;transition:border-color .2s var(--ease), transform .15s var(--ease), background .2s var(--ease);animation:fade-up .4s var(--ease) both;grid-template-columns:72px 1fr;gap:12px;padding:12px;display:grid}.order-item:hover{border-color:#ff6a0073}.order-item:active{transform:scale(.985)}.order-item img{object-fit:cover;background:var(--surface-2);border-radius:12px;width:72px;height:72px}.meta{color:var(--text-muted);font-size:.82rem}.badge{background:var(--surface-2);color:var(--text-muted);border-radius:999px;align-items:center;padding:4px 8px;font-size:.72rem;font-weight:600;display:inline-flex}.badge.status-new{background:var(--accent-dim);color:var(--accent-soft)}.badge.status-in_progress{color:#8eb6ff;background:#5a8cff26}.badge.status-ready_for_issue{color:#ffd56a;background:#ffc83c26}.badge.status-completed{color:var(--success);background:#3dd68c26}.badge.status-cancelled{color:#ff8f8f;background:#ff4d4d1f}.btn{appearance:none;cursor:pointer;transition:transform .15s var(--ease), background .2s var(--ease), opacity .2s;border:0;border-radius:14px;padding:12px 16px;font-weight:600}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-soft));color:#111}.btn-secondary{background:var(--surface-2);color:var(--text);border:1px solid var(--border)}.btn-danger{color:#ffb0b0;background:#ff4d4d26;border:1px solid #ff4d4d59}.btn-block{width:100%}.field{flex-direction:column;gap:6px;display:flex}.field-label,.field>label:not(.file-btn){color:var(--text-muted);font-size:.82rem;font-weight:500}.file-btn{cursor:pointer;color:var(--text);flex:1;justify-content:center;align-items:center;margin:0;font-size:1rem;font-weight:600;display:inline-flex;position:relative;overflow:hidden}.file-btn input[type=file]{opacity:0;cursor:pointer;width:100%;height:100%;font-size:100px;position:absolute;inset:0}.field input:not([type=file]),.field textarea,.field select{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);transition:border-color .2s var(--ease);outline:none;padding:12px}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--accent)}.location-qr-card{flex-direction:column;align-items:stretch;gap:12px;margin-top:4px;display:flex}.location-qr-image{aspect-ratio:1;object-fit:contain;border-radius:var(--radius-sm);border:1px solid var(--border);background:#fff;align-self:center;width:min(100%,280px);padding:10px}.location-qr-payload{margin:0}.location-qr-payload summary{cursor:pointer;margin-bottom:8px}.location-qr-payload .report-pre{overflow-wrap:anywhere;word-break:break-all;white-space:pre-wrap;max-width:100%;margin:0}.qr-scanner-video{object-fit:cover;border-radius:var(--radius-sm);border:1px solid var(--border);background:#000;width:100%;max-height:360px}.cis-phone{grid-template-columns:minmax(7.5rem,38%) 1fr;gap:8px;display:grid}.cis-phone-country{min-width:0;font-size:.85rem}.cis-phone-input{min-width:0}.field .error{color:#ff8f8f;font-size:.78rem}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px}.hero-photo{aspect-ratio:16/10;object-fit:cover;border-radius:var(--radius);border:1px solid var(--border);width:100%;margin-bottom:14px}.photo-gallery{flex-direction:column;gap:10px;margin-bottom:14px;display:flex}.photo-gallery .hero-photo{margin-bottom:0}.media-fallback{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;min-height:72px}.order-item .media-fallback{width:72px;height:72px}.photo-preview-grid{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px;display:grid}.photo-preview-item{aspect-ratio:1;border:1px solid var(--border);background:var(--surface-2);border-radius:12px;position:relative;overflow:hidden}.photo-preview-item img{object-fit:cover;width:100%;height:100%}.photo-preview-remove{color:#fff;cursor:pointer;background:#000000a6;border:0;border-radius:999px;width:28px;height:28px;font-size:1.1rem;line-height:1;position:absolute;top:4px;right:4px}.toast{left:50%;bottom:calc(var(--nav-h) + 16px);background:var(--surface-2);color:var(--text);box-shadow:var(--shadow);z-index:50;animation:fade-up .3s var(--ease);text-align:center;border:1px solid #ff6a0066;border-radius:14px;width:min(420px,100% - 32px);padding:12px 16px;position:fixed;transform:translate(-50%)}.empty{text-align:center;color:var(--text-muted);padding:40px 16px}.login-screen{flex-direction:column;justify-content:flex-end;width:min(480px,100%);min-height:100dvh;margin:0 auto;padding:24px 20px 32px;display:flex;position:relative;overflow-x:clip;container:login/inline-size}.login-screen:before{content:"";pointer-events:none;background:linear-gradient(#0000 20%,#0a0a0aeb 70%),radial-gradient(circle at 70% 20%,#ff6a0059,#0000 45%);position:absolute;inset:0}.login-content{z-index:1;width:100%;min-width:0;position:relative}.login-brand{align-items:center;max-width:100%;margin:0 0 12px;display:flex}.login-brand-logo{object-fit:contain;object-position:left center;width:min(100%,280px);height:auto;max-height:56px;display:block}.employee-pick{scrollbar-width:thin;scrollbar-color:var(--accent) transparent;flex-direction:column;gap:8px;max-height:46dvh;margin:18px 0;padding-right:4px;display:flex;overflow:auto}.employee-pick::-webkit-scrollbar{width:4px}.employee-pick::-webkit-scrollbar-track{background:0 0}.employee-pick::-webkit-scrollbar-thumb{background:linear-gradient(180deg, var(--accent), var(--accent-soft));border-radius:999px}.employee-pick::-webkit-scrollbar-thumb:hover{background:var(--accent-soft)}.employee-pick button{text-align:left;background:var(--surface);border:1px solid var(--border);cursor:pointer;transition:border-color .2s var(--ease), background .2s var(--ease);border-radius:14px;padding:12px 14px}.employee-pick button:hover{background:var(--surface-2);border-color:#ff6a0080}.report-pre{white-space:pre-wrap;font-family:var(--font-body);background:var(--bg-elevated);border-radius:var(--radius-sm);border:1px solid var(--border);padding:14px;font-size:.9rem;line-height:1.45}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:999px;padding:6px 10px;font-size:.8rem}.chip.on{background:var(--accent-dim);color:var(--accent-soft);border-color:#ff6a0080}.plan-widget{border-color:#ff6a0059;margin-bottom:16px}.plan-row{border-radius:var(--radius-sm);background:var(--surface-2);cursor:pointer;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:8px 10px;display:grid}.plan-row-title{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.comment-thread{flex-direction:column;gap:10px;max-height:40dvh;margin-top:10px;display:flex;overflow-y:auto}.comment-item{border-radius:var(--radius-sm);background:var(--surface-2);border:1px solid var(--border);padding:10px 12px}.consent-row{color:var(--text-muted);cursor:pointer;align-items:flex-start;gap:10px;font-size:.85rem;display:flex}.consent-row input{flex:none;margin-top:3px}@keyframes fade-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (width>=900px){body{background-color:#050505}}
