:root{--bg-primary: #f4f8f7;--bg-primary-rgb: 244, 248, 247;--bg-secondary: #ffffff;--bg-secondary-rgb: 255, 255, 255;--bg-tertiary: #eef5f4;--bg-tertiary-rgb: 238, 245, 244;--bg-overlay: rgba(255, 255, 255, .85);--surface-canvas: var(--bg-primary);--surface-default: var(--bg-secondary);--surface-elevated: var(--bg-secondary);--surface-subtle: var(--bg-tertiary);--surface-hover: #e7f1ef;--surface-selected: #dff2ee;--surface-0: var(--bg-primary);--surface-1: var(--bg-secondary);--surface-2: var(--bg-tertiary);--on-surface: var(--text-primary);--on-surface-muted: var(--text-secondary);--glass-bg: rgba(255, 255, 255, .75);--glass-border: rgba(15, 118, 110, .13);--glass-shadow: 0 12px 36px rgba(15, 42, 46, .1);--text-primary: #0f2a2e;--text-secondary: #526b70;--text-muted: #70878b;--border-color: #d5e3e1;--border-light: #e5eeec;--border-strong: #b7cfcc;--accent-primary: #0f766e;--accent-secondary: #0d9488;--accent-success: #15803d;--accent-warning: #b45309;--accent-warning-rgb: 180, 83, 9;--accent-danger: #b91c1c;--accent-info: #2563eb;--brand-orange: #ff6b00;--accent-primary-hover: #0b5f59;--state-success-bg: #e9f8ef;--state-success-text: #137a47;--state-warning-bg: #fff5d7;--state-warning-text: #885f00;--state-info-bg: #e8f3fb;--state-info-text: #155a8a;--state-danger-bg: #fdecef;--state-danger-text: #a12b37;--state-neutral-bg: #eef1f5;--state-neutral-text: #596579;--gradient-hero: linear-gradient(135deg, #0f766e 0%, #0d9488 100%);--gradient-card: linear-gradient(145deg, #ffffff 0%, #f5faf9 100%);--gradient-button: linear-gradient(135deg, #0f766e 0%, #0d9488 100%);--shadow-sm: 0 2px 8px rgba(15, 42, 46, .06);--shadow-md: 0 8px 24px rgba(15, 42, 46, .09);--shadow-lg: 0 16px 42px rgba(15, 42, 46, .13);--shadow-xl: 0 24px 70px rgba(15, 42, 46, .17);--transition-fast: .2s cubic-bezier(.4, 0, .2, 1);--transition-base: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--font-base: "DM Sans", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 22px;--z-map: 0;--z-map-control: 100;--z-sidebar: 900;--z-navbar: 1000;--z-popover: 1100;--z-drawer: 1800;--z-modal: 2200;--z-critical: 3200;--z-toast: 4000;--bs-body-bg: var(--surface-canvas);--bs-body-color: var(--on-surface);--bs-secondary-bg: var(--surface-default);--bs-tertiary-bg: var(--surface-subtle);--bs-border-color: var(--border-color);--bs-emphasis-color: var(--on-surface);--bs-secondary-color: var(--on-surface-muted);--bs-card-bg: var(--surface-elevated);--bs-modal-bg: var(--surface-elevated);--touch-target-min: 44px;--touch-target-lg: 48px;--mobile-navbar-height: 60px;--mobile-bottom-nav-height: 56px;--mobile-padding: 12px;--mobile-gap: 8px;--mobile-sidebar-width: 100%;--mobile-max-content-width: 100vw;--font-mobile-base: 16px;--font-mobile-sm: 14px;--font-mobile-xs: 12px;--font-mobile-h1: 24px;--font-mobile-h2: 20px;--font-mobile-h3: 18px}[data-theme=dark]{--bg-primary: #071a1c;--bg-primary-rgb: 7, 26, 28;--bg-secondary: #0b2427;--bg-secondary-rgb: 11, 36, 39;--bg-tertiary: #123034;--bg-tertiary-rgb: 18, 48, 52;--bg-overlay: rgba(7, 26, 28, .86);--glass-bg: rgba(11, 36, 39, .88);--glass-border: rgba(167, 193, 190, .18);--glass-shadow: 0 18px 48px rgba(0, 0, 0, .32);--text-primary: #f0fdfa;--text-secondary: #a7c1be;--text-muted: #83a09d;--border-color: #29494c;--border-light: #1d3b3e;--border-strong: #3b6265;--accent-primary: #2dd4bf;--accent-secondary: #5eead4;--accent-info: #60a5fa;--accent-success: #4ade80;--accent-warning: #fbbf24;--accent-warning-rgb: 251, 191, 36;--accent-danger: #fb7185;--brand-orange: #ff7a1a;--accent-primary-hover: #5eead4;--surface-hover: #17383b;--surface-selected: #19433f;--state-success-bg: #123d35;--state-success-text: #86efac;--state-warning-bg: #4a3710;--state-warning-text: #fcd34d;--state-info-bg: #173653;--state-info-text: #93c5fd;--state-danger-bg: #4b202b;--state-danger-text: #fda4af;--state-neutral-bg: #293845;--state-neutral-text: #c0ceda;--shadow-sm: 0 2px 10px rgba(0, 0, 0, .18);--shadow-md: 0 10px 28px rgba(0, 0, 0, .24);--shadow-lg: 0 18px 48px rgba(0, 0, 0, .3);--shadow-xl: 0 26px 72px rgba(0, 0, 0, .38);--gradient-card: linear-gradient(145deg, #0b2427 0%, #071a1c 100%);--gradient-button: linear-gradient(135deg, #0f766e 0%, #0d9488 100%)}:root{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}[data-theme=dark]{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-base)}html[data-theme=dark]{color-scheme:dark}html[data-theme=light]{color-scheme:light}.bg-light,.bg-white,.table-light,.alert-light{--bs-table-bg: var(--surface-subtle);--bs-table-color: var(--on-surface);background-color:var(--surface-subtle)!important;color:var(--on-surface)!important;border-color:var(--border-color)!important}.text-dark{color:var(--on-surface)!important}:where(button,a,input,select,textarea,[role=button]):focus-visible{outline:3px solid color-mix(in srgb,var(--accent-primary) 38%,transparent);outline-offset:3px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--accent-primary);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--accent-secondary)}::selection{background:var(--accent-primary);color:#fff}::-moz-selection{background:var(--accent-primary);color:#fff}body.theme-switching,body.theme-switching *{transition:none!important}body:not(.theme-switching){transition:background-color .3s ease,color .3s ease}body:not(.theme-switching) :where(.card,.btn,.modal-content,.dropdown-menu,.top-navbar,.station-list-sidebar,.detail-sidebar,.sensor-item,input,select,textarea,button,a){transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}*{box-sizing:border-box}html,body{margin:0;padding:0;overflow-x:hidden}.authz-expired-dialog{position:fixed;inset:0;z-index:var(--z-critical);display:grid;place-items:center;padding:24px;background:#03191bc2;backdrop-filter:blur(8px)}.authz-expired-card{width:min(100%,440px);padding:32px;border:1px solid color-mix(in srgb,var(--border-color, #b7d3d0) 70%,transparent);border-radius:16px;background:var(--surface-elevated, #f8fffe);color:var(--text-primary, #123638);box-shadow:0 24px 72px #00000047}.authz-expired-card>i{display:block;margin-bottom:16px;color:var(--brand-orange, #ed7d32);font-size:2rem}.authz-expired-card h2{margin:0 0 8px;font-size:1.25rem}.authz-expired-card p{margin:0 0 20px;line-height:1.55}html[data-authz-lock=expired] [data-private-content]{pointer-events:none;user-select:none}.btn{border-radius:10px;font-weight:600;padding:10px 24px;transition:all var(--transition-fast);position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#fff3;transform:translate(-50%,-50%);transition:width .6s,height .6s}.btn:active:before{width:300px;height:300px}.btn-primary{background:var(--gradient-button);border:none;box-shadow:0 7px 18px #0f766e38}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 24px #0f766e47}.btn-outline-light{border-color:var(--border-color);color:var(--text-primary)}.btn-outline-light:hover{background:var(--bg-tertiary);border-color:var(--accent-primary);color:var(--accent-primary)}.theme-toggle{position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;background:var(--accent-primary);border:none;box-shadow:var(--shadow-lg);cursor:pointer;display:none!important;align-items:center;justify-content:center;font-size:1.5rem;color:#fff;z-index:var(--z-toast);transition:all var(--transition-base)}.theme-toggle:hover{transform:scale(1.15) rotate(180deg);box-shadow:0 12px 32px #4aacfe80}.theme-toggle:active{transform:scale(.95)}.theme-toggle i{transition:transform var(--transition-base)}.card{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:16px;transition:all var(--transition-base)}.card:hover{border-color:var(--border-light);box-shadow:var(--shadow-md)}.form-control,.form-select{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-primary);border-radius:8px;padding:10px 16px;transition:all var(--transition-fast)}.form-control:focus,.form-select:focus{background:var(--bg-tertiary);border-color:var(--accent-primary);color:var(--text-primary);box-shadow:0 0 0 4px #4aacfe26}.form-control::placeholder{color:var(--text-muted)}.badge{padding:6px 12px;border-radius:6px;font-weight:600;font-size:.75rem}.alert{border-radius:12px;border:1px solid;backdrop-filter:blur(10px)}.alert-success{background:#51cf661a;border-color:#51cf664d;color:var(--accent-success)}.alert-warning{background:#ffd43b1a;border-color:#ffd43b4d;color:var(--accent-warning)}.alert-danger{background:#fa52521a;border-color:#fa52524d;color:var(--accent-danger)}.spinner-border{border-color:var(--border-color);border-right-color:var(--accent-primary)}.skeleton{background:linear-gradient(90deg,var(--bg-tertiary) 25%,var(--bg-secondary) 50%,var(--bg-tertiary) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:8px}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.tooltip{--bs-tooltip-bg: var(--bg-tertiary);--bs-tooltip-color: var(--text-primary)}.modal-content{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px}.modal-header,.modal-footer{border-color:var(--border-color)}.dropdown-menu{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;box-shadow:var(--shadow-lg)}.dropdown-item{color:var(--text-primary);transition:all var(--transition-fast)}.dropdown-item:hover{background:var(--bg-tertiary);color:var(--accent-primary)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-primary)}[data-theme=light] .form-control,[data-theme=light] .form-select{background:#fff}[data-theme=light] .card{box-shadow:var(--shadow-sm)}[data-theme=light] .theme-toggle{background:var(--accent-secondary)}button,[role=button],a.button{min-width:44px;min-height:44px}.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:10px 16px}.btn-sm{min-height:44px;padding:8px 12px}.btn-lg{min-height:48px;padding:12px 24px}.btn-link,.btn-icon,[class*=btn-] .icon{min-width:44px;min-height:44px;padding:10px;display:flex;align-items:center;justify-content:center}.form-control,.form-select,input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=time],textarea,select{min-height:44px;font-size:16px;padding:10px 12px;border-radius:8px}input[type=checkbox],input[type=radio]{width:18px;height:18px;min-width:18px;min-height:18px;flex:0 0 18px;cursor:pointer;accent-color:var(--accent-primary)}label{cursor:pointer;display:flex;align-items:center;gap:8px;min-height:44px;user-select:none}a,button,[role=button]{-webkit-tap-highlight-color:transparent;padding:12px}@media(max-width:768px){input,textarea,select{font-size:16px!important}}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}#app-root{min-height:100vh}html[data-app-view=login] body{overflow:auto}html[data-app-view=map] body,html[data-app-view=admin] body{overflow:hidden}.route-loading{min-height:100vh;display:grid;place-items:center;background:var(--bg-primary, #020617);color:var(--text-primary, #f8fafc);font-weight:700}.route-error{min-height:100svh;display:grid;place-content:center;gap:1rem;padding:2rem;text-align:center;background:var(--bg-primary);color:var(--text-primary)}.route-error button{min-height:44px;border:0;border-radius:var(--radius-md);background:var(--accent-primary);color:#001014;font-weight:700}.route-loading{contain:layout paint}.station-list-content,.admin-main,.tab-content{overscroll-behavior:contain}body .station-item,body .sensor-item,body .admin-sidebar .nav-link,body .sidebar-close-btn,body .sidebar-close-tab,body #admin-nav-btn{transition-property:transform,opacity,color,background-color,border-color,box-shadow}.station-item,.sensor-item{contain:layout paint style}.station-virtual-list{position:relative;width:100%}.station-virtual-window{position:absolute;inset:0 0 auto;padding:0;will-change:transform}.station-item.station-item-react{width:100%;height:76px;margin:0 0 8px;color:var(--text-primary);text-align:left;flex-direction:row;align-items:center;justify-content:space-between}.station-item-copy{min-width:0;display:flex;flex-direction:column}.station-item-copy strong,.station-item-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.station-item-copy small{color:var(--text-secondary)}.station-list-content:not(.is-scrolling) .station-item,.sensor-item,.detail-sidebar,.station-list-sidebar{backface-visibility:hidden}body.map-is-moving .station-list-sidebar,body.map-is-moving .detail-sidebar,.station-list-content.is-scrolling .station-item{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
