@import"https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap";:root{--bg-deep: #0c1117;--bg-card: #141b24;--bg-input: #1a2332;--bg-elevated: #1e2a3a;--border-subtle: #243044;--accent: #e8631a;--accent-glow: rgba(232,99,26,.25);--accent-light: #f4863e;--accent-dim: rgba(232,99,26,.08);--text-primary: #f0f2f5;--text-secondary: #8b99ab;--text-muted: #5a6a7e;--success: #2dd4a8;--success-dim: rgba(45,212,168,.1);--warning: #f59e0b;--warning-dim: rgba(245,158,11,.1);--error: #ef4444;--error-dim: rgba(239,68,68,.1);--blue: #6366f1;--blue-dim: rgba(99,102,241,.1);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}[data-theme=light]{--bg-deep: #eef1f5;--bg-card: #ffffff;--bg-input: #f0f3f7;--bg-elevated: #e6e9ee;--border-subtle: #c5cdd8;--accent: #e8631a;--accent-glow: rgba(232,99,26,.18);--accent-light: #f4863e;--accent-dim: rgba(232,99,26,.08);--text-primary: #111827;--text-secondary: #374151;--text-muted: #556070;--success: #059669;--success-dim: rgba(5,150,105,.1);--warning: #d97706;--warning-dim: rgba(217,119,6,.1);--error: #dc2626;--error-dim: rgba(220,38,38,.08);--blue: #4f46e5;--blue-dim: rgba(79,70,229,.1)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;overflow:hidden;background:var(--bg-deep);-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}body{font-family:DM Sans,-apple-system,BlinkMacSystemFont,sans-serif;color:var(--text-primary);padding-top:var(--safe-top);padding-bottom:var(--safe-bottom);line-height:1.5}.app-shell{height:100dvh;display:flex;flex-direction:column;overflow:hidden;position:relative}.screen{display:flex;flex-direction:column}.screen-scroll{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}.screen-pad{padding:0 24px}.status-bar{display:flex;justify-content:space-between;align-items:center;padding:14px 28px 8px;font-size:13px;font-weight:600;color:var(--text-secondary);flex-shrink:0}.bg-grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(var(--border-subtle) 1px,transparent 1px),linear-gradient(90deg,var(--border-subtle) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;opacity:.2}.bg-glow{position:absolute;top:-100px;left:50%;transform:translate(-50%);width:400px;height:280px;background:radial-gradient(ellipse,var(--accent-glow) 0%,transparent 70%);pointer-events:none}.page-header{display:flex;align-items:center;justify-content:space-between;padding:8px 24px 14px;flex-shrink:0}.page-title{font-family:Bebas Neue,sans-serif;font-size:28px;font-weight:700;color:var(--text-primary)}.back-btn{width:38px;height:38px;background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:10px;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.back-btn:hover{border-color:var(--accent);color:var(--accent)}.nav-bar{display:flex;justify-content:space-around;align-items:center;padding:10px 16px calc(var(--safe-bottom) + 12px);background:var(--bg-deep);flex-shrink:0;border-top:1px solid var(--border-subtle)}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:none;color:var(--text-muted);cursor:pointer;font-family:DM Sans,sans-serif;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;transition:all .3s;padding:4px 8px}.nav-item.active{color:var(--accent)}.card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:14px;padding:14px;transition:all .25s;margin-bottom:10px}.card:hover{border-color:#e8631a4d}.card.selected{border-color:var(--accent);background:var(--accent-dim);box-shadow:0 0 0 2px var(--accent-glow)}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}.badge-success{background:var(--success-dim);color:var(--success)}.badge-warning{background:var(--warning-dim);color:var(--warning)}.badge-error{background:var(--error-dim);color:var(--error)}.badge-accent{background:var(--accent-dim);color:var(--accent)}.badge-blue{background:var(--blue-dim);color:var(--blue)}.badge-muted{background:#5a6a7e26;color:var(--text-muted)}.btn-primary{width:100%;padding:16px;background:linear-gradient(135deg,var(--accent),#d4550f);border:none;border-radius:12px;color:#fff;font-family:DM Sans,sans-serif;font-size:17px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 28px var(--accent-glow)}.btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}.btn-secondary{width:100%;padding:14px;background:var(--bg-input);border:1.5px solid var(--border-subtle);border-radius:12px;color:var(--text-secondary);font-family:DM Sans,sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px}.btn-secondary:hover{border-color:var(--text-muted)}.form-group{margin-bottom:16px}.form-label{display:block;font-size:15px;font-weight:500;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted);margin-bottom:7px}.input-wrap{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:14px;color:var(--text-muted);transition:color .3s;display:flex}.input-icon svg{width:18px;height:18px}.form-input{width:100%;padding:15px 15px 15px 44px;background:var(--bg-input);border:1.5px solid var(--border-subtle);border-radius:12px;color:var(--text-primary);font-family:DM Sans,sans-serif;font-size:15px;font-weight:500;outline:none;transition:all .3s}.form-input::placeholder{color:var(--text-muted);font-weight:400}.form-input:focus{border-color:var(--accent);background:var(--bg-input);box-shadow:0 0 0 3px var(--accent-glow)}.input-wrap:focus-within .input-icon{color:var(--accent)}.form-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' stroke='%235a6a7e' stroke-width='2' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px}.form-select option{background:var(--bg-card);color:var(--text-primary)}.form-textarea{width:100%;padding:14px;min-height:80px;background:var(--bg-input);border:1.5px solid var(--border-subtle);border-radius:12px;color:var(--text-primary);font-family:DM Sans,sans-serif;font-size:14px;outline:none;transition:all .3s;resize:none}.form-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.form-textarea::placeholder{color:var(--text-muted)}.progress-track{width:100%;height:6px;background:var(--bg-input);border-radius:3px;overflow:hidden}.progress-fill{height:100%;border-radius:3px;transition:width .6s ease;background:linear-gradient(90deg,var(--accent),var(--accent-light))}.rating-group{display:flex;gap:6px}.rating-btn{flex:1;min-height:48px;padding:12px 6px;border-radius:10px;font-family:DM Sans,sans-serif;font-size:15px;font-weight:700;cursor:pointer;transition:all .25s;text-align:center;border:1.5px solid var(--border-subtle);background:var(--bg-input);color:var(--text-muted);display:flex;align-items:center;justify-content:center}.rating-btn.s1{background:var(--error-dim);border-color:var(--error);color:var(--error)}.rating-btn.s2{background:var(--warning-dim);border-color:var(--warning);color:var(--warning)}.rating-btn.s3{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.rating-btn.s4{background:#2db48c1a;border-color:#2db48c;color:#2db48c}.rating-btn.s5{background:var(--success-dim);border-color:var(--success);color:var(--success)}.photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.photo-slot{aspect-ratio:1;border-radius:12px;overflow:hidden;border:2px dashed var(--border-subtle);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:all .3s;background:var(--bg-input);color:var(--text-muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px}.photo-slot:hover{border-color:var(--accent);color:var(--accent)}.photo-slot.filled{border:2px solid var(--success);background:linear-gradient(135deg,#1a3a2a,#1a2a1a);position:relative}.photo-slot .photo-check{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;background:var(--success);display:flex;align-items:center;justify-content:center}.toggle{width:44px;height:24px;border-radius:12px;cursor:pointer;position:relative;transition:all .3s;border:none;flex-shrink:0}.toggle.on{background:var(--accent)}.toggle.off{background:var(--border-subtle)}.toggle:after{content:"";position:absolute;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:all .3s}.toggle.on:after{left:23px}.toggle.off:after{left:3px}.five-s-row{display:flex;justify-content:center;gap:6px}.s-chip{padding:5px 8px;border-radius:6px;font-size:9px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;background:var(--bg-input);border:1px solid var(--border-subtle);color:var(--text-muted);transition:all .4s;cursor:pointer}.s-chip.active{border-color:var(--accent);color:var(--accent);background:var(--accent-dim)}.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.no-scrollbar::-webkit-scrollbar{display:none}.act-row{display:flex;gap:6px}.act-btn{width:32px;height:32px;border-radius:8px;background:var(--bg-input);border:1px solid var(--border-subtle);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.act-btn:hover{border-color:var(--accent);color:var(--accent)}.act-btn.danger:hover{border-color:var(--error);color:var(--error)}.act-btn svg{width:15px;height:15px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:50;display:flex;align-items:flex-end;justify-content:center;animation:fadeIn .2s ease}.modal-sheet{width:100%;max-width:500px;background:var(--bg-card);border-radius:20px 20px 0 0;padding:20px 24px calc(var(--safe-bottom) + 24px);max-height:85%;overflow-y:auto;animation:slideUp .35s ease;border-top:1px solid var(--border-subtle)}.modal-sheet::-webkit-scrollbar{display:none}.modal-handle{width:40px;height:4px;border-radius:2px;background:var(--text-muted);opacity:.3;margin:0 auto 16px}.modal-title{font-family:Bebas Neue,sans-serif;font-size:22px;letter-spacing:2px;color:var(--text-primary);margin-bottom:20px}.fab{position:fixed;bottom:calc(var(--safe-bottom) + 80px);right:24px;width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,var(--accent),#d4550f);border:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 28px var(--accent-glow);transition:all .3s;z-index:10}.fab:hover{transform:translateY(-2px) scale(1.05)}.fab svg{width:22px;height:22px}.zone-head{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:14px;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:12px;margin-bottom:8px;transition:all .25s}.zone-head:hover{border-color:#e8631a4d}.zone-head.open{border-color:var(--accent);border-radius:12px 12px 0 0;margin-bottom:0}.zone-body{background:var(--bg-card);border:1px solid var(--accent);border-top:none;border-radius:0 0 12px 12px;padding:4px 8px 8px;margin-bottom:8px}.area-row{display:flex;align-items:center;justify-content:space-between;padding:10px 8px;border-radius:8px;transition:background .2s}.area-row:hover{background:var(--bg-input)}.cat-sort{border-left:3px solid var(--error)}.cat-set{border-left:3px solid var(--warning)}.cat-shine{border-left:3px solid var(--accent)}.cat-std{border-left:3px solid #2db48c}.cat-sus{border-left:3px solid var(--success)}.search-bar{position:relative;margin-bottom:14px}.search-bar input{width:100%;padding:12px 12px 12px 40px;background:var(--bg-input);border:1.5px solid var(--border-subtle);border-radius:10px;color:var(--text-primary);font-family:DM Sans,sans-serif;font-size:13px;outline:none;transition:all .3s}.search-bar input::placeholder{color:var(--text-muted)}.search-bar input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.search-bar .search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-muted);display:flex}.search-bar .search-icon svg{width:18px;height:18px}.network-toast{position:fixed;top:calc(var(--safe-top) + 12px);left:50%;transform:translate(-50%) translateY(-60px);padding:10px 20px;border-radius:24px;font-size:12px;font-weight:600;z-index:10000;transition:transform .4s ease;display:flex;align-items:center;gap:8px}.network-toast.show{transform:translate(-50%) translateY(0)}.network-toast.online{background:#2dd4a826;border:1px solid rgba(45,212,168,.3);color:var(--success)}.network-toast.offline{background:#ef444426;border:1px solid rgba(239,68,68,.3);color:var(--error)}.network-toast .dot{width:8px;height:8px;border-radius:50%}.network-toast.online .dot{background:var(--success)}.network-toast.offline .dot{background:var(--error);animation:blink 1s ease infinite}.score-card{background:linear-gradient(135deg,#1a2332,#1e2a3a)}[data-theme=light] .score-card{background:linear-gradient(135deg,#fff,#eef1f5);box-shadow:0 2px 16px #00000014;border-color:var(--border-subtle)}.score-bar-dim{background:#ffffff2e}[data-theme=light] .score-bar-dim{background:var(--border-subtle)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes successPop{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}to{transform:scale(1);opacity:1}}@keyframes confettiFall{0%{transform:translateY(-20px) rotate(0);opacity:1}to{transform:translateY(60px) rotate(360deg);opacity:0}}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.anim-in{animation:fadeInUp .4s ease forwards}.d1{animation-delay:.05s;opacity:0}.d2{animation-delay:.1s;opacity:0}.d3{animation-delay:.15s;opacity:0}.d4{animation-delay:.2s;opacity:0}.d5{animation-delay:.25s;opacity:0}