.app{width:min(1280px,calc(100% - 2rem));margin:0 auto;padding:1.5rem 0 3rem}.hero{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;margin-bottom:1.1rem}.hero h1{margin:0;font-family:var(--display);font-size:1.6rem;font-weight:700;letter-spacing:-.03em}.hero-actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.export-wrap{position:relative}.export-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:11rem;display:flex;flex-direction:column;gap:.25rem;padding:.35rem;border-radius:10px;background:var(--picker-bg);border:1px solid var(--line);box-shadow:0 10px 24px #14283c1f}.export-menu button{border:1px solid transparent;border-radius:8px;padding:.5rem .65rem;background:#f3f6f9;color:var(--text);font-size:.84rem;font-weight:600;text-align:left}.export-menu button:hover{background:#e8eef4}.btn{border:1px solid var(--line);background:var(--bg-elev);color:var(--text);border-radius:999px;padding:.55rem .95rem;font-weight:600}.btn:hover{background:var(--bg-row-hover)}.btn:disabled{opacity:.55;cursor:default}a.btn{display:inline-flex;align-items:center;text-decoration:none}.btn-accent{background:var(--accent);border-color:transparent;color:#fff}.btn-accent:hover{filter:brightness(1.05);background:var(--accent)}.update-note{margin:-.35rem 0 .9rem;color:var(--muted);font-size:.86rem}.rating-panel{margin-bottom:1.1rem;padding:.85rem .95rem 1rem;background:var(--bg-elev);border:1px solid var(--line);border-radius:14px}.rating-panel-head{margin-bottom:.75rem}.rating-panel-head h2{margin:0;font-family:var(--display);font-size:1.05rem;font-weight:700}.rating-panel-note{margin:.25rem 0 0;color:var(--muted);font-size:.78rem;line-height:1.4}.rating-note-end{white-space:nowrap}.rating-info{position:relative;display:inline-flex;vertical-align:middle;margin-left:.28rem}.rating-info-btn{display:inline-flex;align-items:center;justify-content:center;width:1.05rem;height:1.05rem;padding:0;border:1px solid rgba(30,50,70,.28);border-radius:999px;background:#eef2f6;color:var(--muted);font-family:var(--display);font-size:.68rem;font-weight:800;font-style:italic;line-height:1;cursor:help}.rating-info-btn:hover,.rating-info-btn:focus-visible{color:var(--text);border-color:#1aa8a28c;background:#e4f6f4;outline:none}.rating-info-tip{position:absolute;left:50%;bottom:calc(100% + .4rem);z-index:30;width:max-content;max-width:min(22rem,80vw);padding:.4rem .55rem;border-radius:8px;background:#1a2430;color:#f5f7fa;font-size:.74rem;font-weight:500;font-style:normal;line-height:1.35;text-align:left;white-space:nowrap;box-shadow:0 6px 18px #0f172038;transform:translate(-50%);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .12s ease,visibility .12s ease}@media(max-width:420px){.rating-info-tip{white-space:normal;word-break:keep-all;overflow-wrap:anywhere}}.rating-info-tip:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border:5px solid transparent;border-top-color:#1a2430}.rating-info:hover .rating-info-tip,.rating-info:focus-within .rating-info-tip{opacity:1;visibility:visible}.rating-totals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-bottom:.85rem}.rating-total{display:flex;flex-direction:column;gap:.15rem;padding:.7rem .8rem;border-radius:12px;background:linear-gradient(135deg,#e8f7f6,#f3f6f9);border:1px solid rgba(26,168,162,.22)}.rating-total.append{background:linear-gradient(135deg,#f8eef5,#f3f6f9);border-color:#d478b847}.rating-total-label{font-size:.75rem;font-weight:700;color:var(--muted);letter-spacing:.02em}.rating-total-value{font-family:var(--display);font-size:1.85rem;font-weight:700;line-height:1.1;letter-spacing:-.03em}.rating-total-sub{font-size:.75rem;color:var(--muted)}.rating-lists{display:flex;flex-direction:column;gap:1rem}.rating-list-block h3{margin:0 0 .5rem;font-size:.95rem;font-weight:700}.rating-empty{margin:0;padding:.75rem;color:var(--muted);font-size:.86rem;background:#f3f6f9;border-radius:10px}.rating-grid{list-style:none;margin:0;padding:0;display:grid;gap:.4rem .55rem}.rating-list-main .rating-grid,.rating-list-append .rating-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.rating-cell{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:.45rem .5rem;min-width:0;min-height:3.5rem;padding:.35rem .45rem;border-radius:10px;background:#f7f9fb;border:1px solid rgba(30,50,70,.06)}.rating-cell-ord{font-family:var(--display);font-size:.72rem;font-weight:800;color:var(--muted);line-height:1;min-width:1.5rem;text-align:right}.rating-cell-jacket{width:3.15rem;height:3.15rem;border-radius:8px;object-fit:cover;background:#dce3ea;flex-shrink:0}.rating-cell-body{min-width:0;display:flex;flex-direction:column;gap:.22rem}.rating-cell-title{margin:0;font-size:.84rem;font-weight:650;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rating-cell-meta{display:flex;flex-wrap:nowrap;align-items:center;gap:.28rem;min-width:0}.rating-diff{display:inline-flex;align-items:center;justify-content:center;min-width:1.55rem;padding:.1rem .32rem;border-radius:999px;font-family:var(--display);font-size:.72rem;font-weight:800;color:#fff;background:#8aa0b5}.rating-diff.easy{background:var(--easy)}.rating-diff.normal{background:var(--normal)}.rating-diff.hard{background:var(--hard)}.rating-diff.expert{background:var(--expert)}.rating-diff.master{background:var(--master)}.rating-diff.append{background:var(--append)}.rating-rank{display:inline-flex;align-items:center;justify-content:center;min-width:1.55rem;padding:.1rem .32rem;border-radius:999px;font-size:.68rem;font-weight:800}.rating-rank.rank-P{color:#0b4f7a;background:#ccebff}.rating-rank.rank-F{color:#2b6a34;background:#d4f5d0}.rating-rank.rank-C{color:#5c6570;background:#e4e8ec}.rating-item-lv{font-size:.74rem;color:var(--muted);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rating-item-r{flex-shrink:0;font-family:var(--display);font-size:.95rem;font-weight:750;letter-spacing:-.02em;padding-right:.1rem}@media(max-width:1100px){.rating-list-main .rating-grid,.rating-list-append .rating-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:820px){.rating-totals{grid-template-columns:1fr}.rating-list-main .rating-grid,.rating-list-append .rating-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.rating-list-main .rating-grid,.rating-list-append .rating-grid{grid-template-columns:1fr}}.batch-panel{margin-bottom:1rem;padding:.75rem .85rem;background:var(--bg-elev);border:1px solid var(--line);border-radius:12px}.batch-panel h2{margin:0 0 .55rem;font-size:.92rem;font-weight:700}.batch-controls{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.55rem .75rem}.batch-field{display:flex;flex-direction:column;gap:.25rem;font-size:.75rem;font-weight:700;color:var(--muted)}.batch-field select{border:1px solid var(--line);background:#fff;color:var(--text);border-radius:8px;padding:.45rem .55rem;font-size:.88rem;font-weight:600;min-width:6.5rem}.batch-range{display:flex;align-items:center;gap:.35rem}.batch-range select{min-width:4.25rem}.batch-range-sep{color:var(--muted);font-weight:700}.batch-apply{border-radius:8px;padding:.5rem 1rem}.batch-note{margin:.5rem 0 0;color:var(--muted);font-size:.82rem}.stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.55rem;margin-bottom:1rem}.stat-diff{background:var(--bg-elev);border:1px solid var(--line);border-radius:12px;padding:.65rem .7rem}.stat-diff-title{font-size:.78rem;font-weight:700;letter-spacing:.04em;margin-bottom:.45rem}.stat-diff.easy .stat-diff-title{color:var(--easy)}.stat-diff.normal .stat-diff-title{color:var(--normal)}.stat-diff.hard .stat-diff-title{color:var(--hard)}.stat-diff.expert .stat-diff-title{color:var(--expert)}.stat-diff.master .stat-diff-title{color:var(--master)}.stat-diff.append .stat-diff-title{color:var(--append)}.stat-diff-grid{display:grid;grid-template-columns:1fr;gap:.3rem}.stat-cell{display:flex;flex-direction:column;align-items:stretch;gap:.2rem;padding:.35rem .5rem;border-radius:6px;background:#f3f6f9}.stat-label{font-size:.68rem;font-weight:700;letter-spacing:.01em;white-space:nowrap;line-height:1.2}.stat-value{display:inline-flex;align-items:baseline;justify-content:flex-end;gap:.35rem;white-space:nowrap;font-variant-numeric:tabular-nums;align-self:flex-end}.stat-count{font-family:var(--display);font-size:.95rem;font-weight:700;color:var(--text);min-width:3ch;text-align:right}.stat-pct{font-family:var(--display);font-size:.72rem;font-weight:600;color:#6b7c8f;min-width:6.2ch;text-align:right}.stat-cell.status-none .stat-label{color:var(--muted)}.stat-cell.status-clear .stat-label{color:#c49216}.stat-cell.status-full_combo .stat-label{color:#2f9e44}.stat-cell.status-all_perfect .stat-label{color:#1c7ed6}.level-stats{margin-bottom:1rem;padding:.75rem .85rem;background:var(--bg-elev);border:1px solid var(--line);border-radius:12px}.level-stats-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.55rem .85rem;margin-bottom:.65rem}.level-stats-head h2{margin:0;font-size:.92rem;font-weight:700}.level-stat-tabs{display:flex;flex-wrap:wrap;gap:.3rem}.level-stat-tab{border:1px solid var(--line);background:#f3f6f9;color:var(--muted);border-radius:8px;padding:.28rem .65rem;font-size:.72rem;font-weight:700;letter-spacing:.03em}.level-stat-tab.active{color:#fff;border-color:transparent}.level-stat-tab.easy.active{background:var(--easy)}.level-stat-tab.normal.active{background:var(--normal)}.level-stat-tab.hard.active{background:var(--hard)}.level-stat-tab.expert.active{background:var(--expert)}.level-stat-tab.master.active{background:var(--master)}.level-stat-tab.append.active{background:var(--append)}.level-stats-table-wrap{overflow-x:auto}.level-stats-table{width:100%;border-collapse:collapse;font-size:.88rem}.level-stats-table th,.level-stats-table td{padding:.4rem .55rem;text-align:right;border-bottom:1px solid var(--line)}.level-stats-table th:first-child,.level-stats-table td:first-child{text-align:left}.level-stats-table thead th{font-size:.75rem;font-weight:700;color:var(--muted)}.level-stats-table thead th.status-clear{color:#c49216}.level-stats-table thead th.status-full_combo{color:#2f9e44}.level-stats-table thead th.status-all_perfect{color:#1c7ed6}.level-stats-table thead th.level-total{color:var(--muted)}.level-stats-table .level-num{font-family:var(--display);font-weight:700;color:var(--text)}.level-stats-table td{color:var(--text)}.level-stats-table .level-total{color:var(--muted);font-weight:600}.level-stats-table .stat-count{color:var(--text)}.level-stats-table .stat-pct{color:#6b7c8f}.level-stats-table .level-row{cursor:pointer}.level-stats-table .level-row.tone-clear{background:var(--tone-clear)}.level-stats-table .level-row.tone-fc{background:var(--tone-fc)}.level-stats-table .level-row.tone-ap{background:var(--tone-ap)}.level-stats-table .level-row:hover{background:#eef3f8}.level-stats-table .level-row.tone-clear:hover{background:#ffefb8}.level-stats-table .level-row.tone-fc:hover{background:#d5f2d1}.level-stats-table .level-row.tone-ap:hover{background:#d0ebf8}.level-stats-table .level-row.active{background:#e4edf6}.level-stats-table .level-row.tone-clear.active{background:#ffe9a3}.level-stats-table .level-row.tone-fc.active{background:#c8ecc3}.level-stats-table .level-row.tone-ap.active{background:#bddff3}.level-stats-empty{text-align:center!important;color:var(--muted);padding:.85rem!important}.level-detail-tr>td{padding:0;border-bottom:1px solid var(--line);background:#f0f4f8}.level-detail{padding:.55rem .55rem .65rem}.level-detail-head{display:flex;align-items:center;gap:.55rem;margin-bottom:.45rem}.level-detail-count{color:var(--muted);font-size:.82rem}.level-detail-close{margin-left:auto;padding:.25rem .55rem;font-size:.78rem}.level-detail-list{display:block;max-height:22rem;overflow-y:auto;overscroll-behavior:contain;content-visibility:auto;contain:content}.level-detail-virtual{position:relative;width:100%}.level-detail-virtual-item{position:absolute;left:0;right:0;box-sizing:border-box}.level-detail-row{display:flex;align-items:center;gap:.65rem;height:52px;padding:0 .45rem;border-radius:8px;background:#f7f9fb;box-sizing:border-box}.level-detail-jacket{width:40px;height:40px;border-radius:7px;object-fit:cover;flex-shrink:0;background:#dce3ea}.level-detail-titles{min-width:0;flex:1}.level-detail-ko{margin:0;font-size:.88rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.level-detail-jp{margin:.1rem 0 0;font-size:.75rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.level-detail-status{width:2.6rem!important;height:2.6rem!important;font-size:.72rem!important}.toolbar{display:grid;grid-template-columns:1fr auto;gap:.55rem;align-items:center;margin-bottom:.65rem}.list-controls{display:flex;flex-direction:column;gap:.45rem;margin-bottom:1rem;padding:.65rem .75rem;background:var(--bg-elev);border:1px solid var(--line);border-radius:12px}.control-group{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .55rem}.control-label{min-width:2.75rem;font-size:.75rem;font-weight:700;color:var(--muted)}.control-chips{display:flex;flex-wrap:wrap;gap:.3rem}.control-chip{border:1px solid var(--line);background:#f3f6f9;color:var(--muted);border-radius:8px;padding:.28rem .55rem;font-size:.72rem;font-weight:700;letter-spacing:.02em}.control-chip.active{background:#2b3a4a;border-color:transparent;color:#fff}.control-chip.diff-chip.easy.active{background:var(--easy)}.control-chip.diff-chip.normal.active{background:var(--normal)}.control-chip.diff-chip.hard.active{background:var(--hard)}.control-chip.diff-chip.expert.active{background:var(--expert)}.control-chip.diff-chip.master.active{background:var(--master)}.control-chip.diff-chip.append.active{background:var(--append)}.search{width:100%;border:1px solid var(--line);background:var(--bg-elev);color:var(--text);border-radius:12px;padding:.65rem .8rem}.meta{margin:0;color:var(--muted);font-size:.85rem;min-width:2rem;text-align:right}.state{color:var(--muted)}.state.error{color:var(--danger)}.list{display:flex;flex-direction:column;gap:.65rem}.song{display:flex;flex-wrap:nowrap;align-items:center;gap:1rem;padding:.5rem .9rem .5rem .45rem;border-radius:var(--radius);background:var(--bg-row);border:1px solid var(--line)}.song-main{display:flex;align-items:center;gap:.75rem .85rem;width:min(38rem,100%);flex:0 1 38rem;min-width:0;padding:.55rem .75rem .55rem .55rem;border-radius:12px;background:transparent}.song-main.tone-clear{background:var(--tone-clear)}.song-main.tone-fc{background:var(--tone-fc)}.song-main.tone-ap{background:var(--tone-ap)}.song-index{font-family:var(--display);font-size:.85rem;font-weight:700;color:var(--muted);min-width:1.75rem;text-align:left;flex-shrink:0}.jacket{width:68px;height:68px;border-radius:12px;object-fit:cover;background:#0a1018;flex-shrink:0}.titles{flex:1 1 auto;min-width:0;max-width:none}.title-row{display:flex;align-items:center;gap:.45rem;min-width:0}.title-row .title-text{flex:1 1 auto;min-width:0;margin:0;font-size:1.08rem;font-weight:600;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal;word-break:keep-all}.duration{flex-shrink:0;font-family:var(--display);font-size:.78rem;font-weight:700;color:var(--muted);letter-spacing:.02em;padding:.12rem .4rem;border-radius:999px;background:#eef2f6}.badge-limited{flex-shrink:0;font-size:.68rem;font-weight:700;color:#9c3d6e;background:#fce8f1;border-radius:999px;padding:.14rem .45rem;white-space:nowrap}.jp{margin:.2rem 0 0;color:var(--muted);font-size:.86rem}.diffs{display:grid;grid-template-columns:repeat(6,3.05rem);gap:.45rem;margin-top:0;flex-shrink:0;padding-right:.25rem;justify-items:center}.song-batch{position:relative;flex-shrink:0;margin-left:auto}.song-batch-btn{border-radius:8px;padding:.4rem .7rem;font-size:.78rem;white-space:nowrap}.diff-wrap{position:relative;width:3.05rem}.diff-wrap.missing-slot{visibility:hidden;pointer-events:none}.diff{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.05rem;width:3.05rem;height:3.05rem;padding:0;border-radius:999px;border:3px solid transparent;background:#eef1f5;color:var(--text);font-family:var(--display);font-weight:700;line-height:1}.diff.missing{opacity:.35;border-color:#c5ced8;background:#f3f5f7;color:var(--muted)}.diff.easy{border-color:var(--easy)}.diff.normal{border-color:var(--normal)}.diff.hard{border-color:var(--hard)}.diff.expert{border-color:var(--expert)}.diff.master{border-color:var(--master)}.diff.append{border-color:var(--append)}.diff-level{font-size:.95rem}.diff-mark{font-size:.6rem;font-weight:800;letter-spacing:.02em;line-height:1}.diff.status-none{background:#f1f3f5;color:#868e96}.diff.status-clear{background:#fff3bf;color:#7a6400}.diff.status-clear .diff-mark{color:#9a7b00}.diff.status-full_combo{background:#b2f2bb;color:#1b5e2a}.diff.status-full_combo .diff-mark{color:#2b8a3e}.diff.status-all_perfect{background:#a5d8ff;color:#0b3d66}.diff.status-all_perfect .diff-mark{color:#1864ab}.status-picker{position:absolute;z-index:5;left:50%;transform:translate(-50%);top:calc(100% + 6px);width:max-content;min-width:11.5rem;display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem;padding:.4rem;border-radius:12px;background:var(--picker-bg);border:3px solid var(--line);box-shadow:0 10px 24px #14283c1f}.diff-wrap.easy .status-picker{border-color:var(--easy)}.diff-wrap.normal .status-picker{border-color:var(--normal)}.diff-wrap.hard .status-picker{border-color:var(--hard)}.diff-wrap.expert .status-picker{border-color:var(--expert)}.diff-wrap.master .status-picker{border-color:var(--master)}.diff-wrap.append .status-picker{border-color:var(--append)}.status-picker-floating{position:fixed;z-index:40;left:0;top:0;transform:translate(-50%);max-width:calc(100vw - 20px)}.status-picker-floating.easy{border-color:var(--easy)}.status-picker-floating.normal{border-color:var(--normal)}.status-picker-floating.hard{border-color:var(--hard)}.status-picker-floating.expert{border-color:var(--expert)}.status-picker-floating.master{border-color:var(--master)}.status-picker-floating.append{border-color:var(--append)}.song-batch .status-picker{left:auto;right:0;transform:none}.pick{border:1px solid transparent;border-radius:9px;padding:.55rem .35rem;font-size:.88rem;font-weight:800;background:#f3f6f9;color:var(--muted)}.pick:hover{background:#e8eef4}.pick.status-none.active,.pick.status-none:hover{color:#495057}.pick.status-clear{color:#c49216}.pick.status-full_combo{color:#2f9e44}.pick.status-all_perfect{color:#1c7ed6}.pick.active{border-color:#1e324638;background:#e8eef4}@media(max-width:980px){.stats{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:560px){.song{flex-wrap:wrap;align-items:flex-start}.song-main{flex:1 1 100%;width:100%}.diffs{width:100%;padding-left:.45rem;justify-content:start}.song-batch{margin-left:.45rem}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.toolbar{grid-template-columns:1fr}}.settings-page .settings-title-block h1{margin:0}.settings-sub{margin:.2rem 0 0;color:var(--muted);font-size:.88rem}.settings-section{margin-bottom:.85rem}.settings-section h2{margin:0 0 .35rem;font-size:.92rem;font-weight:700}.settings-hint{margin:0;color:var(--muted);font-size:.86rem;line-height:1.45}.settings-hint code{font-size:.82em;background:#eef2f6;padding:.05rem .3rem;border-radius:4px}.settings-list{display:flex;flex-direction:column;gap:.55rem}.settings-row{display:flex;align-items:flex-start;gap:.75rem;padding:.65rem .75rem;background:var(--bg-elev);border:1px solid var(--line);border-radius:12px}.settings-index{font-family:var(--display);font-size:.8rem;font-weight:700;color:var(--muted);min-width:1.75rem;text-align:right;padding-top:.55rem}.settings-jacket{width:48px;height:48px;border-radius:8px;object-fit:cover;flex-shrink:0;background:#dce3ea}.settings-fields{flex:1;min-width:0;display:flex;flex-direction:column;gap:.35rem}.settings-label{display:flex;flex-direction:column;gap:.25rem;font-size:.72rem;font-weight:700;color:var(--muted)}.settings-input{width:100%;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:8px;padding:.5rem .65rem;font-size:.92rem;font-weight:600}.settings-input:focus{outline:2px solid rgba(62,199,194,.35);outline-offset:1px}.settings-jp{margin:0;font-size:.8rem;color:var(--muted)}.settings-reset{align-self:flex-start;border-radius:8px;padding:.28rem .55rem;font-size:.75rem}:root{--bg: #f5f7fa;--bg-elev: #ffffff;--bg-row: #ffffff;--bg-row-hover: #f0f4f8;--line: rgba(30, 50, 70, .12);--text: #1a2430;--muted: #6b7c8f;--accent: #1aa8a2;--accent-dim: rgba(26, 168, 162, .12);--easy: #2f9e44;--normal: #1c7ed6;--hard: #c49216;--expert: #d6336c;--master: #7950f2;--append: #d478b8;--clear: #6b7c8f;--fc: #1c7ed6;--ap: #d9480f;--danger: #e03131;--tone-clear: #fff6d6;--tone-fc: #e6f8e4;--tone-ap: #e3f3fc;--picker-bg: #ffffff;--radius: 14px;--font: "IBM Plex Sans KR", system-ui, sans-serif;--display: "Outfit", "IBM Plex Sans KR", system-ui, sans-serif;color:var(--text);background:var(--bg);font-family:var(--font);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{min-width:320px;background:var(--bg)}button,input,select{font:inherit}button{cursor:pointer}img{display:block;max-width:100%}