:root{--ink: #fff6ea;--slab: #ffffff;--slab-2: #fff3e0;--line: #ebdcc3;--line-soft: #f5ebd8;--chalk: #33281a;--mute: #7a6a52;--faint: #95856a;--signal: #ff5c39;--display: "Baloo 2", "Pretendard Variable", Pretendard, sans-serif;--body: "Pretendard Variable", Pretendard, -apple-system, "Segoe UI", sans-serif;--mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;--r: 14px;--r-sm: 8px;--sticker: 0 3px 0 var(--line);--pad: clamp(16px, 2.2vw, 28px);--ease: cubic-bezier(.2, .7, .3, 1);--spring: cubic-bezier(.34, 1.56, .64, 1);color-scheme:light}*{box-sizing:border-box}html,body{margin:0;background:var(--ink)}body{font-family:var(--body);color:var(--chalk);-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.65}h1,h2,h3{margin:0;font-weight:700}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--signal);outline-offset:2px}.app{max-width:1440px;margin:0 auto;padding:var(--pad)}.board{display:flex;align-items:center;gap:clamp(14px,2vw,32px);flex-wrap:wrap;padding:18px 22px;background:var(--slab);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sticker);position:relative;overflow:hidden}.board:before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,#e8a400 0,#e8a400 12.5%,#00c2ff 12.5%,#00c2ff 25%,#ff5c39 25%,#ff5c39 37.5%,#00a36c 37.5%,#00a36c 50%,#ff7bac 50%,#ff7bac 62.5%,#6bab2e 62.5%,#6bab2e 75%,#b98cff 75%,#b98cff 87.5%,#e07800 87.5%,#e07800)}.board-mark{display:flex;align-items:baseline;gap:8px}.board-title{font-family:var(--display);font-weight:900;font-size:clamp(24px,3vw,34px);letter-spacing:.01em;line-height:1}.board-sub{font-family:var(--mono);font-size:13px;letter-spacing:.24em;color:var(--chalk);background:var(--signal);padding:3px 9px 2px;border-radius:999px}.board-desc{margin:0;color:var(--mute);font-size:14.5px;flex:1 1 240px}.board-stats{margin:0;font-size:14.5px;color:var(--mute)}.board-stats b{font-family:var(--display);font-weight:700;font-size:19px;color:var(--chalk);padding:0 1px}.layout{display:grid;grid-template-columns:minmax(320px,380px) minmax(0,1fr);gap:clamp(14px,1.6vw,22px);margin-top:clamp(14px,1.6vw,22px);align-items:start}.controls{display:flex;flex-direction:column;gap:14px;position:sticky;top:var(--pad)}.output{display:flex;flex-direction:column;gap:clamp(14px,1.6vw,22px);min-width:0}.panel{background:var(--slab);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sticker);padding:20px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.panel-head h2{font-family:var(--body);font-size:17px;font-weight:700;color:var(--chalk)}.panel-count{font-size:13px;color:var(--faint)}.panel-hint{margin:0;font-size:13px;color:var(--mute);line-height:1.6}.pick-actions{display:flex;gap:6px;margin:10px 0 12px}.pick-actions .btn{flex:1}.field{background:var(--ink);border:1px solid var(--line);border-radius:var(--r-sm);color:var(--chalk);padding:9px 12px;font-family:var(--body);font-size:15px;min-width:0;transition:border-color .15s var(--ease)}.field:hover{border-color:#d9c6a6}.field:focus{outline:none;border-color:var(--signal)}.field--num,.field--share{font-family:var(--display);font-weight:600;text-align:right;padding-right:4px}.field--share{width:46px}.field--num{width:78px}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.btn{border-radius:999px;padding:9px 16px;font-size:14px;font-weight:600;border:1px solid var(--line);background:var(--slab-2);transition:border-color .15s var(--ease),background .15s var(--ease)}.btn:hover{border-color:#d9c6a6;background:var(--ink)}.btn--sm{padding:7px 14px;font-size:13px}.btn--solid{background:var(--signal);border-color:var(--signal);color:#33281a}.btn--solid:hover{background:#ff7452;border-color:#ff7452}.icon-btn{width:30px;height:30px;display:grid;place-items:center;border-radius:var(--r-sm);border:1px solid var(--line);background:transparent;color:var(--mute);font-size:13px;line-height:1;transition:color .15s var(--ease),border-color .15s var(--ease)}.icon-btn:hover:not(:disabled){color:var(--chalk);border-color:#d9c6a6}.icon-btn:disabled{opacity:.3;cursor:not-allowed}.roster{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}.sharebar{position:relative;margin-bottom:8px}.sharebar-track{display:flex;height:38px;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:var(--ink)}.sharebar-seg{container-type:inline-size;min-width:0;display:grid;place-items:center;background:var(--lane);overflow:hidden}.sharebar-pct{font-family:var(--display);font-size:14px;font-weight:700;color:#0d0f14;white-space:nowrap;transition:opacity .15s var(--ease)}@container (max-width: 34px){.sharebar-pct{opacity:0}}.sharebar-handle{position:absolute;top:-3px;bottom:-3px;width:18px;margin-left:-9px;padding:0;border:none;background:transparent;cursor:col-resize;touch-action:none}.sharebar-grip{display:block;width:4px;height:100%;margin:0 auto;border-radius:999px;background:var(--chalk);box-shadow:0 0 0 1px var(--ink);transition:background .15s var(--ease),width .15s var(--ease)}.sharebar-handle:hover .sharebar-grip,.sharebar-handle:focus-visible .sharebar-grip{width:6px;background:var(--signal)}.sharebar-handle:focus-visible{outline:none}.sharebar--single .sharebar-seg{opacity:.85}.sharebar-hint{margin-bottom:14px}.roster-row{display:grid;grid-template-columns:10px minmax(0,1fr) auto 30px;align-items:center;gap:8px}.lane-dot{width:10px;height:10px;border-radius:50%;background:var(--lane);box-shadow:0 0 0 3px color-mix(in srgb,var(--lane) 18%,transparent)}.share{display:flex;align-items:center;gap:2px;background:var(--ink);border:1px solid var(--line);border-radius:var(--r-sm);padding-right:8px}.share:focus-within{border-color:var(--signal)}.share .field--share{border:none;background:transparent;padding:7px 0 7px 8px}.share .field--share:focus{border:none}.share-unit{font-size:13px;color:var(--faint)}.roster-foot{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line-soft)}.stepper{display:flex;align-items:center;gap:6px}.stepper-value{font-family:var(--display);font-weight:800;font-size:18px;min-width:20px;text-align:center}.chips{display:flex;flex-wrap:wrap;gap:7px}.chip{display:flex;align-items:stretch;border-radius:999px;border:1px solid var(--line);overflow:hidden;transition:border-color .15s var(--ease)}.chip:hover{border-color:#d9c6a6}.chip-main{display:flex;align-items:center;gap:6px;padding:6px 12px;border:none;background:transparent;color:var(--mute);font-size:14px;transition:transform .26s var(--spring),color .15s var(--ease),background .15s var(--ease)}.chip-main:active{transform:scale(.92)}.chip-idx{display:grid;place-items:center;width:19px;height:19px;border-radius:999px;background:var(--signal);color:#33281a;font-family:var(--display);font-size:12.5px;font-weight:700}.chip-block{display:grid;place-items:center;width:22px;border:none;border-left:1px solid var(--line);background:transparent;color:var(--faint);font-size:11px;line-height:1;transition:color .15s var(--ease),background .15s var(--ease)}.chip-block:hover{color:#ff7b7b;background:#ff5c391f}.chip--on .chip-main{color:var(--chalk);background:#ffe3d8;font-weight:700}.chip--on{border-color:var(--signal)}.chip--on .chip-block{border-left-color:#ff5c3947;background:#ffe3d8;color:#b3705c}.chip--on .chip-block:hover{color:#c2371a;background:#ffd2c2}.chip--out{border-color:var(--line-soft);opacity:.55}.chip--out .chip-main{color:var(--faint);text-decoration:line-through;cursor:not-allowed}.chip--out .chip-block{color:var(--signal)}.chip-legend{margin:14px 0 0;font-size:12.5px;line-height:1.6;color:var(--faint)}.legend-mark{color:var(--mute);padding:0 3px}.startwith{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-4px 0 14px}.startwith-label{font-size:13px;color:var(--mute)}.segmented{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}.segmented button{padding:6px 15px;border:none;background:transparent;color:var(--mute);font-size:12px;transition:color .15s var(--ease),background .15s var(--ease)}.segmented button+button{border-left:1px solid var(--line)}.segmented button:hover{color:var(--chalk)}.segmented .seg-on{background:var(--signal);color:#33281a;font-weight:600}.startwith-hint{font-size:12.5px;color:var(--faint)}.toggle{display:flex;align-items:center;gap:9px;margin-bottom:14px;cursor:pointer;font-size:14px;color:var(--mute)}.toggle input{position:absolute;opacity:0;width:0;height:0}.toggle-track{flex:none;width:32px;height:18px;border-radius:10px;background:var(--ink);border:1px solid var(--line);position:relative;transition:background .2s var(--ease),border-color .2s var(--ease)}.toggle-track:after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--faint);transition:transform .2s var(--ease),background .2s var(--ease)}.toggle input:checked+.toggle-track{background:color-mix(in srgb,var(--signal) 22%,transparent);border-color:color-mix(in srgb,var(--signal) 55%,transparent)}.toggle input:checked+.toggle-track:after{transform:translate(14px);background:var(--signal)}.toggle input:focus-visible+.toggle-track{outline:2px solid var(--signal);outline-offset:2px}.volumes{display:flex;flex-direction:column}.volume-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 10px;padding:11px 0}.volume-row+.volume-row{border-top:1px solid var(--line-soft)}.volume-name{display:flex;flex-direction:column;min-width:0}.volume-name b{font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.volume-name em{font-style:normal;font-size:11px;letter-spacing:.04em;color:var(--faint)}.numfield{display:flex;align-items:center;gap:3px;background:var(--ink);border:1px solid var(--line);border-radius:var(--r-sm);padding-right:8px}.numfield:focus-within{border-color:var(--signal)}.numfield .field--num{border:none;background:transparent;padding:6px 0 6px 8px}.numfield-unit{font-size:12.5px;color:var(--faint)}.volume-split{grid-column:1 / -1;font-size:12px;color:var(--faint)}.volume-row--run{background:var(--slab-2);border-radius:var(--r-sm);padding-left:9px;padding-right:9px;margin:2px 0}.volume-row--run .volume-name b{color:var(--chalk)}.lanes{container:lanes / inline-size;display:flex;flex-direction:column;gap:4px;background:var(--slab);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sticker);padding:18px}.lane{padding:12px 2px;animation:laneIn .45s var(--delay, 0ms) both var(--ease)}.lane+.lane{margin-top:2px}@keyframes laneIn{0%{opacity:0;transform:translateY(7px)}}.lane-head{display:flex;align-items:baseline;gap:8px;margin-bottom:9px}.lane-name{font-family:var(--body);font-weight:700;font-size:clamp(17px,1.7vw,20px);color:var(--chalk)}.lane-en{font-size:11.5px;color:var(--faint);letter-spacing:.04em}.lane-total{margin-left:auto;font-size:14px;font-weight:600;color:var(--mute)}.track{display:flex;height:50px;border-radius:10px;overflow:hidden;background-color:var(--ink);background-image:repeating-linear-gradient(-45deg,var(--line-soft) 0 1px,transparent 1px 7px);border:1px solid var(--line)}.seg{container-type:inline-size;position:relative;min-width:0;background:var(--lane);transition:width .35s var(--ease);overflow:hidden}.seg:not([data-last]){box-shadow:inset -2px 0 0 var(--slab)}.seg:not([data-last]):after{content:"";position:absolute;top:0;right:2px;width:7px;height:100%;background:repeating-linear-gradient(-45deg,rgba(16,18,25,.45) 0 1.5px,transparent 1.5px 5px)}.seg-inner{display:flex;flex-direction:column;justify-content:center;height:100%;padding:0 10px;color:#0d0f14;white-space:nowrap;transition:opacity .2s var(--ease)}.seg-name{font-size:13.5px;font-weight:700;line-height:1.15;overflow:hidden;text-overflow:ellipsis}.seg-amt{font-size:12.5px;font-weight:600;line-height:1.25;opacity:.78}@container (max-width: 74px){.seg-inner{opacity:0}}.track-empty{display:grid;place-items:center;width:100%;font-size:13px;color:var(--faint)}.lane-caption{display:flex;flex-wrap:wrap;gap:4px 16px;margin:9px 0 0;font-size:13px;color:var(--mute)}.cap{display:inline-flex;align-items:baseline;gap:5px}.cap b{font-weight:700;color:var(--chalk);position:relative;padding-left:10px}.cap b:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:var(--lane)}.cap--narrow-only,.lane-caption--narrow-only{display:none}@container lanes (max-width: 620px){.seg-inner{opacity:0}.cap--narrow-only{display:inline-flex}.lane-caption--narrow-only{display:flex}.lane-caption{gap:4px 12px}}.lane--run .track{height:38px}.lane--run .lane-name{font-size:16px;color:var(--mute)}.lane--run .seg-inner{flex-direction:row;align-items:baseline;gap:6px}.empty{display:grid;place-content:center;gap:4px;text-align:center;min-height:260px;background:var(--slab);border:1px dashed var(--line);border-radius:var(--r)}.empty-title{margin:0;font-size:17px;font-weight:700}.empty-body{margin:0;font-size:14px;color:var(--mute)}.totals-head{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}.totals-head h2{font-family:var(--body);font-size:17px;font-weight:700;color:var(--chalk)}.totals-hint{font-size:13px;color:var(--faint)}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}.card{background:var(--slab);border:1px solid var(--line);border-top:4px solid var(--lane);border-radius:var(--r);box-shadow:var(--sticker);padding:12px 13px 13px}.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:9px}.card-name{font-size:16px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-share{font-family:var(--display);font-weight:800;font-size:15px;line-height:1.1;padding:3px 9px 2px;border-radius:999px;background:var(--lane);color:#0d0f14}.card-list{margin:0;display:flex;flex-direction:column;gap:7px}.card-item{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:14px}.card-item dt{color:var(--faint)}.card-item dd{margin:0;font-weight:600;color:var(--chalk)}.card-none{margin:0;font-size:12.5px;color:var(--faint)}@media(max-width:1000px){.layout{grid-template-columns:minmax(0,1fr)}.controls{position:static}}@media(max-width:560px){.icon-btn{width:34px;height:34px;font-size:15px}.chip-main{padding:9px 10px 9px 8px;font-size:13px}.chip-block{width:34px;font-size:13px}.segmented button{padding:8px 16px}.btn{padding:9px 14px}.sharebar-track{height:44px}.sharebar-handle{width:32px;margin-left:-16px}.sharebar-grip{width:5px}.field{font-size:16px}.board{gap:12px}.board-desc{order:3;flex-basis:100%}.board-stats{order:2}.stat{padding:5px 11px}.lane-head{flex-wrap:wrap;gap:6px}.lane-total{width:100%;margin-left:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-delay:0ms!important;transition-duration:.001ms!important}}@media print{:root{--ink: #fff;--slab: #fff;--slab-2: #fff;--line: #c8ccd4;--line-soft: #e2e5ea;--chalk: #101219;--mute: #4b5261;--faint: #6b7280;color-scheme:light}.controls,.btn,.board:before{display:none}.layout{grid-template-columns:minmax(0,1fr)}.lane{animation:none;break-inside:avoid}.board-sub{color:#fff;background:#33281a}}