.speaker-main{padding-top:48px}.speaker-heading{margin-bottom:35px}.edition-label{font-size:10px;font-weight:700;letter-spacing:1.4px;color:#7b6280}.speaker-heading h1{font-size:clamp(36px,4.1vw,56px);letter-spacing:-2px;line-height:1.08;margin:13px 0}.speaker-heading>p{font-size:14px;line-height:1.6;color:var(--muted)}.speaker-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(300px,1fr);gap:38px;align-items:start}.speaker-preview{min-width:0}#editor-canvas{display:block;width:100%;height:auto;aspect-ratio:1846/1228;border:0;padding:0;background:transparent;border-radius:3px;box-shadow:0 5px 18px #28362714}#preview-status{font-size:11px;line-height:1.5;color:var(--muted);margin-top:13px;min-height:17px}.speaker-panel{padding:0;min-width:0}.speaker-panel>.panel-number{margin-bottom:17px}.speaker-panel input[type=text]{font-size:16px}#create-button{width:100%;justify-content:center;min-height:48px;margin-top:24px}.speaker-panel .photo-hint{font-size:11px}#crop-dialog{width:min(550px,calc(100vw - 32px));max-height:94dvh;overflow:auto}.crop-stage{width:min(280px,100%)}#crop-canvas{width:100%;height:auto;aspect-ratio:562/726;touch-action:none}.final-card-wrap img{aspect-ratio:1846/1228}.speaker-main .ready-heading h1{font-size:clamp(34px,4vw,48px)}
@media(max-width:900px){.speaker-layout{gap:24px;grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr)}}@media(max-width:760px){.speaker-main{padding-top:29px}.speaker-heading{margin-bottom:25px}.speaker-heading h1{font-size:37px;letter-spacing:-1.5px}.speaker-heading>p{font-size:13px}.speaker-layout{display:flex;flex-direction:column;gap:26px}.speaker-preview,.speaker-panel{width:100%}.speaker-panel{padding:0}.speaker-panel input[type=text]{font-size:16px}.photo-actions .text-button{min-height:44px}.crop-controls input[type=range]{min-height:44px}#close-crop{min-width:44px;min-height:44px}.crop-footer .button{flex:1}}

@media(max-width:760px){.speaker-main .crop-stage{width:min(205px,100%)}}
@media(max-height:650px){.speaker-main .crop-stage{width:min(155px,100%)}}

.speaker-main .final-card-wrap{border:0;padding:0;background:transparent;border-radius:3px;box-shadow:0 5px 18px #28362714}

/* Flat, paper-toned controls matching the supplied interface reference. */
:root{color-scheme:light;--paper:#f8f6f0;--ink:#242a31;--muted:#60625f;--line:#d4d2c9;--edge:#7b7d77;--blue:#1939a5;--error:#a22d27;--control:#fffdf8}
.speaker-ui{min-width:0;background:var(--paper);color:var(--ink)}
.speaker-ui button:focus-visible,.speaker-ui a:focus-visible,.speaker-ui input:focus-visible,.speaker-ui [tabindex]:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.speaker-panel>.panel-number{color:var(--muted)}
.speaker-panel>label{font-size:14px;font-weight:600;margin-bottom:10px}
#person-name{height:52px;border:1px solid var(--edge);border-radius:3px;padding:12px 14px;background:var(--control);color:var(--ink);font-size:16px;scroll-margin-block:100px}
#person-name::placeholder{color:var(--muted);opacity:1}
#person-name[aria-invalid=true]{border:2px solid var(--error)}
.speaker-panel .input-meta{justify-content:flex-end;margin-top:6px;font-size:12px;color:var(--muted)}
.speaker-panel .field-error{font-size:13px;line-height:1.5;color:var(--error)}
.speaker-panel .photo-field{margin-top:26px}
.speaker-panel .photo-label-row{gap:16px;align-items:baseline;margin-bottom:10px}
.speaker-panel .photo-label{font-size:14px;font-weight:600}
.speaker-panel .photo-picker{min-height:90px;padding:15px;gap:12px;border:1px dashed var(--edge);border-radius:3px;background:var(--control);color:var(--ink)}
.speaker-panel .photo-picker:hover{border-style:solid;border-color:var(--blue);background:var(--control)}
.speaker-panel .photo-picker>.icon{width:24px;height:24px;color:var(--blue)}
.speaker-panel .photo-picker>span:nth-child(2){flex:1;min-width:0}
.speaker-panel .photo-picker strong{font-size:14px;font-weight:600}
.speaker-panel .photo-picker small{margin-top:5px;font-size:12px;line-height:1.5;color:var(--muted)}
.speaker-panel .photo-plus{font-size:24px;color:var(--muted)}
.speaker-panel .photo-hint,.speaker-panel .photo-status{font-size:13px;line-height:1.6;color:var(--muted);margin-top:10px}
.speaker-panel .photo-added{gap:14px;padding:12px;border:1px solid var(--edge);border-radius:3px;background:var(--control)}
.speaker-panel .photo-added img{width:48px;height:62px;border-radius:2px}
.speaker-panel .photo-added>div{min-width:0}
.speaker-panel .photo-added strong{font-size:14px;font-weight:600}
.speaker-ui .photo-actions{gap:0 14px;margin-top:2px}
.speaker-ui .photo-actions .text-button{font-size:13px;min-height:44px}
.speaker-ui .button{min-height:50px;padding:13px 24px;gap:10px;border-radius:3px;font-size:14px;font-weight:600;line-height:1.4;text-align:center;transition:background .15s,color .15s}
.speaker-ui .primary{background:var(--blue);color:white;border-color:transparent;box-shadow:none}
.speaker-ui .primary:hover{background:#102a85;box-shadow:none}
.speaker-ui .secondary{background:transparent;border-color:var(--edge);color:var(--ink);box-shadow:none}
.speaker-ui .secondary:hover{background:#eeece5;border-color:var(--ink)}
.speaker-ui .button:disabled{background:#e2e0d8;color:var(--muted);border-color:var(--edge);opacity:1}
#create-button{min-height:50px;margin-top:28px;justify-content:center}
.speaker-ui .text-button,.speaker-ui .back-button{min-height:44px;font-size:14px;color:var(--blue);text-underline-offset:4px}
.speaker-ui .text-button{text-decoration:underline}
.speaker-ui .text-button:hover,.speaker-ui .back-button:hover{color:var(--ink)}
.speaker-ui .danger-text{color:var(--error)}
.speaker-ui .privacy-note{display:block;margin-top:15px;font-size:12px;line-height:1.6;color:var(--muted)}
.speaker-ui .privacy-note>.icon{display:none}
.speaker-ui .icon-button{width:44px;height:44px;min-width:44px;border:1px solid var(--edge);border-radius:3px;background:transparent;color:var(--ink)}
.speaker-ui .icon-button:hover{background:#eeece5;border-color:var(--ink)}
.speaker-ui #crop-dialog{border:1px solid var(--edge);border-radius:5px;background:var(--paper)}
.speaker-ui #crop-dialog::backdrop{background:#242a3180}
.speaker-ui #crop-help{font-size:13px;color:var(--muted)}
.speaker-ui .crop-stage{border:1px solid var(--line);border-radius:3px;box-shadow:none;background:var(--control)}
.speaker-ui .crop-controls label{font-size:13px;color:var(--ink)}
.speaker-ui .position-controls label{font-size:12px}
.speaker-ui .crop-controls input[type=range]{min-height:44px;accent-color:var(--blue)}
.speaker-ui .success-pill{border:1px solid var(--line);border-radius:3px;background:var(--control);color:var(--blue);font-size:10px}
.speaker-ui .caption-box{max-width:820px;align-items:flex-start;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;margin-top:30px;padding:22px 0 0}
.speaker-ui .caption-box>div{min-width:0}
.speaker-ui .caption-box p{font-size:13px;line-height:1.6;color:var(--muted);overflow-wrap:anywhere}
.speaker-ui #copy-caption{flex-shrink:0;gap:8px}
.speaker-ui .toast{border-radius:3px;background:var(--ink);font-size:13px}
@media(max-width:760px){.speaker-ui .caption-box{display:block}.speaker-ui #copy-caption{margin-top:8px}.speaker-ui .ready-actions{flex-direction:column;align-items:stretch}.speaker-ui .ready-actions .button{width:100%;max-width:none}.speaker-ui .photo-picker{min-height:90px}.speaker-ui .privacy-note{font-size:12px}}
@media(max-width:360px){.speaker-panel .photo-picker{padding:12px;gap:10px}.speaker-panel .photo-plus{font-size:21px}.speaker-ui .photo-actions{gap:0 10px}}
@media(forced-colors:active){.speaker-ui .primary,.speaker-ui .secondary,.speaker-ui .photo-picker{border:1px solid ButtonText}}
@media(max-width:760px){.speaker-ui .site-header{height:auto;min-height:76px;gap:12px;flex-wrap:wrap;padding-block:16px}.speaker-ui .header-date{font-size:10px}}

/* This UI hint sits over the photo opening; canvas exports contain only artwork. */
.speaker-artwork{position:relative;container-type:inline-size}
.placeholder-upload{position:absolute;z-index:1;display:block;border:0;border-radius:1px;padding:0;overflow:hidden;background:transparent;color:#fffdf4;cursor:pointer}
.placeholder-upload[hidden]{display:none}
.placeholder-upload__overlay{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;height:100%;padding:12px;background:rgba(23,32,48,.76);color:#fffdf4;font-size:clamp(10px,2.3cqw,18px);font-weight:600;line-height:1.4;text-align:center;text-wrap:balance;opacity:0;transition:opacity .16s ease}
.placeholder-upload__overlay>.icon{width:clamp(18px,3.5cqw,28px);height:clamp(18px,3.5cqw,28px);flex-shrink:0}
.placeholder-upload:hover .placeholder-upload__overlay,.placeholder-upload:focus-visible .placeholder-upload__overlay{opacity:1}
.speaker-panel .photo-optional{font-size:12px;color:var(--muted);font-weight:400}
@media(prefers-reduced-motion:reduce){.placeholder-upload__overlay{transition:none}}
@media(forced-colors:active){.placeholder-upload:focus-visible .placeholder-upload__overlay{background:Canvas;color:CanvasText;border:1px solid ButtonText}}

.speaker-heading .green-word{color:#34a853}

/* Keep confirmation actions close to the card and inside shorter desktop views. */
.speaker-main.is-ready{padding-top:12px}
#ready-view{padding-top:0;min-height:0}
#ready-view .ready-heading{padding:8px 0 16px}
#ready-view .ready-heading h1{margin:10px 0 8px}
#ready-view .ready-actions{margin:16px 0 8px}
@media(min-width:761px) and (min-height:600px){#ready-view .final-postcard-area{width:min(820px,100%,calc((100dvh - 380px)*1.5032573))}}