/* Four-region controls extend the existing workbench tokens. */
.style-composer{min-width:0;margin-top:22px;padding-top:22px;border-top:1px solid var(--line)}
.style-composer button,.style-composer select,.style-composer input:not([type=range]){min-height:44px}
.style-composer button{transition:background-color .15s,border-color .15s;overflow-wrap:anywhere}
.style-composer button:disabled{cursor:not-allowed}
.style-composer button:focus-visible,.style-composer summary:focus-visible{outline:3px solid #d68b32;outline-offset:3px}
.composer-heading,.composer-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.composer-heading h3,.composer-panel-heading h3{font-size:17px}
.composer-test-label{font-size:11px;letter-spacing:.06em;border:1px solid var(--line);border-radius:4px;padding:3px 8px;color:var(--muted);background:var(--bg)}
.composer-heading p,.composer-panel-heading p{flex-basis:100%;color:var(--muted);font-size:13px}
.composer-recommendations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0 22px}
.composer-recommendations button{display:flex;flex-direction:column;align-items:flex-start;text-align:left;border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:var(--paper);gap:3px}
.composer-recommendations button:hover{border-color:var(--accent);background:var(--bg)}
.composer-recommendations button:last-child:nth-child(odd){grid-column:1/-1}
.composer-recommendations button small{font-size:12px;color:var(--muted);line-height:1.6}
.composer-region-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:5px;background:var(--bg);border:1px solid var(--line);border-radius:9px;margin:18px 0}
.composer-region-tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid transparent;border-radius:5px;padding:9px 4px;text-align:center}
.composer-region-tabs strong{font-size:14px;font-weight:650}
.composer-region-tabs small{font-size:11px;color:var(--muted);line-height:1.4}
.composer-region-tabs button[aria-selected=true],.composer-region-tabs button[aria-pressed=true]{background:var(--paper);border-color:var(--accent);box-shadow:0 2px 4px #183b2510;color:var(--accent)}
.composer-region-panel{min-width:0;padding:16px;border:1px solid var(--line);border-radius:9px;background:var(--paper)}
.composer-panel-heading{padding-bottom:12px;border-bottom:1px solid var(--line)}
.composer-options{border:0;padding:0;margin:16px 0;min-width:0}
.composer-options legend,.composer-options>h4{padding:0;font-size:13px;font-weight:650;margin:0 0 9px}
.composer-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.composer-choice{border:1px solid var(--line);border-radius:7px;padding:10px 6px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;line-height:1.5;background:var(--paper);font-size:12px}
.composer-choice:hover{background:var(--bg);border-color:var(--accent)}
.composer-choice[aria-pressed=true],.composer-swatch[aria-pressed=true],.composer-recommendations [aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--soft);color:var(--accent)}
.composer-letter-sample{display:block;font-size:22px;font-weight:850;line-height:1.4;white-space:nowrap;padding:2px 5px;border-radius:3px;letter-spacing:.03em}
.lettering-gold .composer-letter-sample,.composer-letter-sample.lettering-gold{color:#f3ce69;text-shadow:1px 1px #44280e,2px 2px #44280e;-webkit-text-stroke:.4px #684617;background:#253029}
.lettering-comic .composer-letter-sample,.composer-letter-sample.lettering-comic{color:#ffdf32;text-shadow:1px 1px #132238,2px 2px #132238;-webkit-text-stroke:.7px #132238}
.lettering-neon .composer-letter-sample,.composer-letter-sample.lettering-neon{color:#dcfbff;text-shadow:0 0 4px #09d7ee,0 0 8px #9941e8;background:#152235}
.lettering-chrome .composer-letter-sample,.composer-letter-sample.lettering-chrome{color:#cde7f5;text-shadow:1px 1px #23415f,2px 2px #23415f;-webkit-text-stroke:.6px #23415f}
.lettering-stamp .composer-letter-sample,.composer-letter-sample.lettering-stamp{color:#c44e35;text-shadow:1px 1px #ffe9c4;-webkit-text-stroke:.3px #743322}
.lettering-emboss .composer-letter-sample,.composer-letter-sample.lettering-emboss{color:#f5fbff;text-shadow:1px 1px #3185ca,2px 2px #13518a;-webkit-text-stroke:.5px #2165a0}
.composer-colors,.composer-rhythm,.composer-personal{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);min-width:0}
.style-composer summary{cursor:pointer;min-height:44px;padding:10px 0;font-weight:650;font-size:14px;color:var(--ink)}
.style-composer details[open]>summary{margin-bottom:8px}
.composer-palette-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.composer-palette-grid>button{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:6px;min-width:0;text-align:left;border:1px solid var(--line);border-radius:6px;padding:8px;background:var(--paper);font-size:11px;line-height:1.5}
.composer-palette-grid>button[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:var(--soft)}
.composer-font-label{font-size:11px;font-weight:400;color:var(--muted)}
.composer-swatch{display:flex;min-width:0;height:28px;border-radius:3px;overflow:hidden}
.composer-swatch>i{display:block;flex:1;min-width:0}
.composer-timing-field{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 12px;margin:14px 0;font-size:13px}
.composer-timing-field>span{font-weight:600}
.composer-timing-field>span{display:flex;grid-column:1/-1;justify-content:space-between;gap:12px}
.composer-timing-field input[type=range]{grid-column:1/-1;width:100%;margin:0;min-height:32px;accent-color:var(--accent)}
.composer-timing-field output{font-family:Consolas,monospace;font-variant-numeric:tabular-nums;color:var(--accent);font-weight:700}
.composer-timeline{display:grid;gap:10px;padding:14px 0 5px;margin-top:12px;border-top:1px solid var(--line)}
.composer-timeline>div{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:8px;font-size:11px;line-height:1.4}
.composer-time-track{height:7px;background:var(--line);position:relative;border-radius:4px;overflow:hidden}
.composer-time-track i{position:absolute;top:0;bottom:0;display:block;background:var(--accent);border-radius:4px;min-width:2px}
.composer-timeline time{font-family:Consolas,monospace;color:var(--muted);white-space:nowrap}
.composer-preview-state{padding:11px 13px;border-left:3px solid var(--accent);background:var(--soft);font-size:13px;line-height:1.7;margin:16px 0;color:var(--accent);overflow-wrap:anywhere}
.composer-preview-state.pending,.composer-preview-state[data-state=pending]{border-color:var(--warn);background:var(--warn-bg);color:var(--warn)}
.composer-preview-state.error{border-color:var(--danger);background:var(--danger-bg);color:var(--danger)}
.composer-personal-select{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}
.composer-personal-select select{flex:1 1 180px;min-width:0;width:auto}
.composer-personal-select>.field{flex:1 1 180px;min-width:0}
.composer-personal-select>.field select{width:100%}
.composer-save-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 4px}
.composer-personal-message{min-height:22px;font-size:13px;color:var(--accent);margin:10px 0;overflow-wrap:anywhere}
.composer-personal-message.error{color:var(--danger)}
.composer-delete-confirm{padding:12px;border:1px solid #a4343344;background:var(--danger-bg);border-radius:7px;margin:12px 0;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.composer-delete-confirm p{flex-basis:100%;font-size:13px}
.composer-jump-preview{margin-top:14px;min-height:44px;width:100%}
@media(max-width:1150px){.composer-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.composer-region-panel{padding:13px}.composer-region-tabs small{font-size:10px}}
@media(max-width:620px){.style-composer{margin-top:18px;padding-top:18px}.composer-region-tabs{gap:3px;padding:4px}.composer-region-tabs strong{font-size:13px}.composer-region-tabs small{font-size:10px}.composer-region-panel{padding:12px}.composer-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.composer-palette-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.composer-recommendations{grid-template-columns:repeat(2,minmax(0,1fr))}.style-composer select,.style-composer input:not([type=range]){font-size:16px}.composer-personal-select select{flex-basis:100%;width:100%}.composer-personal-select .btn{flex:1}.composer-save-actions .btn{flex:1 1 44%}.composer-timeline>div{grid-template-columns:38px minmax(0,1fr) auto;gap:6px}}
@media(prefers-reduced-motion:reduce){.style-composer button{transition:none}}

.composer-entrance-description{font-size:11px;font-weight:400;color:var(--muted);line-height:1.5}
.composer-entrance .composer-choice{padding:12px 6px;min-height:72px}
.composer-replay{margin-top:8px}
.composer-letter-sample.lettering-metal-original,.composer-letter-sample.lettering-metal-titanium,.composer-letter-sample.lettering-metal-prism,.composer-letter-sample.lettering-metal-solar{background:#152132;color:#e2edfa;-webkit-text-stroke:.35px #91a8ba;text-shadow:1px 1px #647b92,2px 2px #3e526b,3px 3px #182439;padding:4px 10px}
.composer-letter-sample.lettering-metal-prism{color:#cecaff;text-shadow:1px 1px #8c93d6,2px 2px #555c99,3px 3px #262644}
.composer-letter-sample.lettering-metal-solar{color:#f9d17d;-webkit-text-stroke:.35px #a96d28;text-shadow:1px 1px #a76a25,2px 2px #77440f,3px 3px #372213}