.calc-hero{text-align:center;padding:var(--space-2xl) 0 var(--space-xl)}.calc-hero h1{font-size:var(--font-size-3xl);margin-bottom:var(--space-sm);font-weight:800}.calc-hero p{color:var(--color-text-secondary);font-size:var(--font-size-base);max-width:560px;margin:0 auto}.calc-disclaimer{color:var(--color-text-muted);font-size:var(--font-size-xs);margin-top:var(--space-xs);font-style:italic}.cmp-layout{gap:var(--space-xl);grid-template-columns:260px 1fr;align-items:start;display:grid}.cmp-selector{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-md)}.sel-header{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-secondary);padding-bottom:var(--space-md);margin-bottom:var(--space-sm);border-bottom:1px solid var(--color-border);font-weight:600}.sel-list{flex-direction:column;max-height:520px;display:flex;overflow-y:auto}.fruit-opt{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast);font-size:var(--font-size-sm);display:flex}.fruit-opt:hover{background:var(--color-bg-tertiary)}.fruit-opt.checked{background:#6366f114}.fruit-opt.disabled{opacity:.35;cursor:not-allowed}.fruit-opt input{display:none}.fo-dot{background:var(--color-text-muted);border-radius:50%;flex-shrink:0;width:8px;height:8px}.fo-name{min-width:0;color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;flex:1;font-weight:500;overflow:hidden}.fo-meta{flex-shrink:0;gap:4px;display:flex}.tag-r{font-size:var(--font-size-xs);border-radius:var(--radius-sm);padding:1px 6px;font-weight:600}.tag-r.r-myth{color:var(--color-tier-s);background:#ff6b6b1f}.tag-r.r-lege{color:var(--color-tier-a);background:#ffa94d1f}.tag-r.r-rare{color:var(--color-info);background:#60a5fa1f}.tag-r.r-unco{color:var(--color-tier-c);background:#69db7c1f}.tag-r.r-comm{color:var(--color-text-muted);background:#6b72801f}.tag-t{font-size:var(--font-size-xs);border-radius:var(--radius-sm);background:var(--color-bg-tertiary);color:var(--color-text-secondary);padding:1px 6px;font-weight:600}.fo-dot.r-myth{background:var(--color-tier-s)}.fo-dot.r-lege{background:var(--color-tier-a)}.fo-dot.r-rare{background:var(--color-info)}.fo-dot.r-unco{background:var(--color-tier-c)}.fo-dot.r-comm{background:var(--color-text-muted)}.cmp-empty{text-align:center;color:var(--color-text-muted);padding:var(--space-3xl) 0;font-size:var(--font-size-lg)}.cmp-table{border-collapse:collapse;width:100%}.cmp-table th,.cmp-table td{padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--color-border);text-align:center}.cmp-table th:first-child,.cmp-table td:first-child{text-align:left}.cmp-table thead th{background:var(--color-bg-secondary);top:var(--header-height);z-index:10;position:sticky}.cmp-table th.r-myth{border-top:3px solid var(--color-tier-s)}.cmp-table th.r-lege{border-top:3px solid var(--color-tier-a)}.cmp-table th.r-rare{border-top:3px solid var(--color-info)}.cmp-table th.r-unco{border-top:3px solid var(--color-tier-c)}.cmp-table th.r-comm{border-top:3px solid var(--color-text-muted)}.th-name{font-weight:700;font-size:var(--font-size-sm);color:var(--color-text);margin-bottom:4px;display:block}.th-meta{justify-content:center;gap:4px;display:flex}.row-label{color:var(--color-text-secondary);font-weight:600;font-size:var(--font-size-sm)}.td-val{font-family:var(--font-mono);color:var(--color-primary);font-weight:700}.td-bar.best .bar-fill{box-shadow:0 0 8px}.bar-track{align-items:center;gap:var(--space-sm);display:flex}.bar-fill{border-radius:var(--radius-sm);min-width:4px;height:8px;transition:width .3s}.bar-val{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--color-text-secondary);text-align:right;min-width:18px;font-weight:700}.td-skills ul{text-align:left;font-size:var(--font-size-xs);color:var(--color-text-secondary);list-style:none}.td-skills li{padding:2px 0}.td-skills li:before{content:"• ";color:var(--color-primary)}@media (width<=768px){.cmp-layout{grid-template-columns:1fr}.cmp-selector{order:2}.cmp-table-wrap{order:1}.sel-list{gap:var(--space-xs);flex-flow:wrap;max-height:none}.fruit-opt{font-size:var(--font-size-xs);padding:var(--space-xs) var(--space-sm)}.cmp-table th,.cmp-table td{padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-xs)}}
