.subs-app{padding:2rem 0 5rem}.subs-intro{max-width:49rem;margin:1rem 0 2rem}.subs-intro h1{font-size:clamp(2.5rem,6vw,4.3rem)}.subs-intro p{color:var(--color-text-muted)}.subs-layout{display:grid;gap:1.25rem;align-items:start}.subs-panel,.subs-result{padding:1.15rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface)}.subs-panel__title,.subs-result__heading{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.subs-panel__title h2,.subs-result h2{font-size:1.2rem}.subs-panel__title p{margin:.35rem 0 0;color:var(--color-text-muted);font-size:.75rem;line-height:1.45}.subs-draft{color:var(--color-primary);font-size:.7rem;font-weight:800;letter-spacing:.13em}.subs-section{margin:1.2rem 0 0;padding:1.2rem 0 0;border:0;border-top:1px solid var(--color-border)}.subs-section legend{padding:0;margin-bottom:.8rem;font-size:.9rem;font-weight:700}.mode-picker{display:grid;gap:.6rem}.mode-option{display:flex;gap:.7rem;align-items:flex-start;padding:.7rem;border:1px solid var(--color-border);border-radius:.7rem;cursor:pointer;transition:border-color .2s,background .2s}.mode-option:has(input:checked){border-color:var(--color-primary);background:rgba(198,255,61,.08)}.mode-option input{margin:.18rem 0 0;accent-color:var(--color-primary)}.mode-option span{display:grid;gap:.15rem}.mode-option strong{font-size:.82rem}.mode-option small{color:var(--color-text-muted);font-size:.7rem}.subs-fields{display:grid;gap:.75rem}.sub-field{display:grid;gap:.35rem}.sub-field span{color:var(--color-text-muted);font-size:.75rem;font-weight:600}.sub-field input{width:100%;min-height:2.75rem;padding:.6rem .7rem;color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:.65rem;outline:0}.sub-field input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(198,255,61,.13)}.subs-notice{margin:1.25rem 0 0;padding:.8rem;color:var(--color-text-muted);border-left:2px solid var(--color-primary);background:rgba(198,255,61,.05);font-size:.75rem;line-height:1.5}.subs-result{position:relative;overflow:hidden;background:linear-gradient(145deg,#192014,#11150f)}.subs-result__heading .eyebrow{margin:0 0 .4rem;font-size:.62rem}.subs-result__heading strong{color:var(--color-primary);font-size:.78rem;white-space:nowrap}.subs-result__summary{min-height:2.8rem;margin:1rem 0;color:var(--color-text-muted);font-size:.8rem;line-height:1.5}.subs-diagram{display:flex;align-items:flex-end;justify-content:center;gap:.55rem;min-height:6.5rem;margin:1rem 0;padding:1.1rem .75rem;border:1px solid rgba(231,255,118,.17);border-radius:.8rem;background:rgba(0,0,0,.14)}.sub-box{position:relative;display:grid;place-items:center;width:2.55rem;height:2.55rem;color:#10140e;background:var(--color-primary);border-radius:.35rem;font-size:.68rem;font-weight:800}.sub-box.is-reversed{color:var(--color-primary);background:#11150f;border:1px solid var(--color-primary)}.sub-box.is-arc{transform:translateY(var(--arc-offset)) rotate(var(--arc-rotation))}.sub-box small{position:absolute;top:calc(100% + .25rem);color:var(--color-text-muted);font-size:.55rem;white-space:nowrap}.subs-readouts{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;margin:1rem 0}.subs-readouts div{padding:.75rem;border-radius:.65rem;background:rgba(0,0,0,.17)}.subs-readouts span{display:block;color:var(--color-text-muted);font-size:.62rem}.subs-readouts strong{display:block;margin-top:.35rem;font-size:.95rem}.subs-settings{padding-top:1rem;border-top:1px solid rgba(231,255,118,.15)}.subs-settings h3{margin:0 0 .65rem;font-size:.82rem}.sub-setting{display:flex;justify-content:space-between;gap:.6rem;padding:.55rem 0;border-top:1px solid rgba(231,255,118,.1);font-size:.73rem}.sub-setting:first-child{border-top:0}.sub-setting span{color:var(--color-text-muted)}.sub-setting strong{color:var(--color-primary);font-size:.75rem}.subs-result__note{margin:1rem 0 0;color:var(--color-text-muted);font-size:.68rem;line-height:1.5}@media(min-width:66rem){.subs-layout{grid-template-columns:minmax(0,1fr) minmax(25rem,.9fr)}.subs-panel,.subs-result{padding:1.5rem}.subs-result{position:sticky;top:6.4rem}.subs-fields{grid-template-columns:1fr 1fr}}@media(max-width:25rem){.subs-readouts{grid-template-columns:1fr}.sub-box{width:2.1rem;height:2.1rem}}
