:root{color:#222;font-family:system-ui,Yu Gothic UI,sans-serif}body{background:#f4f5f8;margin:0}#app{max-width:960px;margin:0 auto;padding:16px}h1{font-size:1.4rem}h2{margin:0 0 8px;font-size:1.1rem}h3{margin:0 0 6px}section{background:#fff;border-radius:8px;margin-bottom:12px;padding:12px 16px;box-shadow:0 1px 3px #0002}.row{flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0;display:flex}.reel{border-top:1px solid #ddd;margin-top:8px;padding-top:8px}table{border-collapse:collapse;margin:6px 0}th,td{text-align:left;border:1px solid #ccc;padding:3px 8px}th{background:#eef}td.p{text-align:right;font-variant-numeric:tabular-nums}.num{width:70px}.bad{color:#c00}.hidden{display:none}textarea{box-sizing:border-box;width:100%}.cards{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.card{background:#fafafa;border:1px solid #ccc;border-radius:6px;width:150px;padding:6px}.reel-col{margin:0 0 4px;padding:0;list-style:none}.reel-col li{background:#fff;border:1px solid #ddd;justify-content:space-between;gap:6px;padding:2px 6px;font-size:.9rem;display:flex}.reel-col li+li{border-top:none}.reel-col .c{color:#666;font-variant-numeric:tabular-nums}.card .total{margin-bottom:4px;font-size:.85rem}.reel-col li.beige{background:#f5ecd7}.reel-col li.bronze{background:#d9a56f}.reel-col li.silver{background:#d3d8de}.reel-col li.gold{background:#f2d35c}.reel-col li.shift{background:#ffb55e}.reel-col.edit{width:170px;margin-bottom:8px}.reel-col.edit li{padding:0}.reel-col.edit li.empty{background:#fff}.reel-col.edit select{background:0 0;border:none;width:100%;padding:3px 4px;font-size:.9rem}.card.sample{width:190px}.reels .reel{border:1px solid #ddd;border-radius:6px;flex:none;max-width:100%;margin:0;padding:8px}.reels .reel>.row{max-width:200px}.reels{flex-wrap:nowrap;align-items:flex-start;gap:12px;padding-bottom:8px;display:flex;overflow-x:auto}.reels .reel details{width:200px}.reels .reel .cards{flex-direction:column}@keyframes swap-a{0%,49.9%{visibility:visible}50%,to{visibility:hidden}}@keyframes swap-b{0%,49.9%{visibility:hidden}50%,to{visibility:visible}}.reel-col li.swap{outline-offset:-2px;outline:2px solid #e33;grid-template-columns:100%;padding:0;display:grid}.reel-col li.swap>div{grid-area:1/1;min-width:0}.reel-col li.swap select{pointer-events:none;background:0 0;border:none;width:100%;padding:3px 4px;font-size:.9rem}.reel-col li.swap .a{animation:1.6s step-end infinite swap-a}.reel-col li.swap .b{animation:1.6s step-end infinite swap-b}.reel-col li.swap .beige{background:#f5ecd7}.reel-col li.swap .bronze{background:#d9a56f}.reel-col li.swap .silver{background:#d3d8de}.reel-col li.swap .gold{background:#f2d35c}.reel-col li.swap .shift{background:#ffb55e}.fit{color:#176b32}.skill-table-scroll{overscroll-behavior-x:contain;max-width:100%;margin:6px 0;overflow-x:auto}.skill-table{table-layout:auto;width:100%;min-width:720px}.skill-table th,.skill-table td{white-space:nowrap}.skill-table th:first-child,.skill-table td:first-child{z-index:1;background:#fff;position:sticky;left:0}.skill-table th:first-child{z-index:2;background:#eef}.skill-table td:first-child input{box-sizing:border-box;width:150px;max-width:30vw}.skill-table input.num{box-sizing:border-box;width:72px}.skill-table select{max-width:180px}@media (width<=600px){#app,section{padding:10px}.skill-table{min-width:680px}.skill-table td:first-child input{width:120px}.skill-table select{max-width:150px}}