:root{--color-bg: #F7F6F3;--color-bg-warm: #F0EFEB;--color-surface: #FFFFFF;--color-text-primary: #1A1A1A;--color-text-secondary: #4A4A48;--color-text-tertiary: #8A8A86;--color-text-quiet: #B0B0AC;--color-border: #E2E1DD;--color-border-light: #EEEDEA;--color-accent: #3D3D3B;--color-accent-hover: #2A2A28;--color-success: #2D6A4F;--color-warning: #B8860B;--color-error: #9B2226;--color-info: #4A6FA5;--color-text-inverse: #FFFFFF;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--space-8: 96px;--radius-sm: 2px;--radius-md: 4px;--radius-lg: 8px;--shadow-sm: 0 1px 2px rgba(0,0,0,.04);--shadow-md: 0 4px 16px rgba(0,0,0,.06);--font-heading: "Instrument Sans", sans-serif;--font-body: "DM Sans", sans-serif;--motion-micro: .12s;--motion-element: .24s;--motion-section: .35s;--ease-material: cubic-bezier(.25, .1, 0, 1);--ease-reveal: cubic-bezier(0, 0, .2, 1);--ease-exit: cubic-bezier(.4, 0, 1, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font-body);font-size:14px;color:var(--color-text-primary);background:var(--color-bg);-webkit-font-smoothing:antialiased}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1;opacity:.02;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");background-size:256px 256px}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:600;color:var(--color-text-primary)}h1{font-size:24px;line-height:1.2}h2{font-size:20px;line-height:1.3}h3{font-size:16px;line-height:1.4}input,select,textarea{font-family:var(--font-body);font-size:14px;color:var(--color-text-primary);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);width:100%;outline:none;transition:border-color .12s}input:focus,select:focus,textarea:focus{border-color:var(--color-accent)}textarea{resize:vertical;min-height:80px}label{font-family:var(--font-heading);font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary);display:block;margin-bottom:var(--space-1)}.btn{font-family:var(--font-heading);font-weight:500;font-size:13px;text-transform:uppercase;letter-spacing:.06em;border:none;border-radius:var(--radius-sm);cursor:pointer;min-height:44px;padding:0 var(--space-5);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);transition:all .12s;white-space:nowrap}.btn:active{transform:scale(.98)}.btn-primary{background:var(--color-accent);color:var(--color-text-inverse)}.btn-primary:hover{background:var(--color-accent-hover)}.btn-secondary{background:transparent;color:var(--color-accent);border:1px solid var(--color-accent)}.btn-secondary:hover{background:var(--color-bg-warm)}.btn-small{min-height:32px;font-size:11px;padding:0 var(--space-4)}.btn-danger{background:var(--color-error);color:var(--color-text-inverse)}.badge{font-family:var(--font-heading);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);display:inline-block;transition:background-color var(--motion-micro) var(--ease-material),color var(--motion-micro) var(--ease-material)}.badge-active{background:#2d6a4f1a;color:var(--color-success)}.badge-warning{background:#b8860b1a;color:var(--color-warning)}.badge-expired{background:#9b22261a;color:var(--color-error)}.badge-maintenance{background:#4a6fa51a;color:var(--color-info)}.badge-inactive{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-pending{background:#b8860b1a;color:var(--color-warning)}.badge-suspended{background:#9b22261a;color:var(--color-error)}.badge-scheduled{background:#4a6fa51a;color:var(--color-info)}.badge-completed{background:#2d6a4f1a;color:var(--color-success)}.badge-sent{background:#4a6fa51a;color:var(--color-info)}.badge-processing{background:#b8860b1a;color:var(--color-warning)}.badge-cancelled{background:#9b22261a;color:var(--color-error)}.badge-lightbox{background:#4a6fa51a;color:var(--color-info)}.badge-decorative{background:#2d6a4f1a;color:var(--color-success)}.badge-led{background:#b8860b1a;color:var(--color-warning)}.badge-eflag{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-wall{background:#3d3d3b1a;color:var(--color-accent)}.badge-ceiling{background:#4a6fa51a;color:var(--color-info)}.badge-furniture{background:#2d6a4f1a;color:var(--color-success)}.badge-window{background:#b8860b1a;color:var(--color-warning)}.badge-divider,.badge-other{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-shop{background:#3d3d3b1a;color:var(--color-accent)}.badge-city{background:#4a6fa51a;color:var(--color-info)}.badge-neighbourhood{background:#2d6a4f1a;color:var(--color-success)}.badge-in_progress{background:#4a6fa51a;color:var(--color-info)}.badge-complete{background:#2d6a4f1a;color:var(--color-success)}.badge-order{background:#b8860b1a;color:var(--color-warning)}.badge-inventory{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-retail{background:#4a6fa51a;color:var(--color-info)}.badge-hotel{background:#2d6a4f1a;color:var(--color-success)}.badge-municipality{background:#b8860b1a;color:var(--color-warning)}.badge-owner{background:#3d3d3b1a;color:var(--color-accent)}.badge-region{background:#4a6fa51a;color:var(--color-info)}.badge-site{background:#2d6a4f1a;color:var(--color-success)}.badge-readonly{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-superadmin{background:#9b22261a;color:var(--color-error)}.badge-SSP{background:#3d3d3b1a;color:var(--color-accent)}.badge-TLC{background:#4a6fa51a;color:var(--color-info)}.badge-ScanAudit{background:#2d6a4f1a;color:var(--color-success)}.badge-Flagtrax{background:#9b22261a;color:var(--color-error)}.badge-SurfaceLab,.badge-audit_requested{background:#b8860b1a;color:var(--color-warning)}.badge-audit_accepted,.badge-audit_in_progress{background:#4a6fa51a;color:var(--color-info)}.badge-live{background:#2d6a4f1a;color:var(--color-success)}.badge-draft{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-survey_pending{background:#b8860b1a;color:var(--color-warning)}.badge-survey_complete,.badge-configuration{background:#4a6fa51a;color:var(--color-info)}.badge-ready_for_production{background:#2d6a4f1a;color:var(--color-success)}.badge-in_production,.badge-installation_pending{background:#b8860b1a;color:var(--color-warning)}.badge-installation_complete{background:#4a6fa51a;color:var(--color-info)}.badge-payment_pending{background:#b8860b1a;color:var(--color-warning)}.badge-payment_approved{background:#2d6a4f1a;color:var(--color-success)}.badge-closed{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-hardware{background:#3d3d3b1a;color:var(--color-accent)}.badge-flag{background:#9b22261a;color:var(--color-error)}.badge-assigned{background:#4a6fa51a;color:var(--color-info)}.badge-accepted{background:#2d6a4f1a;color:var(--color-success)}.badge-dispatched{background:#b8860b1a;color:var(--color-warning)}.badge-delivered{background:#2d6a4f1a;color:var(--color-success)}.badge-proof_submitted{background:#4a6fa51a;color:var(--color-info)}.badge-overdue{background:#9b22261a;color:var(--color-error)}.badge-warning_50{background:#b8860b1a;color:var(--color-warning)}.badge-warning_80{background:#9b22261a;color:var(--color-error)}.badge-ok,.badge-audit_complete{background:#2d6a4f1a;color:var(--color-success)}.badge-none{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-parking_lot{background:#4a6fa51a;color:var(--color-info)}.badge-street{background:#b8860b1a;color:var(--color-warning)}.badge-approved{background:#2d6a4f1a;color:var(--color-success)}.badge-in_delivery{background:#b8860b1a;color:var(--color-warning)}.badge-waiting_for_installation{background:#4a6fa51a;color:var(--color-info)}.badge-installed,.badge-paid{background:#2d6a4f1a;color:var(--color-success)}.badge-invoice_requested{background:#b8860b1a;color:var(--color-warning)}.badge-invoice_received{background:#4a6fa51a;color:var(--color-info)}.badge-available,.badge-configured{background:#2d6a4f1a;color:var(--color-success)}.badge-prepress{background:#4a6fa51a;color:var(--color-info)}.badge-production{background:#b8860b1a;color:var(--color-warning)}.badge-installation{background:#4a6fa51a;color:var(--color-info)}.badge-launched{background:#2d6a4f1a;color:var(--color-success)}.badge-dismantled{background:#8a8a861a;color:var(--color-text-tertiary)}.badge-pending_pm_review{background:#4a6fa51a;color:var(--color-info)}.card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-5);transition:box-shadow .2s}.card:hover{box-shadow:var(--shadow-md)}.card-static:hover{box-shadow:var(--shadow-sm)}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13px}thead{background:var(--color-bg)}th{font-family:var(--font-heading);font-weight:500;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-tertiary);text-align:left;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border)}td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border-light);color:var(--color-text-secondary);transition:background-color .12s var(--ease-material)}tr:hover td{background:var(--color-bg)}.app-layout{display:flex;height:100vh}.sidebar{width:240px;min-width:240px;background:var(--color-bg-warm);border-right:1px solid var(--color-border-light);display:flex;flex-direction:column;overflow-y:auto}.sidebar-brand{padding:var(--space-5);font-family:var(--font-heading);font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.2em;color:var(--color-text-primary);border-bottom:1px solid var(--color-border-light)}.sidebar-nav{padding:var(--space-4) 0;flex:1}.nav-item{font-family:var(--font-heading);font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-secondary);padding:var(--space-3) var(--space-5);cursor:pointer;border-left:2px solid transparent;transition:all .12s;display:block;text-decoration:none}.nav-item:hover{color:var(--color-text-primary);background:#00000005}.nav-item.active{color:var(--color-text-primary);border-left-color:var(--color-accent);background:#00000005}.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden}.topbar{height:56px;min-height:56px;background:var(--color-surface);box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-5);z-index:2}.topbar-brand{font-family:var(--font-heading);font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.2em;color:var(--color-text-primary)}.topbar-user{font-family:var(--font-body);font-size:13px;color:var(--color-text-secondary);display:flex;align-items:center;gap:var(--space-3)}.topbar-role{font-family:var(--font-heading);font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-tertiary)}.content{flex:1;overflow-y:auto;padding:var(--space-6)}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-5)}.page-title{font-size:20px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--space-4);margin-bottom:var(--space-6)}.stat-card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-5)}.stat-label{font-family:var(--font-heading);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-tertiary);margin-bottom:var(--space-2)}.stat-value{font-family:var(--font-heading);font-size:28px;font-weight:700;color:var(--color-text-primary)}.stats-grid-dash{grid-template-columns:repeat(4,1fr);margin-bottom:var(--space-4)}.stat-card-xl{padding:2rem;min-height:calc(50vh - 120px);display:flex;flex-direction:column;justify-content:space-between;transition:box-shadow var(--motion-micro) var(--ease-material),border-color var(--motion-micro) var(--ease-material)}.stat-card-xl:hover{box-shadow:var(--shadow-md);border-color:var(--color-border)}.stat-card-xl .stat-label{font-size:.75rem;margin-bottom:0}.stat-card-xl .stat-value{font-size:4rem}.site-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-4)}.site-card{cursor:pointer}.site-card-name{font-family:var(--font-heading);font-weight:600;font-size:15px;margin-bottom:var(--space-1)}.site-card-location{font-size:13px;color:var(--color-text-tertiary);margin-bottom:var(--space-3)}.site-card-stats{display:flex;align-items:center;gap:var(--space-4);font-size:13px;color:var(--color-text-secondary)}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:2px}.dot-active{background:var(--color-success)}.dot-warning{background:var(--color-warning)}.dot-expired{background:var(--color-error)}.dot-maintenance{background:var(--color-info)}.surface-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-4)}.slide-panel-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000026;z-index:100;opacity:0;animation:fadeIn .2s forwards}.slide-panel{position:fixed;top:0;right:0;width:480px;max-width:100%;height:100%;background:var(--color-surface);box-shadow:-4px 0 24px #00000014;z-index:101;display:flex;flex-direction:column;overflow:hidden;transform:translate(100%);animation:slideIn .3s forwards}.slide-panel.slide-panel-wide{width:min(80vw,1200px)}.slide-panel.slide-panel-medium{width:max(480px,35vw)}@keyframes fadeIn{to{opacity:1}}@keyframes slideIn{to{transform:translate(0)}}.panel-header{padding:var(--space-5);border-bottom:1px solid var(--color-border-light);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.panel-close{background:none;border:none;font-size:18px;cursor:pointer;color:var(--color-text-tertiary);padding:var(--space-2)}.panel-body{padding:var(--space-5);flex:1;overflow-y:auto;min-height:0}.form-group{margin-bottom:var(--space-4)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.form-actions{display:flex;gap:var(--space-3);margin-top:var(--space-5)}.filter-bar{display:flex;gap:var(--space-3);margin-bottom:var(--space-5);flex-wrap:wrap}.filter-bar select{width:auto;min-width:160px}.empty-state{text-align:center;padding:var(--space-7) var(--space-5)}.empty-state h3{margin-bottom:var(--space-2);color:var(--color-text-secondary)}.empty-state p{color:var(--color-text-tertiary);margin-bottom:var(--space-5);font-size:14px}.skeleton{background:var(--color-bg-warm);border-radius:var(--radius-md);animation:pulse 1.5s infinite}.skeleton-row{height:44px;margin-bottom:var(--space-2)}.skeleton-card{height:120px}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.toast-container{position:fixed;bottom:var(--space-5);right:var(--space-5);z-index:200;display:flex;flex-direction:column;gap:var(--space-2)}.toast{background:var(--color-surface);box-shadow:var(--shadow-md);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5);border-left:3px solid var(--color-error);min-width:300px;max-width:420px;font-size:13px;color:var(--color-text-secondary);opacity:0;animation:toastIn .2s forwards}.toast-success{border-left-color:var(--color-success)}.toast-warning{border-left-color:var(--color-warning)}.toast-info{border-left-color:var(--color-info)}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--color-bg)}.auth-card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-7);width:100%;max-width:400px}.auth-brand{font-family:var(--font-heading);font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:.2em;text-align:center;margin-bottom:var(--space-6);color:var(--color-text-primary)}.auth-link{display:block;text-align:center;margin-top:var(--space-4);font-size:13px;color:var(--color-text-tertiary);cursor:pointer}.auth-link:hover{color:var(--color-text-primary)}.municipality-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--color-bg);padding:var(--space-5)}.municipality-card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-7);width:100%;max-width:520px}.history-item{display:flex;justify-content:space-between;padding:var(--space-3) 0;border-bottom:1px solid var(--color-border-light);font-size:13px}.history-event{color:var(--color-text-secondary)}.history-date{color:var(--color-text-tertiary);font-size:12px}.detail-row{display:flex;justify-content:space-between;padding:var(--space-3) 0;border-bottom:1px solid var(--color-border-light)}.detail-label{font-family:var(--font-heading);font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-tertiary)}.detail-value{font-size:13px;color:var(--color-text-secondary)}.map-placeholder{background:var(--color-bg-warm);border:1px dashed var(--color-border);border-radius:var(--radius-md);padding:var(--space-7);text-align:center;color:var(--color-text-quiet);font-family:var(--font-heading);font-size:13px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:var(--space-5)}.import-zone{border:2px dashed var(--color-border);border-radius:var(--radius-md);padding:var(--space-6);text-align:center;margin-bottom:var(--space-4)}.import-zone input[type=file]{border:none;padding:0;width:auto}.text-muted{color:var(--color-text-tertiary)}.text-small{font-size:12px}.text-center{text-align:center}.mb-4{margin-bottom:var(--space-4)}.mb-5{margin-bottom:var(--space-5)}.mb-6{margin-bottom:var(--space-6)}.mt-4{margin-top:var(--space-4)}.mt-5{margin-top:var(--space-5)}.gap-3{gap:var(--space-3)}.flex{display:flex}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.inline-success{background:#2d6a4f14;border:1px solid rgba(45,106,79,.2);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5);color:var(--color-success);font-size:14px}.sidebar-footer{padding:var(--space-4) var(--space-5);border-top:1px solid var(--color-border-light)}.logout-btn{background:none;border:none;font-family:var(--font-heading);font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-tertiary);cursor:pointer;padding:var(--space-2) 0}.logout-btn:hover{color:var(--color-error)}.tabs{display:flex;gap:0;border-bottom:1px solid var(--color-border);margin-bottom:var(--space-5)}.tab{font-family:var(--font-heading);font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-tertiary);padding:var(--space-3) var(--space-5);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;background:none;border-top:none;border-left:none;border-right:none}.tab.active{color:var(--color-text-primary);border-bottom-color:var(--color-accent)}.import-results{padding:var(--space-4);background:var(--color-bg);border-radius:var(--radius-md);font-size:13px}.import-results .success{color:var(--color-success)}.import-results .errors{color:var(--color-error);margin-top:var(--space-2)}.fade-in-up{animation:fadeInUp var(--motion-element) var(--ease-reveal) both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.stagger-children>*{animation:fadeInUp var(--motion-element) var(--ease-reveal) both}.stagger-children>*:nth-child(1){animation-delay:0ms}.stagger-children>*:nth-child(2){animation-delay:40ms}.stagger-children>*:nth-child(3){animation-delay:80ms}.stagger-children>*:nth-child(4){animation-delay:.12s}.stagger-children>*:nth-child(5){animation-delay:.16s}.stagger-children>*:nth-child(6){animation-delay:.2s}.panel-enter{animation:panelSlideIn var(--motion-section) var(--ease-reveal) both}@keyframes panelSlideIn{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:translate(0)}}.empty-state-texture{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E")}.surface-grid-view{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}@media(max-width:1024px){.surface-grid-view{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.surface-grid-view{grid-template-columns:1fr}}.surface-grid-card{background:var(--color-surface);border:1px solid var(--color-border-light);border-radius:var(--radius-md);overflow:hidden;cursor:pointer;box-shadow:var(--shadow-sm);transition:box-shadow var(--motion-element) var(--ease-material)}.surface-grid-card:hover{box-shadow:var(--shadow-md)}.surface-grid-thumb{aspect-ratio:16/10;overflow:hidden;background:var(--color-bg-warm)}.surface-grid-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .2s var(--ease-material)}.surface-grid-card:hover .surface-grid-thumb img{transform:scale(1.05)}.surface-grid-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-size:28px;font-weight:600;color:var(--color-text-quiet);text-transform:uppercase}.surface-grid-info{padding:var(--space-3) var(--space-4) var(--space-4)}.surface-grid-name{font-family:var(--font-heading);font-weight:500;font-size:14px;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px}.surface-grid-site{font-size:13px;color:var(--color-text-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:var(--space-2)}.view-toggle{display:inline-flex;gap:2px;background:var(--color-bg-warm);border-radius:var(--radius-md);padding:2px}.view-toggle button{width:32px;height:32px;border:none;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;background:transparent;color:var(--color-text-tertiary);transition:all var(--motion-micro) var(--ease-material)}.view-toggle button.active{background:var(--color-surface);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.welcome-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;background:#0006;display:flex;align-items:center;justify-content:center;transition:opacity .4s var(--ease-exit)}.welcome-overlay.fading{opacity:0}.welcome-card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--space-7);max-width:480px;width:90%;text-align:center}.pending-screen{min-height:100vh;display:flex;background:var(--color-bg)}.pending-left{flex:1;display:flex;flex-direction:column;justify-content:center;padding:var(--space-7);max-width:640px;margin:0 auto}.pending-right{flex:1;background:var(--color-bg-warm);display:flex;align-items:center;justify-content:center;border-left:1px solid var(--color-border-light)}@media(max-width:900px){.pending-screen{flex-direction:column}.pending-right{display:none}.pending-left{max-width:100%}}.pending-progress{display:flex;flex-direction:column;gap:var(--space-4);margin:var(--space-6) 0}.pending-step{display:flex;align-items:center;gap:var(--space-3);font-family:var(--font-heading);font-size:14px;font-weight:500;color:var(--color-text-tertiary)}.pending-step.complete{color:var(--color-success)}.pending-step.active{color:var(--color-text-primary)}.pending-dot{width:10px;height:10px;border-radius:50%;background:var(--color-border);flex-shrink:0}.pending-step.complete .pending-dot{background:var(--color-success)}.pending-step.active .pending-dot{background:var(--color-accent);animation:pulse 1.5s infinite}