#app{flex-direction:column;height:100%;display:flex}.view{display:none}.view.active{flex:1;display:flex}.hidden{display:none!important}#view-login{padding:var(--space-6);justify-content:center;align-items:center}.login-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl);width:100%;max-width:380px;padding:var(--space-10) var(--space-8);box-shadow:var(--shadow-md)}.login-logo{text-align:center;margin-bottom:var(--space-2)}.login-logo svg{width:48px;height:48px;color:var(--color-primary);stroke-width:1.5px}h1{font-size:var(--text-2xl);text-align:center;letter-spacing:var(--tracking-tight);font-weight:700}.subtitle{color:var(--text-secondary);font-size:var(--text-sm);text-align:center;margin-bottom:var(--space-6)}#view-dash{flex-direction:row;overflow:hidden}#sidebar{background:var(--bg-surface);border-right:1px solid var(--border-default);flex-direction:column;width:220px;min-width:220px;display:flex;overflow:hidden}#sidebar-brand{align-items:center;gap:var(--space-2);padding:var(--space-5) var(--space-4);border-bottom:1px solid var(--border-subtle);display:flex}#sidebar-logo svg{width:24px;height:24px;color:var(--color-primary);stroke-width:1.5px}#sidebar-title{font-size:var(--text-base);font-weight:700}#sidebar-nav{padding:var(--space-2);flex-direction:column;flex:1;gap:2px;display:flex;overflow-y:auto}.nav-item{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);cursor:pointer;font-size:var(--text-sm);color:var(--text-secondary);transition:all var(--transition-fast);text-align:left;background:0 0;border:none;width:100%;font-weight:500;display:flex;position:relative}.nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}.nav-item.active{color:var(--color-primary);background:var(--color-primary-muted)}.nav-item.active:before{content:"";border-radius:0 var(--radius-full) var(--radius-full) 0;background:var(--color-primary);width:3px;height:60%;position:absolute;top:50%;left:0;transform:translateY(-50%)}.nav-item svg{stroke-width:1.5px;flex-shrink:0;width:16px;height:16px}#sidebar-user{padding:var(--space-3);border-top:1px solid var(--border-subtle);gap:var(--space-2);flex-direction:column;align-items:stretch;display:flex}#sidebar-username{font-size:var(--text-xs);color:var(--text-tertiary);text-align:center}#main-content{flex:1;overflow-y:auto}.dash-view{padding:var(--space-6);max-width:1000px;display:none}.dash-view.active{animation:.2s dashFadeIn;display:block}@keyframes dashFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.dash-view.active{animation:none}}.view-header{align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);padding-bottom:var(--space-3);border-bottom:1px solid var(--border-subtle);display:flex}.view-header h2{font-size:var(--text-xl);letter-spacing:var(--tracking-tight);flex:1;font-weight:700}.stats-row{gap:var(--space-3);margin-bottom:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));display:grid}.stat-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-5);text-align:center}.stat-card .num{font-size:var(--text-2xl);color:var(--color-primary);letter-spacing:var(--tracking-tight);font-weight:800;display:block}.stat-card .num.warning{color:var(--color-warning)}.stat-card .label{font-size:var(--text-xs);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:var(--tracking-wide);margin-top:var(--space-1)}.stat-card.attention{border-left:3px solid var(--color-warning);background:var(--bg-surface);cursor:pointer;transition:background var(--transition-fast)}.stat-card.attention:hover{background:var(--bg-elevated)}.stat-card.attention .num{color:var(--color-warning)}.stat-card.attention .label{color:var(--text-secondary)}.stat-card .attention-link{font-size:var(--text-xs);color:var(--color-primary);margin-top:var(--space-1);display:block}.form input,.form select,.form-input{width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--bg-inset);color:var(--text-primary);font-size:var(--text-sm);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none}.form input::placeholder,.form-input::placeholder{color:var(--text-disabled)}.form input:focus,.form select:focus,.form-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-muted)}.form select option{background:var(--bg-elevated);color:var(--text-primary)}.form-row{margin-bottom:var(--space-3)}.form-row label{font-size:var(--text-xs);color:var(--text-secondary);margin-bottom:var(--space-1);text-transform:uppercase;letter-spacing:var(--tracking-wide);font-weight:600;display:block}.color-row{align-items:center;gap:var(--space-2);display:flex}.color-row input[type=color]{border-radius:var(--radius-md);cursor:pointer;background:0 0;border:none;width:44px;height:44px;padding:0}.color-row span{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-tertiary)}.branding-form .btn{margin-top:var(--space-2)}.error-msg{color:var(--color-danger);font-size:var(--text-sm);min-height:20px}.success-msg{color:var(--color-success);font-size:var(--text-sm);min-height:20px;margin-top:var(--space-1)}#modal-overlay{background:var(--overlay-dark);z-index:100;justify-content:center;align-items:center;animation:.15s fadeIn;display:flex;position:fixed;inset:0}#modal-overlay.hidden{display:none}#modal-box{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-6);min-width:360px;max-width:480px;max-height:90vh;box-shadow:var(--shadow-lg);animation:.2s scaleIn;overflow-y:auto}#modal-body{margin-bottom:var(--space-4);font-size:var(--text-sm);line-height:var(--leading-normal)}.modal-actions{gap:var(--space-2);justify-content:flex-end;display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){#modal-overlay,#modal-box{animation:none}}.profile-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-6);max-width:500px}.profile-card .form-row{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.profile-card .form-row label{flex-shrink:0;margin-bottom:0}.profile-card .form-row span{font-size:var(--text-sm)}.activity-item{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--border-subtle);font-size:var(--text-sm);display:flex}.activity-item:last-child{border-bottom:none}.activity-item .act-store{color:var(--color-primary);font-weight:600}.activity-item .act-barcode{font-family:var(--font-mono);color:var(--text-tertiary)}.activity-item .act-time{color:var(--text-disabled);font-size:var(--text-xs);margin-left:auto}#mobile-header{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);background:var(--bg-surface);border-bottom:1px solid var(--border-default);z-index:5;display:none;position:sticky;top:0}#mobile-title{font-size:var(--text-base);text-align:center;flex:1;font-weight:700}.sidebar-close-btn{display:none}#sidebar-backdrop{background:var(--overlay-dark);z-index:50;animation:.15s fadeIn;position:fixed;inset:0}#sidebar-backdrop.hidden{display:none}@media (width<=768px){#mobile-header{display:flex}#view-dash{flex-direction:column}#sidebar{z-index:60;width:280px;transition:transform var(--transition-base);box-shadow:var(--shadow-lg);position:fixed;top:0;bottom:0;left:0;transform:translate(-100%)}#sidebar.open{transform:translate(0)}.sidebar-close-btn{margin-left:auto;display:inline-flex}#main-content{-webkit-overflow-scrolling:touch;width:100%;overflow-y:auto}.dash-view{padding:var(--space-3)}.stats-row{gap:var(--space-2);grid-template-columns:repeat(2,1fr)}.stat-card{padding:var(--space-4)}.stat-card .num{font-size:var(--text-xl)}.table-wrap{overflow-x:auto}.table-wrap table{min-width:500px}.login-card{padding:var(--space-6) var(--space-4)}#modal-box{min-width:unset;max-width:calc(100vw - var(--space-4));margin:0 var(--space-2)}.branding-form,.profile-card{max-width:100%}.color-row input[type=color]{width:36px;height:36px}.nav-item{padding:var(--space-3);min-height:44px}.nav-item svg{width:18px;height:18px}.btn{min-height:40px}.btn.small,.btn-sm{min-height:36px}#sidebar-user{padding:calc(var(--space-3) + env(safe-area-inset-bottom))}#sidebar-brand{padding-top:max(var(--space-5), env(safe-area-inset-top))}#mobile-header{padding-top:max(var(--space-2), env(safe-area-inset-top))}}@media (width>=769px){#sidebar-backdrop.hidden{display:none!important}}#import-preview-table{border-collapse:collapse;width:100%;font-size:var(--text-sm);margin-top:8px}#import-preview-table th{text-align:left;border-bottom:2px solid var(--border-subtle);color:var(--text-secondary);white-space:nowrap;padding:6px 8px;font-weight:600}#import-preview-table td{border-bottom:1px solid var(--border-subtle);font-family:var(--font-mono);padding:6px 8px;font-size:12px}#import-preview-table tr:hover td{background:var(--bg-hover)}.mapping-select{border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--bg-inset);width:100%;color:var(--text-primary);font-size:var(--text-sm);padding:6px 8px}.mapping-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-muted)}.import-status{border-radius:var(--radius-full);padding:2px 8px;font-size:11px;font-weight:600}.import-status.pending{color:#ffc107;background:#ffc10726}.import-status.auto-mapped{color:#00c8ff;background:#00c8ff26}.import-status.imported{color:#00c875;background:#00c87526}.import-status.rejected{color:#f44;background:#ff444426}.mapping-preview-card{background:var(--bg-inset);border:1px solid var(--border-subtle);border-radius:var(--radius-md);margin:8px 0;padding:12px}.mapping-preview-card .row{font-size:var(--text-sm);gap:12px;padding:4px 0;display:flex}.mapping-preview-card .row .label{color:var(--text-secondary);min-width:60px}.mapping-preview-card .row .value{font-family:var(--font-mono);color:var(--text-primary)}.brand-editor{margin-top:var(--space-4);padding:var(--space-5);background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-xl)}@media (width>=900px){#view-branding .dash-view-inner{gap:var(--space-8);align-items:flex-start;display:flex}}.branding-column{flex:1;min-width:0}.brand-preview{top:var(--space-6);text-align:center;position:sticky}.preview-label{font-size:var(--text-xs);color:var(--text-tertiary);text-transform:uppercase;letter-spacing:var(--tracking-wide);margin-top:var(--space-3)}.phone-mockup{background:var(--bg-surface);border:2px solid var(--border-default);width:220px;box-shadow:var(--shadow-lg), 0 0 0 1px #ffffff0d;border-radius:32px;flex-direction:column;padding:12px 6px;display:inline-flex;position:relative}.phone-notch{background:var(--bg-hover);border-radius:var(--radius-full);width:60px;height:5px;margin:0 auto 8px}.phone-screen{border-radius:var(--radius-lg);background:#000;flex-direction:column;flex:1;min-height:340px;display:flex;overflow:hidden}.phone-topbar{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);min-height:36px;display:flex}.phone-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:700;overflow:hidden}.phone-topbar-icon{border-radius:4px;flex-shrink:0;width:18px;height:18px}.phone-scan-area{flex:1;justify-content:center;align-items:center;display:flex;position:relative}.phone-scan-frame{width:130px;height:56px;position:relative}.phone-corner{border-color:var(--color-primary);border-style:solid;width:14px;height:14px;position:absolute}.phone-corner-tl{border-width:2px 0 0 2px;border-radius:3px 0 0;top:0;left:0}.phone-corner-tr{border-width:2px 2px 0 0;border-radius:0 3px 0 0;top:0;right:0}.phone-corner-bl{border-width:0 0 2px 2px;border-radius:0 0 0 3px;bottom:0;left:0}.phone-corner-br{border-width:0 2px 2px 0;border-radius:0 0 3px;bottom:0;right:0}.phone-scan-line{background:linear-gradient(90deg, transparent, var(--color-primary), transparent);height:1px;animation:2s ease-in-out infinite phoneScan;position:absolute;top:0;left:6px;right:6px}@keyframes phoneScan{0%,to{top:0}50%{top:calc(100% - 1px)}}@media (prefers-reduced-motion:reduce){.phone-scan-line{animation:none}}.phone-result-overlay{margin:var(--space-2) var(--space-3);padding:var(--space-2);border:1px solid var(--color-success);border-radius:var(--radius-md);text-align:center;transition:border-color var(--transition-fast), background var(--transition-fast);background:#10b9811a}.phone-result-name{color:#fff;font-size:11px;font-weight:700}.phone-result-price{color:var(--color-success);transition:color var(--transition-fast);font-size:14px;font-weight:800}.phone-bottom-controls{justify-content:center;align-items:center;gap:var(--space-4);padding:var(--space-2);display:flex}.phone-bottom-controls svg{color:#ffffff80;width:14px;height:14px}.phone-counter{color:#ffffffb3;font-size:11px;font-weight:700;font-family:var(--font-mono)}.phone-profile{text-align:center;padding:var(--space-1) var(--space-3) 0}.phone-profile-avatar{border:1px solid var(--border-default);background:var(--bg-hover);border-radius:50%;width:36px;height:36px;margin:0 auto;overflow:hidden}.phone-profile-avatar.hidden{display:none}.phone-profile-avatar img{object-fit:cover;width:100%;height:100%;display:block}.phone-profile-name{color:#fff;margin-top:2px;font-size:9px;font-weight:700}.phone-profile-links{justify-content:center;gap:6px;margin-top:2px;display:flex}.phone-profile-link{color:#fff6;transition:color var(--transition-fast)}.phone-profile-link:hover{color:var(--color-primary)}.phone-profile-link.hidden{display:none}.phone-profile-link svg{display:block}@media (width<=899px){.brand-preview{margin-top:var(--space-5)}.phone-mockup{width:180px}.phone-screen{min-height:280px}.phone-scan-frame{width:100px;height:44px}}.branding-form{max-width:500px}.promo-editor{margin-top:var(--space-4)}.logo-picker{gap:var(--space-3);flex-wrap:wrap;align-items:center;display:flex}.logo-picker input[type=file]{font-size:var(--text-sm);color:var(--text-secondary)}.logo-picker input[type=file]::file-selector-button{border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--bg-hover);color:var(--text-primary);font-size:var(--text-sm);cursor:pointer;padding:6px 12px}.logo-preview{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);max-height:48px}#crop-overlay{z-index:200;background:#000000d9;justify-content:center;align-items:center;animation:.15s fadeIn;display:flex;position:fixed;inset:0}#crop-box{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-4);width:min(560px,94vw);box-shadow:var(--shadow-lg);animation:.2s scaleIn}#crop-stage{border-radius:var(--radius-lg);background:var(--bg-inset);-webkit-user-select:none;user-select:none;touch-action:none;width:100%;height:320px;position:relative;overflow:hidden}#crop-image{pointer-events:none;image-rendering:auto;background-position:50%;background-size:cover;position:absolute}#crop-frame{border-radius:var(--radius-md);pointer-events:none;border:2px dashed #ffffff80;position:absolute;inset:20px;box-shadow:0 0 0 9999px #0000008c}#crop-frame:before,#crop-frame:after{content:"";background:#ffffff26;position:absolute}#crop-frame:before{height:1px;top:50%;left:20px;right:20px;transform:translateY(-50%)}#crop-frame:after{width:1px;top:20px;bottom:20px;left:50%;transform:translate(-50%)}#crop-bottom{padding-top:var(--space-3);justify-content:flex-end;display:flex}#crop-actions{gap:var(--space-2);display:flex}.offer-thumb{object-fit:cover;border-radius:var(--radius-sm);border:1px solid var(--border-subtle);width:32px;height:22px;display:block}.offer-thumb-empty{background:var(--bg-hover)}
