/* Magazine service study, shared with the existing 503CW interaction pattern. */
:root{--ink:#30342e;--muted:#77776d;--line:#e2dfd5;--accent:#865443;--soft:#f1e9de}
body{background:#f7f5ef}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #ad765d;outline-offset:3px}
.app-header{height:84px;background:#fbfaf6;padding:14px 25px}.brand-mark{background:#353930;color:#fffaf0}.brand h1{font-size:1.05rem}.magazine-nav{display:flex;gap:20px;margin-left:auto;font-size:.78rem}.app-header #open-manual{white-space:nowrap}
.workspace{height:auto;max-height:none;min-height:calc(100dvh - 125px);grid-template-columns:230px minmax(380px,1fr) 330px}
.parts-panel,.info-panel{background:#fcfbf7;max-height:calc(100dvh - 84px);position:sticky;top:0}.stage-panel{min-height:760px;height:calc(100dvh - 84px);max-height:1100px;background:#eef2f2}.stage-panel #viewport{min-height:350px}
.magazine-picker{padding:0 6px 22px;margin-bottom:20px;border-bottom:1px solid var(--line)}.magazine-picker .eyebrow{display:block;font-size:.6rem}.magazine-picker label{display:block;font-size:.8rem;margin:10px 0}
#magazine-model{width:100%;font:inherit;font-size:.85rem;background:#fff;padding:10px;border:1px solid var(--line);border-radius:5px}.magazine-picker p{font-size:.71rem;line-height:1.8;color:var(--muted)}
.magazine-picker details{font-size:.71rem;line-height:1.8}.magazine-picker summary{cursor:pointer;color:var(--accent)}.magazine-picker a{font-size:.7rem}
.learning-launch{background:#eee9df;border-color:#e0d7c7;justify-content:flex-start}.learning-launch button{background:#faf8f3;border-color:#d8d2c7}.learning-launch button[aria-pressed=true]{background:#383c33;color:#fff}
.view-modes{padding:9px 5px}.view-modes button{font-size:.72rem;padding:7px 9px}.stage-caption{left:18px}.stage-caption span:first-child{font-size:.76rem}
.workflow-controls{border-top:1px solid #dadbd2;background:#fcfaf5;padding:17px 23px 14px}.workflow-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.workflow-top .eyebrow{margin:0;color:var(--accent);font-size:.63rem}.workflow-top>span:last-child{font-size:.63rem;color:var(--muted)}
#workflow-step{width:100%;margin:11px 0 0;padding:9px 8px;font:inherit;font-size:.83rem;font-weight:600;background:#fff;border:1px solid var(--line);border-radius:4px;text-overflow:ellipsis}
#workflow-phase{font-size:.78rem;line-height:1.7;margin:11px 0;min-height:2.7em;color:#565d51}.workflow-buttons{display:flex;gap:7px;flex-wrap:wrap}.workflow-buttons button{font-size:.75rem;padding:8px 11px}.workflow-buttons .primary{background:#3b4438;color:#fff;border-color:#3b4438;min-width:85px}
.workflow-range-label{display:flex;justify-content:space-between;font-size:.68rem;color:var(--muted);margin-top:13px}.workflow-range-label output{font-family:Consolas,monospace;color:var(--accent)}
#workflow-progress{width:100%;height:22px;accent-color:#96634b;margin:3px 0 8px}.workflow-options{display:flex;align-items:center;gap:9px;font-size:.68rem;flex-wrap:wrap}.workflow-options label{display:flex;align-items:center;gap:5px}.workflow-options select{border:1px solid var(--line);padding:4px;background:white;color:var(--ink)}#workflow-reference{font-size:.7rem;padding:5px 9px;margin-left:auto;color:var(--accent)}
.workflow-boundary{font-size:.63rem;line-height:1.7;color:var(--muted);margin:9px 0 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.info-tabs{background:#fcfbf7}.info-tabs button{font-size:.75rem}.info-content{padding:23px 21px}.info-content #step-body{font-size:.81rem;line-height:1.9}.info-content .sequence-scope{font-size:.69rem}
.model-label{max-width:235px;white-space:normal;font-size:.65rem;line-height:1.5}.model-label.selected{background:#3c5348}.app-footer{background:#fcfbf7;min-height:42px;height:auto;padding:12px 24px}
@media(max-width:1180px){.workspace{grid-template-columns:200px minmax(350px,1fr) 290px}.info-content{padding:20px 16px}.workflow-controls{padding:15px}.magazine-nav{gap:12px}}
@media(max-width:950px){.workspace{grid-template-columns:200px minmax(0,1fr)}.stage-panel{grid-column:2;grid-row:1;height:790px;min-height:790px}.parts-panel{grid-column:1;grid-row:1;max-height:790px;position:static}.info-panel{grid-column:1/-1;max-height:none;position:static}.info-content{max-width:800px}.info-tabs{position:static}.magazine-nav{font-size:.7rem}.brand p{letter-spacing:1px}}
@media(max-width:580px){.app-header{flex-wrap:wrap;height:auto;padding:14px 16px;gap:8px}.brand{flex:1}.brand h1{font-size:.95rem}.brand p{font-size:.55rem}.brand-mark{width:38px;height:40px}.magazine-nav{order:2;margin-left:0;flex-basis:100%;gap:24px}.workspace{display:flex;flex-direction:column}.stage-panel{position:static;height:auto;min-height:755px;order:0}.stage-panel #viewport{min-height:365px;flex-basis:365px}.parts-panel{position:static;order:2;max-height:630px;min-height:0}.info-panel{order:1}.workflow-controls{padding:14px 16px}.workflow-top>span:last-child{font-size:.59rem}.workflow-buttons{gap:5px}.workflow-buttons button{font-size:.71rem;padding:8px}.workflow-boundary{font-size:.64rem}#workflow-phase{font-size:.74rem}.learning-launch{margin:0 10px 6px}.view-buttons{right:8px}.view-buttons button{font-size:.63rem;padding:6px}.stage-caption{left:12px;max-width:calc(100% - 24px)}.stage-caption span:last-child{max-width:90%;font-size:.65rem}.app-footer{padding:13px 17px}.magazine-picker{padding-top:3px}}