:root{font-family:system-ui,-apple-system,"Malgun Gothic",sans-serif;color:#ebeff5;background:#0b1018;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 85% 0%,#263753 0,#0b1018 36rem)}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #85d8d1;outline-offset:2px}.shell{max-width:1120px;margin:auto;padding:42px 24px 64px}.hero{padding:14px 0 32px}.eyebrow{color:#72d6c8;font-size:.8rem;font-weight:800;letter-spacing:.15em}.hero h1{font-size:clamp(2rem,5vw,3.5rem);letter-spacing:-.06em;line-height:1.14;margin:12px 0}.hero p{color:#aab7c8;margin:0;font-size:1.05rem}.panel{background:#151e2b;border:1px solid #2a3b4f;border-radius:18px;padding:26px;margin:16px 0;box-shadow:0 14px 34px #0002}.section-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.section-head>div{display:flex;align-items:center;gap:12px}.section-head h2{font-size:1.26rem;letter-spacing:-.03em;margin:0}.step{display:inline-grid;place-items:center;width:32px;height:32px;border:1px solid #4b8d8a;border-radius:9px;color:#83d8ca;font-size:.8rem;font-weight:800}.setup-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}label{display:block;color:#b8c6d7;font-size:.88rem;font-weight:600}input,select{display:block;width:100%;margin-top:8px;padding:11px 12px;border:1px solid #3c4c60;border-radius:10px;color:#f4f7fb;background:#101723;min-height:43px}input[type=checkbox]{width:18px;min-height:18px;height:18px;margin:0;accent-color:#76d3c7}.hint{font-size:.88rem;line-height:1.6;color:#8ea0b5;margin:4px 0 18px}.slot-controls{display:flex;flex-wrap:wrap;gap:8px}.slot-pill{display:flex;align-items:center;gap:8px;border:1px solid #365267;border-radius:999px;padding:8px 12px;color:#d4e6ed;font-size:.86rem}.skill-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.skill-group{border:1px solid #2b3c4f;border-radius:14px;overflow:hidden}.skill-group h3{margin:0;padding:12px 15px;background:#1e2c3d;font-size:.95rem;color:#91d9ce}.skill-head,.skill-row{display:grid;grid-template-columns:minmax(0,1fr) 74px 74px;align-items:center;gap:8px;padding:8px 12px}.skill-head{color:#8294a8;font-size:.75rem;border-bottom:1px solid #2b3c4f}.skill-row{border-bottom:1px solid #243346}.skill-row:last-child{border:0}.skill-title{display:flex;align-items:center;gap:9px;min-width:0;color:#e7eff5;font-size:.88rem}.skill-title span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.skill-row input[type=number]{margin:0;padding:6px 8px;min-height:34px;text-align:center;font-size:.86rem}.skill-row:not(.selected) input[type=number]{opacity:.45}.meta{color:#8da5b9;font-size:.85rem}.secondary,.quiet{background:transparent;border:1px solid #4b7080;color:#a6e5da;border-radius:10px;padding:10px 14px;font-weight:700}.quiet{border-color:transparent;color:#a2afbe}.fixed-list{display:grid;gap:12px}.fixed-card{border:1px solid #365067;border-radius:13px;background:#101a27;padding:16px}.fixed-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.fixed-head strong{color:#d5f2eb}.fixed-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}.fixed-lines{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.line-entry{display:flex;gap:6px}.line-entry select:first-child{min-width:0;flex:1}.line-entry select:last-child{width:70px;flex:none}.fixed-card select{margin-top:5px;padding:8px;min-height:38px;font-size:.83rem}.remove{background:transparent;color:#f0a4a4;border:0;font-size:.84rem}.action-panel{display:flex;align-items:center;gap:14px;margin:22px 0}.primary{border:0;border-radius:12px;padding:14px 25px;background:#78d7c7;color:#09231f;font-weight:850;box-shadow:0 8px 22px #44c6b035}.primary:hover{background:#a0eadc}#status{font-size:.88rem;color:#e1b77f}.result{border-color:#4e8e86}.result h2{margin:0 0 9px}.result-intro{color:#a8bdca;margin:0 0 20px}.result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.result-card{background:#10252b;border:1px solid #32655f;border-radius:13px;padding:16px}.result-card h3{margin:0 0 9px;color:#a8e9dc}.result-card p{margin:5px 0;color:#d7e5ed;font-size:.9rem}.result-card small{color:#8da9ad}.result-card.fixed{background:#1d2430;border-color:#46536a}.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.chip{border-radius:8px;padding:6px 8px;background:#29443f;color:#d7f6ee;font-size:.79rem}.chip.muted{background:#2c3844;color:#aebdca}.summary-list{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 17px}.summary-list span{padding:7px 10px;background:#203649;border-radius:8px;color:#cce3ec;font-size:.83rem}.impossible{font-size:1.4rem;font-weight:900;color:#ffc09d}footer{margin-top:28px;color:#718299;font-size:.78rem;line-height:1.6}@media(max-width:850px){.setup-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.fixed-lines{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.shell{padding:24px 13px 40px}.panel{padding:18px}.skill-groups,.result-grid{grid-template-columns:1fr}.setup-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.fixed-meta{grid-template-columns:1fr}.fixed-lines{grid-template-columns:1fr 1fr}.action-panel{flex-wrap:wrap}.skill-head,.skill-row{grid-template-columns:minmax(0,1fr) 64px 64px}}
.setup-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.skill-head,.skill-row{grid-template-columns:minmax(0,1fr) 72px}
.skill-group.passive .skill-head,.skill-group.passive .skill-row{grid-template-columns:minmax(0,1fr) 92px}
.skill-row select{margin:0;padding:5px 6px;min-height:34px;font-size:.79rem}
.fixed-meta{grid-template-columns:180px}
.line-entry select:first-child{width:100%}
.replace{padding:12px 14px;border:1px solid #c5905b;border-radius:10px;background:#372819;color:#f8d7a8;line-height:1.5}
@media(max-width:640px){.setup-grid{grid-template-columns:1fr}.skill-head,.skill-row{grid-template-columns:minmax(0,1fr) 64px}.skill-group.passive .skill-head,.skill-group.passive .skill-row{grid-template-columns:minmax(0,1fr) 82px}.fixed-meta{grid-template-columns:1fr}}
.breakdown-title{margin:25px 0 12px;font-size:1.05rem;color:#dcece9}
.table-wrap{overflow:auto;border:1px solid #344a5b;border-radius:12px}
.level-table{width:100%;border-collapse:collapse;min-width:580px;font-size:.86rem}
.level-table th,.level-table td{padding:10px 13px;text-align:right;border-bottom:1px solid #2a3a4d}
.level-table th:first-child,.level-table td:first-child{text-align:left}
.level-table th{background:#1d2c3b;color:#9ab8c7;font-size:.78rem;white-space:nowrap}
.level-table tr:last-child td{border-bottom:0}
.level-table tr.focused{background:#1d353a}
.level-table td:first-child small{display:block;color:#8ea7b7;font-size:.75rem;margin-top:3px}
.level-table td strong{color:#a8e9dc}
.balance-panel{margin-top:28px;padding-top:22px;border-top:1px solid #3d5a62}
.balance-panel h3{margin:0 0 8px;color:#9ee2d5}
.balance-panel #balance-status{display:inline-block;margin-left:12px;color:#abc5cd;font-size:.86rem}
.balance-answer{margin-top:22px;padding:18px;border:1px solid #4b8d8a;border-radius:14px;background:#11242a}
.balance-answer>h3{font-size:1.1rem}
.balance-answer .summary-list{margin-top:12px}
.skill-icon{display:block;flex:none;width:34px;height:34px;object-fit:cover;border:1px solid #5b7181;border-radius:8px;background:#0d1823;box-shadow:0 2px 7px #0006}
.skill-row{min-height:54px;transition:background .15s ease}
.skill-row:hover{background:#203145}
.skill-row.selected{background:#193b3c}
.skill-row.selected .skill-icon{border-color:#72d7c4;box-shadow:0 0 0 2px #72d7c421}
.skill-group.passive .skill-row.selected{background:#233649}
.skill-group.passive .skill-row.selected .skill-icon{border-color:#91bde8}
.skill-title .skill-name{font-weight:650}
.line-entry{align-items:center}
.fixed-icon-slot{display:grid;place-items:center;flex:none;width:38px;height:38px;margin-top:5px;border:1px solid #344a5d;border-radius:9px;background:#172331}
.fixed-icon-slot .skill-icon{width:34px;height:34px;border-radius:7px}
.chip{display:inline-flex;align-items:center;gap:7px;padding:4px 9px 4px 4px;line-height:1.2}
.chip .skill-icon{width:25px;height:25px;border-radius:6px}
.summary-list .summary-item{display:inline-flex;align-items:center;gap:8px;padding:5px 10px 5px 5px}
.summary-item .skill-icon{width:28px;height:28px;border-radius:6px}
.table-skill{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.table-skill .skill-icon{width:32px;height:32px}
.level-table tbody tr:hover{background:#20384a}
