.studio-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.event-autocomplete { position:relative; }
.event-autocomplete .field-label { display:block; cursor:text; }
.event-suggestions { position:absolute; z-index:5; top:calc(100% + 12px); left:0; width:max(100%, 300px); max-width:calc(100vw - 36px); background:#fff; border:1px solid #dce2d2; box-shadow:0 14px 40px #17210e26; border-radius:12px; padding:5px; margin:0; list-style:none; max-height:min(360px,48vh); overflow:auto; }
.event-suggestions li[role="option"] { display:flex; align-items:center; gap:12px; padding:10px; border-radius:8px; cursor:pointer; }
.event-suggestions li[role="option"]:hover,.event-suggestions li[aria-selected="true"] { background:#f0f5e6; }
.event-suggestions small,.event-suggestions strong { display:block; line-height:1.35; }
.event-suggestions strong { font:750 14px/1.4 var(--heading); }
.event-suggestions small { color:#526048; margin-top:2px; font-size:12px; }
.event-suggestions li>.icon { width:15px; min-width:15px; margin-left:auto; }
.suggest-icon { display:grid; place-items:center; flex-shrink:0; width:32px; height:32px; border-radius:9px; background:#edf2e3; }
.suggest-icon .icon { width:16px; }
.suggest-empty { color:var(--muted); padding:12px; font-size:13px; }
.studio-posted:not([hidden]) { display:flex; align-items:center; gap:14px; background:#edf5d9; border:1px solid #cbd8b5; border-radius:12px; padding:15px 18px; margin:14px 28px 0; }
.studio-posted>div { flex:1; }
.studio-posted strong,.studio-posted span { display:block; }
.studio-posted strong { font:750 15px/1.4 var(--heading); }
.studio-posted span { font-size:13px; color:#44523b; }
.studio-shell { max-width:1120px; }
.studio-shell .back-link { margin-bottom:17px; }
.studio-title { display:flex; align-items:end; justify-content:space-between; gap:16px; }
.studio-title h1 { font:800 clamp(36px,5vw,62px)/1.08 var(--heading); letter-spacing:-.06em; margin:7px 0 0; }
.studio-title>span,.studio-preview-head>span:first-child { display:flex; align-items:center; gap:7px; }
.studio-title>span { font-size:12px; color:#55624d; padding-bottom:6px; }
.studio-title>span svg,.studio-preview-head svg { width:16px; height:16px; }
.studio-steps { list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:12px; padding:0; margin:25px 0; }
.studio-steps li { display:flex; align-items:center; gap:8px; color:#58624f; padding:0 0 12px; border-bottom:2px solid #d9dfd1; font:650 13px/1.3 var(--heading); }
.studio-steps li.current { border-color:#345419; color:var(--ink); }
.studio-steps li.done { border-color:#9eb671; }
.studio-steps li>span { display:grid; place-items:center; flex-shrink:0; width:23px; height:23px; border-radius:50%; background:#e9eee1; font-size:12px; }
.studio-steps li.current>span { background:var(--dark); color:var(--lime); }
.studio-steps li.done>span { background:var(--lime); }
.studio-steps li svg { width:13px; height:13px; }
.studio-layout { display:grid; grid-template-columns:minmax(0,1.28fr) minmax(0,.9fr); align-items:start; gap:clamp(18px,3vw,36px); }
.studio-editor,.studio-preview { border:1px solid var(--line); border-radius:16px; background:#fff; min-width:0; }
.studio-editor { padding:clamp(20px,3vw,36px); }
.studio-editor h2 { font:800 clamp(23px,2.65vw,35px)/1.15 var(--heading); letter-spacing:-.05em; margin:0; }
.studio-intro { color:#56604e; font-size:14px; line-height:1.6; margin:8px 0 20px; max-width:50ch; }
.studio-preview { overflow:hidden; position:sticky; top:105px; }
.studio-preview-head,.studio-preview-foot { padding:12px 16px; }
.studio-preview-head { display:flex; align-items:center; justify-content:space-between; font:700 12px/1.4 var(--heading); }
.studio-frame { display:grid; place-items:center; background:#1c251e; aspect-ratio:4/3.35; overflow:hidden; }
.studio-frame canvas,.studio-frame img { display:block; width:100%; height:100%; object-fit:contain; min-height:0; }
.studio-preview-foot strong,.studio-preview-foot span { display:block; overflow-wrap:anywhere; }
.studio-preview-foot strong { font:750 15px/1.5 var(--heading); }
.studio-preview-foot span { color:#5e6659; font-size:12px; margin-top:2px; }
.studio-film { display:flex; flex-wrap:wrap; gap:7px; padding:0 16px 14px; }
.studio-film button { border:2px solid transparent; width:44px; height:38px; border-radius:6px; padding:2px; background:transparent; }
.studio-film button[aria-pressed=true] { border-color:#718e38; }
.studio-film img { width:100%; height:100%; object-fit:cover; border-radius:3px; }
.studio-drop { display:grid; justify-items:center; padding:23px 12px; gap:9px; background:#f3f6ed; border:1.5px dashed #adbb9c; border-radius:12px; }
.studio-drop.dragging,.studio-drop:focus-within { outline:2px solid #657f42; outline-offset:2px; }
.studio-drop>.icon { width:30px; height:30px; color:#566c43; }
.studio-drop>strong { font:720 16px/1.3 var(--heading); }
.studio-drop small { text-align:center; color:#57624e; font-size:12px; }
.studio-drop label { cursor:pointer; }
.studio-sample { margin:12px 0 0; font-size:13px; text-decoration:underline; text-underline-offset:3px; }
.studio-actions { display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:18px; margin-top:16px; border-top:1px solid var(--line); }
.studio-actions .button { margin-left:auto; }
.studio-actions .text-button { font-size:13px; }
.studio-actions button:disabled { opacity:.65; cursor:wait; }
.studio-editor .form-field { margin:15px 0; }
.studio-editor .form-field>span { color:var(--ink); font-size:13px; }
.studio-editor .form-field>span small,.studio-editor .form-field>span output { display:inline; margin-left:4px; color:#64705b; font-weight:400; }
.studio-editor input,.studio-editor select { min-width:0; }
.studio-pair { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.studio-switch { display:inline-flex; gap:4px; background:#f0f2e9; padding:4px; border-radius:9px; }
.studio-switch button { background:transparent; color:#4d5846; font-size:13px; font-weight:650; border-radius:6px; padding:8px 12px; }
.studio-switch button[aria-pressed=true] { background:#fff; color:#233120; box-shadow:0 1px 5px #27301a24; }
.studio-editor input[type=range] { padding:0; border:none; accent-color:#64802c; background:transparent; }
.studio-editor input[type=file]:not(.upload-native) { padding:7px; }
.studio-editor input[type=file]::file-selector-button { background:#e6ecd9; border:0; margin-right:8px; border-radius:5px; padding:7px; }
#studio-message:not(:empty) { padding:9px 12px; background:#fbf0dd; border-radius:6px; color:#594118; font-size:13px; margin:13px 0 0; }
.studio-files { list-style:none; margin:12px 0 0; padding:0; }
.studio-files li { display:flex; align-items:center; justify-content:space-between; gap:9px; padding:6px 0; border-top:1px solid var(--line); }
.studio-fpick { display:flex; align-items:center; gap:10px; text-align:left; background:transparent; min-width:0; border-radius:5px; }
.studio-fpick img { width:45px; height:36px; border-radius:4px; object-fit:cover; }
.studio-fpick span { font-size:13px; font-weight:650; overflow-wrap:anywhere; }
.studio-fpick small { display:block; font-size:11px; font-weight:400; color:#616d5c; margin-top:2px; }
.studio-del { background:transparent; color:#58614e; width:30px; height:30px; flex-shrink:0; }
.studio-del svg { width:15px; height:15px; }
.studio-editor .rate-editor legend { font-size:16px; letter-spacing:-.02em; }
.studio-editor .rate-editor>p { margin:6px 0 12px; }
.studio-publish-info { display:flex; align-items:flex-start; gap:10px; background:#f1f5e9; border-radius:9px; padding:12px; margin-top:10px; }
.studio-publish-info>svg { flex-shrink:0; width:18px; margin-top:2px; }
.studio-publish-info strong,.studio-publish-info span { display:block; font-size:13px; }
.studio-publish-info span { color:#526049; margin-top:3px; }
.studio-overrides { border-top:1px solid var(--line); padding:10px 0; font-size:13px; }
.studio-overrides summary { font-weight:650; cursor:pointer; }
.studio-override { margin:9px 0 12px; }
.studio-override form { padding:10px; margin:6px 0; border-radius:7px; background:var(--soft); }
.photo-hit.placed-preview { background:#242b24; }
.photo-hit.placed-preview img { object-fit:contain; }
@media(max-width:750px) {
  .studio-layout { grid-template-columns:1fr; }
  .studio-preview { position:static; }
  .studio-frame { aspect-ratio:16/9; }
  .studio-title { align-items:start; flex-wrap:wrap; gap:5px; }
  .studio-title>span { margin:0; font-size:11px; }
  .studio-steps { gap:5px; margin:17px 0; }
  .studio-steps li { font-size:11px; gap:5px; padding-bottom:8px; }
  .studio-steps li>span { width:19px; height:19px; font-size:10px; }
  .studio-editor { padding:18px; }
  .studio-editor .form-field input,.studio-editor .form-field select { font-size:16px; }
  .studio-posted:not([hidden]) { margin:12px 0 0; flex-wrap:wrap; gap:8px; }
  .studio-posted>div { min-width:65%; }
  .event-suggestions { width:100%; min-width:0; top:100%; }
}
@media(max-width:420px) {
  .studio-pair { grid-template-columns:1fr; gap:0; }
  .studio-steps li { flex-direction:column; align-items:flex-start; }
  .studio-steps li:last-child { white-space:nowrap; }
  .studio-actions .button { font-size:12px; padding:12px; }
}
