:root {
    --bg-dark: #09090b;
    --bg-card: #111113;
    --bg-card-2: #1a1a1d;
    --border: rgba(255, 255, 255, .08);
    --text-muted: #a1a1aa;
    --accent: #49e3c3;
}

body { background: var(--bg-dark); color: #e4e4e7; min-height: 100vh; }

.page-header {
    background: var(--bg-dark);
    border-bottom: 1px solid var(--border);
    padding: 2rem 0 1.25rem;
}
.page-header h1 { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.35; }
.page-header .sub { color: var(--text-muted); font-size: .88rem; }
.ai-back { color: var(--text-muted); font-size: .82rem; text-decoration: none; }
.ai-back:hover { color: #e4e4e7; }
.ai-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; color: var(--text-muted); font-size: .82rem; }

.card-dark { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; }
.section-label {
    font-size: .92rem; font-weight: 600; letter-spacing: -0.01em; color: #e4e4e7;
    padding-bottom: .7rem; border-bottom: 1px solid var(--border); margin-bottom: 1rem;
}
.section-label .desc { display: block; font-size: .76rem; font-weight: 400; color: var(--text-muted); margin-top: .2rem; }
.footnote { color: #71717a; font-size: .74rem; line-height: 1.6; }

.demo-badge {
    font-size: .68rem; font-weight: 700; letter-spacing: .06em;
    background: rgba(255, 255, 255, .06); color: #a1a1aa;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 6px; padding: 2px 8px; vertical-align: middle;
}

.stat-box {
    background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px;
    padding: .85rem 1rem; text-align: left; height: 100%;
    display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 2px;
}
.stat-box .stat-val { font-size: 1.4rem; font-weight: 700; color: #e4e4e7; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; line-height: 1.25; }
.stat-box .stat-lbl { font-size: .74rem; color: var(--text-muted); }

.range-toggle { display: inline-flex; gap: .2rem; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 3px; }
.range-toggle a { font-size: .8rem; font-weight: 600; color: var(--text-muted); padding: .28rem .85rem; border-radius: 6px; text-decoration: none; transition: all .15s; }
.range-toggle a.active { background: var(--bg-card-2); color: var(--accent); }
.range-toggle a:hover:not(.active) { color: #e4e4e7; }

.ai-btn {
    display: inline-flex; align-items: center; gap: .45rem;
    font-size: .8rem; font-weight: 600; color: #e4e4e7;
    background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px;
    padding: .4rem .9rem; text-decoration: none; transition: border-color .15s, background .15s;
}
.ai-btn:hover { color: #e4e4e7; border-color: rgba(255, 255, 255, .22); background: var(--bg-card-2); }
.ai-btn i { font-size: .78rem; }
.ai-btn .ic-accent { color: var(--accent); }
.ai-btn .ic-warn { color: #fbbf24; }

.ag-search .form-control {
    background: var(--bg-card); border: 1px solid var(--border); color: #e4e4e7;
    border-radius: 8px 0 0 8px; font-size: .9rem;
}
.ag-search .form-control:focus {
    border-color: rgba(73, 227, 195, .5);
    box-shadow: 0 0 0 3px rgba(73, 227, 195, .12);
    background: var(--bg-card); color: #e4e4e7;
}
.ag-search .form-control::placeholder { color: #71717a; }
.ag-search .btn {
    background: var(--accent); color: #05161f; font-weight: 700; border: none;
    border-radius: 0 8px 8px 0; padding-inline: 1.25rem;
}

.ag-row, .t-row {
    display: flex; align-items: center; gap: 1rem;
    padding: .65rem .5rem; border-top: 1px solid var(--border);
    background: transparent; border-radius: 0;
    text-decoration: none; color: inherit; transition: background .15s;
    margin: 0;
}
.ag-row:first-of-type, .t-row:first-of-type { border-top: none; }
.ag-row:hover, .t-row:hover { background: rgba(73, 227, 195, .05); color: inherit; }
.ag-rank, .t-rank { min-width: 30px; text-align: right; font-size: .78rem; font-weight: 600; color: #71717a; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.ag-name { font-size: .92rem; font-weight: 600; color: #e4e4e7; flex-grow: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ag-name .cd { font-size: .72rem; font-weight: 400; color: #71717a; margin-left: 6px; }
.ag-bar { width: 110px; height: 6px; background: var(--bg-card-2); border-radius: 3px; overflow: hidden; flex-shrink: 0; }
.ag-bar span { display: block; height: 100%; background: rgba(73, 227, 195, .55); border-radius: 3px; }
.ag-cnt { min-width: 74px; text-align: right; font-size: .85rem; color: #e4e4e7; font-weight: 700; flex-shrink: 0; font-variant-numeric: tabular-nums; }
.ag-last { min-width: 110px; text-align: right; font-size: .75rem; color: var(--text-muted); flex-shrink: 0; font-variant-numeric: tabular-nums; }

.t-name { flex-grow: 1; min-width: 0; font-size: .9rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.t-bar { width: 130px; height: 6px; background: var(--bg-card-2); border-radius: 3px; overflow: hidden; flex-shrink: 0; }
.t-fill { height: 100%; background: #f59e0b; border-radius: 3px; }
.t-rate { min-width: 48px; text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.t-meta { min-width: 190px; text-align: right; color: var(--text-muted); font-size: .76rem; font-variant-numeric: tabular-nums; flex-shrink: 0; }

.vbar-chart { display: flex; align-items: flex-end; gap: 3px; height: 130px; }
.vbar { flex: 1 1 0; min-width: 3px; display: flex; flex-direction: column; justify-content: flex-end; height: 100%; }
.vbar .bar { background: rgba(73, 227, 195, .55); border-radius: 3px 3px 0 0; min-height: 2px; transition: background .15s; }
.vbar:hover .bar { background: var(--accent); }
.vbar-labels { display: flex; gap: 3px; margin-top: 4px; }
.vbar-labels span { flex: 1 1 0; min-width: 3px; font-size: .62rem; color: #71717a; text-align: center; overflow: hidden; white-space: nowrap; }

.yega-row { display: flex; align-items: center; gap: .75rem; padding: .35rem 0; font-size: .82rem; }
.yega-ym { min-width: 62px; color: var(--text-muted); font-variant-numeric: tabular-nums; flex-shrink: 0; }
.yega-track { flex-grow: 1; position: relative; height: 8px; background: var(--bg-card-2); border-radius: 4px; }
.yega-track .center { position: absolute; left: 50%; top: -2px; bottom: -2px; width: 1px; background: rgba(255, 255, 255, .18); }
.yega-track .range-band { position: absolute; top: 2px; bottom: 2px; background: rgba(73, 227, 195, .18); border-radius: 3px; }
.yega-track .avg-dot { position: absolute; top: -2px; width: 4px; height: 12px; border-radius: 2px; background: var(--accent); }
.yega-val { min-width: 92px; text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.yega-n { min-width: 44px; text-align: right; color: #71717a; font-size: .72rem; font-variant-numeric: tabular-nums; flex-shrink: 0; }

.dev-chart { display: flex; gap: 2px; height: 68px; position: relative; }
.dev-chart::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgba(255, 255, 255, .18); }
.dev-col { flex: 1 1 0; min-width: 2px; position: relative; height: 100%; }
.dev-bar { position: absolute; left: 0; right: 0; border-radius: 2px; min-height: 2px; }
.dev-bar.up { bottom: 50%; background: rgba(73, 227, 195, .6); }
.dev-bar.dn { top: 50%; background: rgba(255, 255, 255, .28); }
.dev-col:hover .dev-bar { filter: brightness(1.4); }
.dev-labels { display: flex; gap: 2px; margin-top: 3px; }
.dev-labels span { flex: 1 1 0; min-width: 2px; font-size: .6rem; color: #71717a; overflow: visible; white-space: nowrap; }

.yl-table { width: 100%; font-size: .8rem; font-variant-numeric: tabular-nums; }
.yl-table th { font-size: .7rem; font-weight: 500; color: var(--text-muted); text-transform: none; letter-spacing: 0; padding: .25rem .4rem; text-align: right; }
.yl-table td { padding: .22rem .4rem; text-align: right; border-top: 1px solid var(--border); color: #d4d4d8; }
.yl-table th:first-child, .yl-table td:first-child { text-align: left; }

.season-strip { display: flex; gap: 4px; }
.season-cell { flex: 1 1 0; text-align: center; border-radius: 8px; padding: .55rem 0 .4rem; background: transparent; border: 1px solid var(--border); }
.season-cell .m { font-size: .68rem; color: var(--text-muted); }
.season-cell .c { font-size: .82rem; font-weight: 700; font-variant-numeric: tabular-nums; }

.hbar-row { display: flex; align-items: center; gap: .75rem; padding: .3rem 0; font-size: .84rem; text-decoration: none; color: inherit; }
a.hbar-row:hover .hbar-name { color: var(--accent); }
.hbar-name { min-width: 130px; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-shrink: 0; color: #e4e4e7; }
.hbar-row.wide .hbar-name { min-width: 200px; max-width: 300px; }
.hbar-track { flex-grow: 1; height: 8px; background: var(--bg-card-2); border-radius: 4px; overflow: hidden; }
.hbar-fill { height: 100%; border-radius: 4px; background: rgba(73, 227, 195, .55); }
.hbar-val { min-width: 84px; text-align: right; color: var(--text-muted); font-size: .78rem; font-variant-numeric: tabular-nums; flex-shrink: 0; }

.win-row { display: flex; align-items: center; gap: .75rem; padding: .45rem 0; border-bottom: 1px solid var(--border); font-size: .86rem; }
.win-row:last-child { border-bottom: none; }
.win-rank { min-width: 26px; text-align: center; font-weight: 700; color: var(--text-muted); font-size: .78rem; flex-shrink: 0; }
.win-name { flex-grow: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.win-share { min-width: 120px; flex-shrink: 0; display: flex; align-items: center; gap: .5rem; }
.win-share .track { flex-grow: 1; height: 6px; background: var(--bg-card-2); border-radius: 3px; overflow: hidden; }
.win-share .fill { height: 100%; background: rgba(255, 255, 255, .30); border-radius: 3px; }
.win-share .pct { font-size: .74rem; color: var(--text-muted); font-variant-numeric: tabular-nums; min-width: 38px; text-align: right; }
.win-cnt { min-width: 44px; text-align: right; color: var(--text-muted); font-size: .78rem; font-variant-numeric: tabular-nums; flex-shrink: 0; }

.div-badge { font-size: .7rem; font-weight: 700; border-radius: 6px; padding: 2px 8px; flex-shrink: 0; }
.div-badge.lg { font-size: .78rem; padding: 3px 10px; }
.div-공사 { background: rgba(96, 165, 250, .15); color: #60a5fa; }
.div-용역 { background: rgba(52, 211, 153, .15); color: #34d399; }
.div-물품 { background: rgba(251, 146, 60, .15); color: #fb923c; }
.div-기타, .div-외자 { background: rgba(148, 163, 184, .15); color: #94a3b8; }

.list-row {
    display: flex; align-items: center; gap: .75rem;
    padding: .55rem .75rem; border-radius: 8px; margin-bottom: .4rem;
    background: transparent; border: 1px solid var(--border);
    text-decoration: none; color: inherit; font-size: .84rem;
    transition: background .15s, border-color .15s;
}
.list-row:hover { background: rgba(73, 227, 195, .06); border-color: rgba(73, 227, 195, .35); color: inherit; }
.list-d { min-width: 78px; color: var(--text-muted); font-size: .76rem; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.list-nm { flex-grow: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.list-amt { min-width: 90px; text-align: right; color: var(--text-muted); font-size: .78rem; font-variant-numeric: tabular-nums; flex-shrink: 0; }

.chip {
    display: inline-flex; align-items: center; gap: .35rem;
    background: transparent; border: 1px solid var(--border);
    border-radius: 8px; padding: .3rem .7rem; font-size: .78rem;
    margin: 0 .35rem .35rem 0; font-variant-numeric: tabular-nums;
    color: inherit; text-decoration: none;
}
a.chip:hover { border-color: rgba(73, 227, 195, .4); color: inherit; }
.chip b { color: var(--accent); }
.chip.top1 { border-color: rgba(73, 227, 195, .45); }
.chip .rank { color: #71717a; font-size: .7rem; font-weight: 700; }

.m-row { display: flex; align-items: flex-start; gap: 1rem; padding: .7rem 0; border-top: 1px solid var(--border); font-size: .86rem; }
.m-name { min-width: 170px; max-width: 220px; font-weight: 600; flex-shrink: 0; }
.m-name .cnt { display: block; font-weight: 400; font-size: .74rem; color: var(--text-muted); margin-top: 2px; font-variant-numeric: tabular-nums; }
.m-chips { flex-grow: 1; }

.ag-pages { display: flex; justify-content: center; align-items: center; gap: .25rem; margin-top: 1rem; flex-wrap: wrap; }
.ag-page {
    min-width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center;
    padding: 0 .5rem; font-size: .8rem; font-weight: 600; color: var(--text-muted);
    background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; cursor: pointer;
    transition: background .15s, color .15s;
}
.ag-page:hover:not(:disabled):not(.active) { color: #e4e4e7; background: var(--bg-card-2); }
.ag-page.active { background: rgba(73, 227, 195, .15); color: var(--accent); border-color: rgba(73, 227, 195, .4); cursor: default; }
.ag-page:disabled { opacity: .4; cursor: default; }
.ag-ellipsis { color: #71717a; padding: 0 .2rem; font-size: .8rem; }

.tilt-bar { height: 8px; background: var(--bg-card-2); border-radius: 4px; overflow: hidden; }
.tilt-fill { height: 100%; background: #f59e0b; border-radius: 4px; }