@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=JetBrains+Mono:wght@300;400;500;600&family=Syne:wght@400;500;600;700;800&display=swap");:root{--bg-base:#0e0f11;--bg-surface:#16181c;--bg-elevated:#1e2126;--bg-border:#2a2d35;--text-primary:#e8e9ec;--text-secondary:#8b8f9a;--text-muted:#4a4e5a;--accent:#d4a843;--accent-dim:rgba(212,168,67,0.15);--accent-border:rgba(212,168,67,0.3);--green:#4caf7d;--green-dim:rgba(76,175,125,0.15);--red:#e05a5a;--red-dim:rgba(224,90,90,0.15);--blue:#5a8fe0;--font-display:"DM Serif Display",Georgia,serif;--font-ui:"Syne",system-ui,sans-serif;--font-mono:"JetBrains Mono","Courier New",monospace;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:40px;--space-2xl:64px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--ease:cubic-bezier(0.16,1,0.3,1);--duration:200ms}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--bg-base);color:var(--text-primary);font-family:var(--font-ui);font-size:14px;line-height:1.6;min-height:100vh}a{color:inherit;text-decoration:none}button{cursor:pointer;border:none;background:none}button,input,select{font-family:inherit}.layout{display:flex;min-height:100vh}.sidebar{width:220px;flex-shrink:0;background:var(--bg-surface);border-right:1px solid var(--bg-border);display:flex;flex-direction:column;padding:var(--space-xl) 0;position:fixed;top:0;left:0;height:100vh;z-index:100}.sidebar__logo{padding:0 var(--space-lg) var(--space-xl);border-bottom:1px solid var(--bg-border);margin-bottom:var(--space-lg)}.sidebar__logo-text{font-family:var(--font-display);font-size:20px;color:var(--text-primary);line-height:1.2}.sidebar__logo-sub{font-family:var(--font-mono);font-size:10px;color:var(--accent);letter-spacing:.12em;text-transform:uppercase;margin-top:4px}.sidebar__nav{flex:1 1;display:flex;flex-direction:column;gap:2px;padding:0 var(--space-sm)}.nav-item{display:flex;align-items:center;gap:var(--space-sm);padding:10px var(--space-md);border-radius:var(--radius-md);font-size:13px;font-weight:500;color:var(--text-secondary);transition:all var(--duration) var(--ease);letter-spacing:.02em}.nav-item:hover{background:var(--bg-elevated);color:var(--text-primary)}.nav-item.active{background:var(--accent-dim);color:var(--accent);border:1px solid var(--accent-border)}.nav-item__icon{font-size:16px;width:20px;text-align:center;flex-shrink:0}.main-content{margin-left:220px;flex:1 1;padding:var(--space-xl);max-width:1200px}.page-header{margin-bottom:var(--space-xl)}.page-header h1{font-family:var(--font-display);font-size:32px;font-weight:400;color:var(--text-primary);line-height:1.2;margin-bottom:var(--space-xs)}.page-header__meta{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-gap:var(--space-md);gap:var(--space-md);margin-bottom:var(--space-xl)}.stat-card{background:var(--bg-surface);border:1px solid var(--bg-border);border-radius:var(--radius-lg);padding:var(--space-lg);transition:border-color var(--duration) var(--ease);position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent);opacity:0;transition:opacity var(--duration) var(--ease)}.stat-card:hover{border-color:var(--accent-border)}.stat-card:hover:before{opacity:1}.stat-card__label{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:var(--space-sm)}.stat-card__value{font-family:var(--font-display);font-size:36px;color:var(--text-primary);line-height:1;margin-bottom:var(--space-xs)}.stat-card__sub{font-family:var(--font-mono);font-size:11px;color:var(--text-secondary)}.card{background:var(--bg-surface);border:1px solid var(--bg-border);border-radius:var(--radius-lg);padding:var(--space-lg)}.card,.card__header{margin-bottom:var(--space-lg)}.card__header{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--space-md);border-bottom:1px solid var(--bg-border)}.card__title{font-family:var(--font-ui);font-size:13px;font-weight:600;color:var(--text-secondary);letter-spacing:.06em;text-transform:uppercase}.period-filter{display:flex;gap:4px;background:var(--bg-elevated);border:1px solid var(--bg-border);border-radius:var(--radius-md);padding:3px}.period-btn{font-family:var(--font-mono);font-size:11px;padding:5px 12px;border-radius:var(--radius-sm);color:var(--text-muted);font-weight:500;letter-spacing:.06em;transition:all var(--duration) var(--ease)}.period-btn:hover{color:var(--text-secondary)}.period-btn.active{background:var(--accent);color:var(--bg-base)}.data-table{width:100%;border-collapse:collapse}.data-table th{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;text-align:left;padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--bg-border);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.data-table th:hover{color:var(--text-secondary)}.data-table td{padding:12px var(--space-md);border-bottom:1px solid var(--bg-elevated);font-size:13px;color:var(--text-primary)}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background:var(--bg-elevated)}.cost,.mono{font-family:var(--font-mono);font-size:12px}.cost{color:var(--accent);font-weight:500}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-base)}.login-card{background:var(--bg-surface);border:1px solid var(--bg-border);border-radius:var(--radius-lg);padding:var(--space-2xl);width:100%;max-width:380px}.login-card h1{font-family:var(--font-display);font-size:28px;font-weight:400;color:var(--text-primary);margin-bottom:4px}.login-card__sub{font-family:var(--font-mono);font-size:11px;color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin-bottom:var(--space-xl)}.form-group{margin-bottom:var(--space-md)}.form-label{display:block;font-size:10px;color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:var(--space-xs)}.form-input,.form-label{font-family:var(--font-mono)}.form-input{width:100%;background:var(--bg-elevated);border:1px solid var(--bg-border);border-radius:var(--radius-md);color:var(--text-primary);font-size:14px;padding:10px var(--space-md);outline:none;transition:border-color var(--duration) var(--ease)}.form-input:focus{border-color:var(--accent-border);box-shadow:0 0 0 3px var(--accent-dim)}.btn-primary{width:100%;background:var(--accent);color:var(--bg-base);font-family:var(--font-ui);font-size:14px;font-weight:600;padding:12px var(--space-lg);border-radius:var(--radius-md);margin-top:var(--space-lg);transition:opacity var(--duration) var(--ease);letter-spacing:.03em}.btn-primary:hover{opacity:.88}.error-msg{color:var(--red);font-size:11px;margin-top:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--red-dim);border-radius:var(--radius-sm);border:1px solid rgba(224,90,90,.3)}.error-msg,.loading{font-family:var(--font-mono)}.loading{display:flex;align-items:center;gap:var(--space-sm);color:var(--text-muted);font-size:12px;padding:var(--space-xl)}.spinner{width:16px;height:16px;border:2px solid var(--bg-border);border-top-color:var(--accent);border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.empty-state{text-align:center;padding:var(--space-2xl);color:var(--text-muted);font-size:12px}.empty-state,.tag{font-family:var(--font-mono)}.tag{display:inline-flex;align-items:center;gap:4px;background:var(--bg-elevated);border:1px solid var(--bg-border);border-radius:var(--radius-sm);padding:3px 8px;font-size:11px;color:var(--text-secondary)}.breakdown-list{display:flex;flex-direction:column;gap:var(--space-sm)}.breakdown-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--bg-elevated)}.breakdown-row:last-child{border-bottom:none}.breakdown-bar-wrap{flex:1 1;margin:0 var(--space-md);height:3px;background:var(--bg-elevated);border-radius:2px;overflow:hidden}.breakdown-bar{height:100%;background:var(--accent);border-radius:2px;transition:width .6s var(--ease)}.search-input{background:var(--bg-elevated);border:1px solid var(--bg-border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-mono);font-size:13px;padding:8px var(--space-md);outline:none;width:260px;transition:border-color var(--duration) var(--ease)}.search-input:focus{border-color:var(--accent-border)}.search-input::placeholder{color:var(--text-muted)}.chart-wrap{position:relative;height:220px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:var(--bg-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}