/* Readable prototype: explicit sizes override the original narrow-screen rules. */
body.readable-ui{--read-text:22px;--read-label:20px;--read-help:18px;--read-button:20px;--read-heading:32px;--read-height:64px;--read-ink:#292129;--read-muted:#53434b;--read-accent:#87153f}
body.readable-ui .brief-shell{font-family:Arial,Helvetica,sans-serif;color:var(--read-ink);background:#fffdf9;padding:40px;min-width:0;border:1px solid #e5cdd5;box-shadow:0 20px 65px #120b1430}
body.readable-ui .create-grid{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);align-items:start;gap:48px}
body.readable-ui .brief-shell .brief-topline{font-size:var(--read-help);line-height:1.5;letter-spacing:0;gap:12px;flex-wrap:wrap;color:var(--read-muted)}
body.readable-ui .brief-shell .brief-steps{margin:20px 0 32px;gap:12px;padding:0}
body.readable-ui .brief-shell .brief-steps li{font-size:17px;line-height:1.4;gap:8px;color:var(--read-muted);padding-bottom:14px;min-width:0;flex-wrap:wrap}
body.readable-ui .brief-shell .brief-steps li span{width:32px;height:32px;flex:0 0 32px;font-size:17px;line-height:32px}
body.readable-ui .brief-shell .brief-steps li.active{color:var(--read-accent);font-weight:700}
body.readable-ui .brief-shell .form-title{font:700 var(--read-heading)/1.3 Arial,sans-serif;letter-spacing:0;margin-bottom:16px}
body.readable-ui .brief-shell .form-subtitle{font:400 var(--read-help)/1.6 Arial,sans-serif;color:var(--read-muted);margin-bottom:28px}
body.readable-ui .brief-shell .field label,body.readable-ui .brief-shell legend{font:700 var(--read-label)/1.45 Arial,sans-serif;color:var(--read-ink);margin-bottom:12px;display:block}
body.readable-ui .brief-shell .field{margin-bottom:28px;min-width:0}
body.readable-ui .brief-shell .field input,body.readable-ui .brief-shell .field textarea,body.readable-ui .brief-shell .field select{font:400 var(--read-text)/1.6 Arial,sans-serif;letter-spacing:0;color:var(--read-ink);background:#fff;border:2px solid #83717a;border-radius:12px;padding:15px 16px;min-height:64px;width:100%;max-width:100%;box-shadow:none}
body.readable-ui .brief-shell .field textarea{min-height:300px;resize:vertical}
body.readable-ui .brief-shell .field input::placeholder,body.readable-ui .brief-shell .field textarea::placeholder{color:#62535b;opacity:1;font-size:var(--read-help)}
body.readable-ui .brief-shell .field small,body.readable-ui .brief-shell .textarea-meta,body.readable-ui .brief-shell .optional,body.readable-ui .brief-shell .draft-explainer,body.readable-ui .brief-shell .prototype-note,body.readable-ui .brief-shell .birthday-checkout .field-help{font:400 var(--read-help)/1.6 Arial,sans-serif;color:var(--read-muted)}
body.readable-ui .brief-shell .field small{display:block;margin-top:10px}
body.readable-ui .brief-shell .textarea-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
body.readable-ui .brief-shell #story-count{white-space:nowrap;color:var(--read-muted)}
body.readable-ui .story-example{padding:20px;background:#f5eeea;border-left:4px solid #8b4961;border-radius:0 12px 12px 0;margin:0 0 16px;font:400 var(--read-help)/1.65 Arial,sans-serif;color:var(--read-muted)}
body.readable-ui .story-example strong{display:block;color:var(--read-ink);margin-bottom:8px}
body.readable-ui .story-example p{font:inherit;color:inherit;margin:0 0 10px}
body.readable-ui .brief-shell .story-prompts{gap:10px;margin-bottom:18px;display:flex;flex-wrap:wrap}
body.readable-ui .brief-shell .story-prompts button{font:400 var(--read-help)/1.4 Arial,sans-serif;padding:12px 16px;min-height:54px;border:2px solid #8b7580;color:var(--read-ink);background:#fff;border-radius:12px}
body.readable-ui .brief-shell .story-prompts button[aria-pressed=true]{background:#efe0e6;border-color:var(--read-accent);font-weight:700;color:#61102e}
body.readable-ui .brief-shell .prompt-hint{font:400 var(--read-help)/1.6 Arial,sans-serif;color:var(--read-muted);margin-bottom:26px}
body.readable-ui .brief-shell .choice-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body.readable-ui .brief-shell .choice{min-width:0;display:block}
body.readable-ui .brief-shell .choice span{position:relative;display:flex;align-items:center;justify-content:flex-start;gap:8px;text-align:left;min-height:64px;padding:15px 36px 15px 15px;font:400 var(--read-label)/1.45 Arial,sans-serif;background:#fff;color:var(--read-ink);border:2px solid #8b7580;border-radius:12px;overflow-wrap:anywhere}
body.readable-ui .brief-shell .choice input:checked+span{border-color:var(--read-accent);background:#f8e7ee;color:#61102e;font-weight:700;box-shadow:0 0 0 1px var(--read-accent)}
body.readable-ui .brief-shell .choice input:checked+span:after{content:'✓';position:absolute;right:12px;top:50%;transform:translateY(-50%);font:700 22px/1 Arial,sans-serif;color:var(--read-accent)}
body.readable-ui .button,body.readable-ui .brief-shell .form-footer .button{font:700 var(--read-button)/1.35 Arial,sans-serif;min-height:var(--read-height);padding:17px 22px;border-radius:14px;white-space:normal;gap:12px}
body.readable-ui .brief-shell .form-footer{display:flex;flex-direction:column;align-items:stretch;gap:16px;margin-top:28px}
body.readable-ui .brief-shell .form-footer .button{width:100%;margin:0;background:var(--read-accent);color:#fff;box-shadow:0 6px 18px #87153f20;border:2px solid var(--read-accent)}
body.readable-ui .brief-shell .form-footer .back-button{order:2;display:flex;align-items:center;justify-content:center;gap:10px;min-height:58px;width:100%;font:700 19px/1.4 Arial,sans-serif;border:2px solid #83717a;border-radius:14px;background:#fffdf9;color:#45313b;padding:14px 20px}
body.readable-ui .brief-shell .form-footer-hint{font:400 var(--read-help)/1.5 Arial,sans-serif;color:var(--read-muted);text-align:center}
body.readable-ui .brief-shell .form-footer-hint:empty{display:none}
body.readable-ui .brief-shell .form-readiness,body.readable-ui .brief-shell .field-error,body.readable-ui .brief-shell #birthday-message{font:400 var(--read-help)/1.6 Arial,sans-serif;color:#5d3000;background:#fff2d9;padding:16px;border-width:2px;border-radius:12px}
body.readable-ui .brief-shell .birthday-consent{font:400 var(--read-help)/1.6 Arial,sans-serif;color:var(--read-ink);align-items:flex-start;padding:18px;gap:14px;border:1px solid #b19ba5;background:#fffdf9;border-radius:12px}
body.readable-ui .brief-shell input[type=checkbox]{width:28px;height:28px;flex:0 0 28px;accent-color:var(--read-accent);margin-top:2px}
body.readable-ui .brief-shell #continue-service,body.readable-ui .brief-shell #birthday-prepaid,body.readable-ui .brief-shell #birthday-pay{width:100%;background:var(--read-accent);color:#fff;border:2px solid var(--read-accent)}
body.readable-ui .brief-shell button:disabled{opacity:1;background:#eee7eb!important;color:#594550!important;border-color:#a5939d!important;box-shadow:none;cursor:not-allowed}
body.readable-ui .brief-shell .summary-list{font:400 var(--read-label)/1.65 Arial,sans-serif}
body.readable-ui .brief-shell .summary-list dt{font:700 var(--read-label)/1.5 Arial,sans-serif;color:var(--read-ink)}
body.readable-ui .brief-shell .summary-list dd{font:400 var(--read-label)/1.65 Arial,sans-serif;color:var(--read-ink)}
body.readable-ui .brief-shell .result-actions,body.readable-ui .brief-shell .draft-actions{display:flex;flex-direction:column;gap:12px}
body.readable-ui .brief-shell .inline-link,body.readable-ui .brief-shell .text-link,body.readable-ui .brief-shell #edit-brief{font:700 var(--read-help)/1.5 Arial,sans-serif;min-height:52px;padding:10px 4px;color:#751335;text-decoration:underline;text-underline-offset:4px}
body.readable-ui :is(button,a,input,textarea,select):focus-visible,body.readable-ui .choice input:focus-visible+span{outline:3px solid #2155a6;outline-offset:4px}
body.readable-ui .player-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body.readable-ui .player-controls button{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;width:100%;height:auto;min-height:60px;border:1px solid #c4a5b6;border-radius:14px;font:700 18px/1.4 Arial,sans-serif;padding:14px 10px;color:#fff;background:#49303f}
body.readable-ui .player-controls #audio-play{background:#f7cade;color:#3b1226}
body.readable-ui .control-caption{font:700 17px/1.3 Arial,sans-serif;letter-spacing:0;position:static!important;transform:none!important}
body.readable-ui #mini-player{width:480px;max-width:calc(100vw - 32px);border-radius:18px;padding:8px}
body.readable-ui #mini-player .mini-controls{gap:6px}
body.readable-ui #mini-player button{min-height:64px;height:auto;padding:8px;display:flex;flex-direction:column;gap:6px;border-radius:12px}
body.readable-ui #mini-player .mini-jump>span:not(.control-caption){display:none}
body.readable-ui #reading-player-slot #mini-player{position:static;width:100%;max-width:100%;margin:0 0 24px;transform:none;box-shadow:none}
@media(max-width:1000px){body.readable-ui .create-grid{grid-template-columns:1fr;gap:32px}body.readable-ui .create-intro{position:static;max-width:760px}body.readable-ui .brief-shell{width:100%;max-width:760px;margin-inline:auto}}
@media(max-width:640px){body.readable-ui .brief-shell{padding:24px 18px;border-radius:22px}body.readable-ui .brief-shell .field-row{display:block}body.readable-ui .brief-shell .choice-group{grid-template-columns:1fr}body.readable-ui .brief-shell .brief-steps{gap:8px}body.readable-ui .brief-shell .brief-steps li{display:flex;flex-direction:column;align-items:flex-start;font-size:16px}body.readable-ui .header .button{min-height:52px;font-size:17px;padding:12px 16px}body.readable-ui .hero-actions .button{font-size:19px;min-height:60px}body.readable-ui #mini-player .mini-controls{grid-template-columns:repeat(4,minmax(0,1fr))}body.readable-ui #mini-player .control-caption{font-size:15px}}
@media(max-width:360px){body.readable-ui .brief-shell{padding-inline:14px}body.readable-ui .brief-shell .form-title{font-size:28px}body.readable-ui .player-controls{grid-template-columns:1fr}body.readable-ui .header .brand{font-size:18px}body.readable-ui .header .button{font-size:15px;padding-inline:10px}}
/* All dropdowns open a fullscreen sheet, including on desktop. */
html.reading-choices-open{overflow:hidden}
body.readable-ui .brief-shell .reading-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:68px;border:2px solid #83717a;border-radius:12px;background:#fff;color:var(--read-ink);padding:15px 16px;text-align:left;font:400 var(--read-text)/1.5 Arial,sans-serif;cursor:pointer}
body.readable-ui .reading-select-value{min-width:0;overflow-wrap:anywhere}
body.readable-ui #reading-choices{position:fixed;inset:0;margin:0;width:100%;max-width:none;height:100%;height:100dvh;max-height:none;padding:0;border:0;border-radius:0;background:#fffdf9;color:var(--read-ink);box-shadow:none;overflow:hidden;font-family:Arial,Helvetica,sans-serif;transform:none}
body.readable-ui #reading-choices[open]{display:flex;flex-direction:column}
body.readable-ui #reading-choices::backdrop{background:#21101d}
body.readable-ui .reading-choices-header{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;padding:32px max(24px,calc((100vw - 1120px)/2));border-bottom:2px solid #d8c4cd;background:#f8e7ee;flex-shrink:0}
body.readable-ui .reading-choices-header h2{font:700 36px/1.25 Arial,sans-serif;letter-spacing:0;margin:8px 0 12px;color:var(--read-ink)}
body.readable-ui .reading-choices-header p{font:400 var(--read-help)/1.5 Arial,sans-serif;margin:0;color:var(--read-muted)}
body.readable-ui #reading-choices-close{min-height:60px;flex-shrink:0;border:2px solid var(--read-accent);border-radius:12px;padding:14px 20px;background:#fffdf9;color:var(--read-accent);font:700 20px/1.3 Arial,sans-serif;cursor:pointer}
body.readable-ui .reading-choices-scroll{overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0;padding:32px 24px max(32px,env(safe-area-inset-bottom))}
body.readable-ui #reading-choices-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:1120px;margin:0 auto}
body.readable-ui .reading-choice-option{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:104px;padding:24px;border:2px solid #8b7580;border-radius:16px;background:#fff;color:var(--read-ink);text-align:left;font:700 var(--read-text)/1.45 Arial,sans-serif;cursor:pointer}
body.readable-ui .reading-choice-option[aria-pressed=true]{background:#f8e7ee;border:3px solid var(--read-accent);color:#61102e}
body.readable-ui .reading-choice-state{font:400 18px/1.4 Arial,sans-serif;color:var(--read-accent);flex-shrink:0}
body.readable-ui .brief-shell #story-count{font:400 var(--read-help)/1.6 Arial,sans-serif}
@media(max-width:640px){body.readable-ui .reading-choices-header{padding:20px 18px;gap:12px;flex-wrap:wrap}body.readable-ui .reading-choices-header>div{order:2;width:100%}body.readable-ui #reading-choices-close{margin-left:auto;min-height:54px}body.readable-ui .reading-choices-header h2{font-size:28px}body.readable-ui .reading-choices-header #reading-choices-help{font-size:17px}body.readable-ui .reading-choices-scroll{padding:20px 18px max(24px,env(safe-area-inset-bottom))}body.readable-ui #reading-choices-list{grid-template-columns:1fr;gap:14px}body.readable-ui .reading-choice-option{min-height:88px;padding:18px;gap:12px;flex-wrap:wrap}body.readable-ui .reading-choice-state{font-size:17px}}