/* A focused workspace: one task at a time, with secondary choices in dialogs. */
[hidden]{display:none!important}
body:has(dialog[open]){overflow:hidden}
#avatar-canvas,#letter-avatar{width:100%;height:100%;max-width:none;max-height:none;aspect-ratio:auto;object-fit:fill}
.studio-page .site-header{min-height:76px;border-bottom:0}
.studio-page .workspace-heading{display:flex;align-items:baseline;gap:20px;padding:24px 0 28px}
.workspace-heading h1{font-size:30px;letter-spacing:-1px;line-height:1.2}.workspace-heading p{font-size:13px;color:var(--muted)}
.studio-page .sign-explorer{grid-template-columns:320px minmax(0,1fr);gap:28px}
.task-panel{min-width:0;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.task-tabs{display:flex;padding:6px;margin:12px;background:#f4f2f6;border-radius:10px;gap:4px}
.task-tabs button{flex:1;padding:11px 6px;min-height:44px;border:0;border-radius:7px;background:transparent;color:#6a6375;font-family:inherit;font-size:12px;font-weight:600}
.task-tabs button[aria-pressed=true]{background:#fff;color:#40364f;box-shadow:0 1px 5px #33224412}
.studio-page .sentence-card{padding:20px;margin:0;border:0;border-radius:0;background:transparent}
.studio-page .sentence-heading{margin-bottom:24px}.studio-page .sentence-heading h2{font-size:21px}.studio-page .sentence-heading p{font-size:12px;margin-top:6px}.sentence-icon,.sentence-footer{display:none}
.studio-page .sentence-modes{display:flex;width:100%;margin-bottom:22px;background:transparent;border:0;padding:0;gap:8px}
.studio-page .sentence-modes button{flex:1;min-height:44px;padding:8px 5px;font-size:11px;border:1px solid #e5dfee;border-radius:8px;background:#fff}
.studio-page .sentence-modes button[aria-pressed=true]{background:#f2edf8;color:#58416f;border-color:#bfaed2;box-shadow:none}
.studio-page .beta-label{display:none}.studio-page .compose-row{flex-direction:column;gap:12px}.studio-page .compose-row .primary-button{width:100%;min-height:46px}
.studio-page #word-input{font-size:13px}.studio-page .sentence-examples{gap:7px;margin-top:20px;flex-wrap:wrap}.studio-page .sentence-examples>span{display:none}.studio-page .sentence-examples button{font-size:11px;background:#f8f7fa;border:0;padding:7px 9px}
.studio-page .composer-hint{font-size:11px;line-height:1.7}.studio-page .translation-preview{padding:12px}.translation-preview-heading{flex-wrap:wrap}
.studio-page .input-message:empty{display:none}.studio-page .library-panel{padding:8px 20px 20px;border:0;border-radius:0;background:transparent}.studio-page .library-content{padding:0}
.browse-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0 20px;color:var(--muted);font-size:11px}.browse-heading button{font-size:11px;min-height:32px}
.studio-page .word-list{max-height:360px;grid-template-columns:1fr}.studio-page .library-suggestion{margin-top:16px;padding-top:16px}.studio-page .viewer-column{grid-column:auto;grid-row:auto}
.studio-page .player-card{border-radius:16px;box-shadow:none}.studio-page .player-heading{padding:18px 24px;min-height:96px}.studio-page .player-heading h2{font-size:26px;letter-spacing:-.8px}
.studio-page .stage{width:100%;aspect-ratio:auto;height:420px;background:radial-gradient(ellipse at 50% 25%,#fcfaf7,#e9e5ee)}
.studio-page .stage-halo,.studio-page .stage-grid{display:none}.studio-page .stage-topline{top:16px;left:22px;font-size:10px}.studio-page .transport{padding:16px 24px}.studio-page .loop-button>span{display:inline}
.studio-page .player-options{padding:0;border-top:1px solid var(--line);border-bottom:0}.studio-page .view-options{border:0;border-radius:0;background:#fff}.studio-page .view-options>summary{padding:14px 24px;background:#fff;font-size:11px}.studio-page .detail-hint{font-size:10px}
.studio-page .studio-footer{margin-top:30px;padding-top:18px}.studio-page .footer-tagline{display:none}
.avatar-trigger{display:flex;align-items:center;gap:10px;padding:6px 10px;border:1px solid #e4dfea;border-radius:10px;background:#fff;color:#494055;font-family:inherit;text-align:left;min-height:52px;flex-shrink:0;cursor:pointer}.avatar-trigger:hover{background:#f7f4fb}.avatar-trigger img{width:38px;height:38px;border-radius:50%;object-fit:cover;background:#ede9f2}.avatar-trigger strong,.avatar-trigger small{display:block}.avatar-trigger strong{font-size:12px;font-weight:650}.avatar-trigger small{font-size:10px;color:#777080;margin-top:3px}.alphabet-avatar-heading{display:flex;justify-content:flex-end;padding:14px 20px;background:#fff}
.studio-dialog{position:fixed;inset:0;margin:auto!important;padding:30px;border:1px solid #e1dbe8;border-radius:20px;background:#fff;color:#342e40;width:min(640px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto;box-shadow:0 24px 90px #21152b30}
.studio-dialog:not([open]){display:none}.studio-dialog::backdrop{background:#211b3259;backdrop-filter:blur(4px)}
.studio-dialog .dialog-close{position:absolute;right:14px;top:14px;width:36px;height:36px;border:0;border-radius:50%;background:#f3f0f6;font-size:24px;color:#665a76;cursor:pointer}
.avatar-picker-heading{margin:4px 30px 24px 0}.avatar-picker-heading h2{font-size:24px;letter-spacing:-.6px;color:#342e40;margin:0}.avatar-picker-heading p{font-size:13px;color:#777080;margin:8px 0}.avatar-picker-heading [role=status]{font-size:12px;color:#68577e}
.avatar-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.avatar-options button{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px 8px 14px;border:2px solid transparent;border-radius:14px;background:#f5f2f8;color:#4a405a;cursor:pointer;font:inherit;min-width:0}
.avatar-options button:hover{background:#ede6f5}.avatar-options button[aria-pressed=true]{border-color:#806799;background:#f1eaf8}.avatar-options button:focus-visible,.avatar-trigger:focus-visible,.task-tabs button:focus-visible{outline:3px solid #a48cbc;outline-offset:3px}
.avatar-options img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:9px}.avatar-options .avatar-name{font-size:14px;font-weight:700}.avatar-options .avatar-description{font-size:10px;color:#777080;text-align:center;line-height:1.4}.avatar-options button[aria-pressed=true] .avatar-name::after{content:' ✓'}
.studio-page .review-panel{width:min(600px,calc(100vw - 32px));padding:30px}.studio-page .review-heading{padding-right:24px}.studio-page .review-heading .eyebrow,.studio-page .feedback-mark{display:none}
@media(max-width:1000px){.studio-page .sign-explorer{grid-template-columns:280px minmax(0,1fr);gap:20px}.studio-page .sentence-card,.studio-page .library-panel{padding-left:16px;padding-right:16px}.studio-page .player-heading{padding:16px}.studio-page .transport{padding:14px 16px}.studio-page .stage{height:390px}.studio-page .transport-row{flex-wrap:wrap;gap:8px}.studio-page .speed-control{gap:2px}.studio-page .speed-control>span{display:none}.studio-page .speed-control button{min-width:32px}.studio-page .loop-button{margin-left:auto}}
@media(max-width:760px){.studio-page .site-header{padding:14px 20px;gap:12px}.studio-page .workspace-heading{padding:20px 0}.workspace-heading h1{font-size:26px}.workspace-heading p{display:none}.studio-page .sign-explorer{display:flex;gap:18px}.task-panel,.studio-page .viewer-column{width:100%}.studio-page .sentence-card{padding:12px 16px 16px}.studio-page .sentence-heading{display:none}.studio-page .sentence-modes{margin-bottom:14px}.studio-page .compose-row{flex-direction:row;align-items:stretch}.studio-page .compose-row .primary-button{width:auto;min-width:110px;font-size:11px;padding:12px}.studio-page .sentence-examples{margin-top:12px}.studio-page .sentence-input-label{font-size:11px}.studio-page .composer-hint{margin-top:12px;margin-bottom:0}.studio-page .stage{height:360px}.studio-page .player-heading{min-height:90px}.studio-page .player-heading h2{font-size:23px}.studio-page .speed-control button{min-width:36px;min-height:42px}.studio-page .play-button,.studio-page .icon-button,.studio-page .loop-button{min-height:42px}.studio-page .studio-footer{margin-top:24px}.studio-dialog{padding:24px 18px}.avatar-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.avatar-options img{max-width:140px}.avatar-picker-heading h2{font-size:22px}.studio-page .review-panel{padding:26px 18px}}
@media(max-width:390px){.studio-page .page-shell{padding:0 12px}.studio-page .site-header{padding:12px}.studio-page .stage{height:320px}.studio-page .speed-control{order:3;width:100%;justify-content:center}.studio-page .speed-control>span{display:inline}.studio-page .speed-control button{flex:1}.avatar-trigger{padding:5px;gap:6px}.avatar-trigger img{width:30px;height:30px}.studio-page .compose-row{flex-direction:column}.studio-page .compose-row .primary-button{width:100%}}
