:root{font-family:Noto Sans KR,system-ui,sans-serif;color-scheme:light;--ink-primary: #1f2733;--ink-secondary: #5b6472;--ink-muted: #8b93a1;--surface: #ffffff;--surface-app: #fafafa;--border: #e5e8ee;--brand-navy: #1d5c98;--brand-blue: #2f6fed;--brand-green: #22a06b;--brand-orange: #f59e0b;--logout-bg: #121212;--logout-bg-hover: #2b2b2b;--trend-up: #006cc9;--trend-down: #f33a3d;--card-shadow-sm: 2px 2px 10px 0 rgba(26, 26, 26, .08);--card-shadow: 2px 2px 8px 0 rgba(0, 0, 0, .06)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--surface-app);color:var(--ink-primary)}a{color:inherit;text-decoration:none}.app-shell{min-height:100vh;display:flex;flex-direction:column}.app-header{height:60px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:var(--surface);border-bottom:1px solid var(--border)}.app-header__brand{display:flex;align-items:center;gap:10px}.app-header__logo{display:block;width:58px;height:31px}.app-header__title{font-size:16px;font-weight:500;color:var(--ink-primary)}.app-header__right{display:flex;align-items:center;gap:16px}.app-header__user{font-size:13px;color:var(--ink-secondary)}.app-header__logout{border:none;background:var(--logout-bg);color:#fff;font-size:12px;font-weight:500;padding:8px 14px;border-radius:999px;cursor:pointer}.app-header__logout:hover{background:var(--logout-bg-hover)}.app-body{flex:1;display:flex;min-height:0}.app-sidebar{width:220px;flex-shrink:0;background:var(--brand-navy);padding:24px 0 20px}.app-sidebar__title{margin:0 0 18px;padding:0 24px;font-size:18px;font-weight:600;color:#fff}.app-sidebar nav ul{list-style:none;margin:0;padding:0}.app-sidebar nav a{display:block;padding:13px 24px;font-size:16px;font-weight:400;color:#ffffff80;border-left:3px solid transparent}.app-sidebar nav a:hover{background:#ffffff0f}.app-sidebar nav a.is-active{background:#ffffff1f;border-left-color:var(--brand-blue);color:#fff}.app-content{flex:1;padding:24px;overflow-x:auto}.dashboard{display:flex;flex-direction:column;gap:20px}.dashboard__stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}.dashboard__grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:20px;align-items:stretch}.dashboard__card{background:var(--surface);border-radius:8px;box-shadow:var(--card-shadow);padding:20px 24px}.dashboard__card--center-body{display:flex;flex-direction:column;justify-content:center}.dashboard__card--chart-fixed{height:292px;display:flex;flex-direction:column;overflow:hidden}.dashboard__card--chart-fixed .trend-chart,.dashboard__card--chart-fixed .hourly-chart{flex:1;min-height:0;display:flex;flex-direction:column}.dashboard__card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-shrink:0}.dashboard__card-header h2{font-size:15px;font-weight:700;margin:0;color:var(--ink-primary)}.stat-card{background:var(--surface);border-radius:8px;box-shadow:var(--card-shadow-sm);padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:14px}.stat-card__left{display:flex;align-items:center;gap:14px;min-width:0}.stat-card__icon{width:42px;height:42px;border-radius:50%;background:var(--surface-app);color:var(--ink-secondary);display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-card__label{font-size:16px;color:var(--ink-primary);white-space:nowrap}.stat-card__value{flex-shrink:0;font-size:24px;font-weight:700;color:var(--ink-primary)}.stat-card__unit{font-size:13px;font-weight:500;color:var(--ink-secondary);margin-left:4px}.range-toggle{display:inline-flex;gap:4px}.range-toggle button{border:1px solid rgba(136,138,141,.3);background:#fff;font-size:13px;font-weight:500;color:#888a8d;padding:6px 14px;border-radius:999px;cursor:pointer}.range-toggle button.is-active{border-color:var(--brand-navy);background:var(--brand-navy);color:#fff}.trend-chart__svg-wrap,.hourly-chart__svg-wrap{position:relative}.dashboard__card--chart-fixed .trend-chart__svg-wrap,.dashboard__card--chart-fixed .hourly-chart__svg-wrap{flex:1;min-height:0}.trend-chart__svg,.hourly-chart__svg{width:100%;height:auto;display:block;overflow:visible}.dashboard__card--chart-fixed .trend-chart__svg,.dashboard__card--chart-fixed .hourly-chart__svg{height:100%}.trend-chart__grid-h{stroke:var(--border);stroke-width:1}.trend-chart__grid-v{stroke:var(--border);stroke-width:1;stroke-dasharray:3 4}.trend-chart__crosshair{stroke:var(--ink-muted);stroke-width:1;stroke-dasharray:3 4}.trend-chart__axis-label{font-size:11px;fill:var(--ink-muted)}.trend-chart__tooltip{position:absolute;transform:translate(-50%,-100%) translateY(-10px);background:var(--ink-primary);color:#fff;font-size:12px;padding:8px 10px;border-radius:8px;pointer-events:none;white-space:nowrap;z-index:2;box-shadow:0 4px 12px #0000002e}.trend-chart__tooltip-title{font-weight:700;margin-bottom:4px}.trend-chart__tooltip-row{display:flex;align-items:center;gap:6px}.trend-chart__footer{display:flex;align-items:center;justify-content:space-between;margin-top:8px;flex-shrink:0}.trend-chart__legend{display:flex;gap:18px}.trend-chart__legend-item{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ink-secondary)}.trend-chart__legend-dot{width:9px;height:9px;border-radius:50%;display:inline-block}.trend-chart__table-toggle{border:none;background:none;color:var(--brand-blue);font-size:12px;font-weight:600;cursor:pointer;padding:0}.trend-chart__table-wrap{overflow-y:auto}.dashboard__card--chart-fixed .trend-chart__table-wrap{flex:1;min-height:0}.trend-chart__table{width:100%;margin-top:14px;border-collapse:collapse;font-size:13px}.trend-chart__table th,.trend-chart__table td{border-bottom:1px solid var(--border);padding:6px 8px;text-align:right}.trend-chart__table th:first-child,.trend-chart__table td:first-child{text-align:left;color:var(--ink-secondary)}.source-breakdown{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}.source-breakdown__row{display:grid;grid-template-columns:70px 1fr 110px;align-items:center;gap:12px}.source-breakdown__label{font-size:13px;color:var(--ink-secondary)}.source-breakdown__track{height:10px;border-radius:999px;background:var(--surface-app);overflow:hidden;display:block}.source-breakdown__fill{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#f59e0b,#fbbf24)}.source-breakdown__value{font-size:13px;font-weight:600;color:var(--ink-primary);text-align:right}.notice-table{width:100%;border-collapse:collapse;font-size:13px}.notice-table th{text-align:left;color:var(--ink-muted);font-weight:600;padding:8px 6px;border-bottom:1px solid var(--border)}.notice-table td{padding:12px 6px;border-bottom:1px solid var(--border);color:var(--ink-primary)}.notice-table__title{max-width:260px}.notice-table__time{color:var(--ink-secondary);white-space:nowrap}.notice-table__status{color:#006cc9;font-weight:600}.badge{display:inline-block;font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px}.badge--blue{background:#e5f0fa;color:#006cc9}.badge--green{background:#ebf9f2;color:#1eaa66}.badge--purple{background:#f2effc;color:#3e2ba6}.badge--red{background:#feefef;color:#fa342b}.service-usage{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:12px}.service-usage__tile{text-align:center}.service-usage__tile:not(:first-child){border-left:1px solid var(--border)}.service-usage__icon{color:var(--brand-blue);display:flex;justify-content:center;margin-bottom:8px}.service-usage__label{font-size:12px;color:var(--ink-secondary);margin-bottom:6px}.service-usage__count{font-size:16px;font-weight:700;color:var(--ink-primary)}.service-usage__unit{font-size:11px;font-weight:500;color:var(--ink-secondary);margin-left:2px}.service-usage__delta{margin-top:4px;font-size:11px;font-weight:600;display:inline-flex;align-items:center;gap:2px}.service-usage__delta.is-up{color:var(--trend-up)}.service-usage__delta.is-down{color:var(--trend-down)}