/* Shared controls keep native keyboard and touch behaviour, with one visual language. */
select:not([multiple]):not([size]) {
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23C9BCAE' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center;background-size:16px;
  padding-right:36px;min-height:44px;max-width:100%;min-width:0;font-size:16px;line-height:1.35;
  text-overflow:ellipsis;cursor:pointer;
}
select:disabled{cursor:default;opacity:.6}
select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
input[type=text]:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.btn:disabled,.chip:disabled{opacity:.58}
.btn:disabled:active,.chip:disabled:active{transform:none}
.sheet-head .btn,.tray-head .btn{min-height:44px}
.tray-section{padding:12px 0 16px;border-bottom:1px solid var(--hair-lit)}
.tray-section:last-child{border-bottom:0;padding-bottom:0}
.tray-section h3{font:700 11px/1.4 var(--body);letter-spacing:.13em;text-transform:uppercase;color:var(--mint);margin:0 12px 10px}
.tray-explainer{font-size:12px;line-height:1.5;color:var(--ink-2);margin:0 12px 10px}
.tray-legal{display:flex;flex-wrap:wrap;gap:4px 18px;margin:4px 12px 2px;font-size:12px}
.tray-legal a{color:var(--ink-3);text-underline-offset:3px;padding:8px 0}
.tray-legal a:hover,.tray-legal a:focus-visible{color:var(--ink)}
.tray-section .tray-item{min-width:0;min-height:64px;border-color:var(--hair);border-radius:10px;white-space:normal}
.tray-section .tray-item small{color:var(--ink-2)}
.tray-section :is(#voiceBtn,#transferBtn,#recoveryBtn){grid-column:1/-1}
.tray-section #voiceBtn{min-height:52px}
.tray-section .effects-setting{margin-bottom:4px}
.theatre-preferences .theatre-auto-hint{flex:1 1 220px;line-height:1.5}
.theatre-preferences #theatreAvailability{flex-basis:100%;padding-top:5px}

/* The creator has two reversible steps, with its actions always within reach. */
#studioVeil{align-items:center;justify-content:center}
#studioVeil.open{display:flex}
#studioVeil .sheet-studio{max-width:740px;max-height:calc(100dvh - 48px - var(--sat) - var(--sab));overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:125px 96px;padding-top:0}
#studioVeil .sheet-head{position:sticky;top:0;z-index:6;background:var(--night-3);margin:0 -24px 16px;padding:22px 24px 14px}
#studioVeil .studio-actions{position:sticky;bottom:-24px;z-index:6;margin:20px -24px -24px;padding:12px 24px;background:var(--night-2);border-top:1px solid var(--hair-lit);display:flex;gap:8px}
#studioVeil .studio-actions .btn{min-height:44px;white-space:normal;min-width:0}
#studioVeil #savePet{margin-left:auto}
.studio-steps{display:grid;grid-template-columns:1fr 1.4fr;gap:8px;margin:0 0 18px}
.studio-step{display:flex;align-items:center;gap:8px;text-align:left;min-height:48px;padding:9px 12px;border:1px solid var(--hair-lit);border-radius:9px;color:var(--ink-2);font-size:14px;line-height:1.25}
.studio-step span{display:grid;place-items:center;width:23px;height:23px;border:1px solid currentColor;border-radius:50%;flex:none;font-size:12px}
.studio-step[aria-current=step]{color:var(--mint);border-color:var(--mint);background:color-mix(in srgb,var(--mint) 8%,transparent)}
#studioIdentity{display:grid;grid-template-columns:100px minmax(0,1fr);gap:18px;align-items:center}
.studio-identity-portrait{width:100px;height:116px;display:flex;align-items:center;justify-content:center;border:1px solid var(--hair-lit);border-radius:12px;background:radial-gradient(ellipse,var(--key-soft),transparent 70%)}
.studio-identity-portrait .sprite{--pet-h:90px;width:90px}
#studioIdentity>.tool-block{margin:0;min-width:0}
#studioIdentity .personality-editor{grid-column:1/-1;margin:0;padding-top:18px}
#studioIdentity .personality-heading h3{font-size:24px}
#studioIdentity .personality-introduction p{font:500 19px/1.5 var(--hand)}
#studioVeil .gen-stage{background-color:var(--night-3)}
@media(max-width:720px){
  #studioVeil{align-items:flex-end}
  #studioVeil .sheet-studio{max-height:calc(100dvh - 24px - var(--sat));padding:0 16px calc(12px + var(--sab));margin:0;border-radius:20px 20px 0 0;scroll-padding-top:125px}
  #studioVeil .sheet-head{margin:0 -16px 14px;padding:22px 16px 12px}
  #studioVeil .studio-actions{bottom:calc(-12px - var(--sab));margin:18px -16px calc(-12px - var(--sab));padding:12px 16px calc(12px + var(--sab))}
  #studioVeil .studio-actions .btn{flex:1 1 0;padding:9px 10px;font-size:13px}
  #studioVeil #savePet{flex:1.5 1 0}
  .studio-step{font-size:13px;padding:8px;gap:6px}
  #studioIdentity{grid-template-columns:76px minmax(0,1fr);gap:12px}
  .studio-identity-portrait{width:76px;height:100px}
  .studio-identity-portrait .sprite{--pet-h:70px;width:70px}
}
@media(min-width:721px) and (max-height:600px){
  #studioVeil{padding:8px 12px}
  #studioVeil .sheet-studio{max-width:860px;max-height:calc(100dvh - 16px);scroll-padding-block:85px 76px}
  #studioVeil .sheet-head{padding-block:10px;margin-bottom:10px}
  #studioVeil .sheet-head h2{font-size:24px}
  #studioVeil .studio-steps{margin-bottom:10px}
  #studioVeil .studio-tab{min-height:44px;padding:8px 12px}
  #studioVeil .studio-tab-sub{display:none}
  #studioVeil .gen-stage{min-height:150px;height:150px;max-width:280px}
  #studioVeil .gen-mount .sprite{--pet-h:140px}
  #drawPanel:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 20px}
  #drawPanel .drawing-workbench{grid-column:1;grid-row:1/span 5;display:block;min-width:0;position:sticky;top:85px;align-self:start}
  #drawPanel .drawing-paper{max-width:210px;margin:auto}
  #drawPanel .drawing-live{display:none}
  #drawPanel>.tool-block{grid-column:2;margin-bottom:4px}
  #studioVeil .studio-actions{padding-block:8px}
}
@media(forced-colors:active){select:not([multiple]):not([size]){appearance:auto;background-image:none}.studio-step[aria-current=step]{border:2px solid Highlight}}

.on-file-more{min-height:44px;padding:10px 12px;margin-top:4px;border:1px solid var(--hair-lit);border-radius:8px;display:inline-flex;align-items:center;text-align:left;line-height:1.4}
.prop-card{display:flex;flex-direction:column;align-items:center;gap:8px}
.prop-card small{line-height:1.5}
.prop-add-label{display:block;margin-top:auto;padding-top:8px;color:var(--mint);font-size:12px;font-weight:700}
@media(max-width:480px){.prop-tray{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.prop-card{padding:14px 10px}.prop-card small{font-size:12px}.prop-card b{font-size:14px}}