:root{--gold:#d3b477;--text:#f5efe5;--muted:#b9ad9d;--panel:rgba(10,11,14,.82)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#07080a;color:var(--text);font-family:"Noto Serif KR","Malgun Gothic",serif}
button,a{font:inherit}
#vn-app{position:relative;width:100%;height:100%;min-height:100vh;min-height:100dvh}
.screen{display:none;position:relative;width:100%;height:100%;min-height:100vh;min-height:100dvh}
.screen.active{display:block}
#title-screen,.stage{position:relative;background:
linear-gradient(rgba(5,7,10,.45),rgba(5,7,10,.8)),
radial-gradient(circle at 50% 30%,#28313b 0,#10151b 45%,#06080b 100%)}
.title-wrap{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:24px;text-align:center}
.eyebrow{letter-spacing:.28em;color:var(--gold);font-size:11px}.title-wrap h1{margin:10px 0 0;font-size:clamp(70px,18vw,150px);font-weight:500;letter-spacing:.08em}.subtitle{margin:12px 0 6px;font-size:22px;letter-spacing:.3em;color:#e2d0aa}.version{color:var(--muted);font-size:12px}
.menu{display:grid;gap:10px;width:min(320px,90vw);margin-top:34px}.menu button,.menu a,.topbar button{border:1px solid rgba(211,180,119,.45);background:rgba(12,14,18,.72);color:var(--text);padding:13px;border-radius:8px;text-decoration:none;cursor:pointer}.menu button:hover,.menu a:hover{border-color:var(--gold);background:rgba(211,180,119,.12)}
.stage{position:relative;width:100%;height:100%;min-height:100vh;min-height:100dvh;overflow:hidden;background:
linear-gradient(rgba(3,5,7,.25),rgba(3,5,7,.55)),
radial-gradient(circle at 50% 20%,#34404b 0,#151b22 42%,#090b0e 100%)}
.rain{position:absolute;inset:-20%;pointer-events:none;opacity:.42;background-image:repeating-linear-gradient(105deg,transparent 0 13px,rgba(210,225,240,.2) 14px,transparent 15px 27px);animation:rain .42s linear infinite}
.vignette{position:absolute;inset:0;box-shadow:inset 0 0 180px 60px rgba(0,0,0,.78);pointer-events:none}
.topbar{position:absolute;z-index:4;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:linear-gradient(rgba(0,0,0,.72),transparent)}
.topbar button{padding:8px 10px;font-size:12px}.top-actions{display:flex;gap:8px}#chapter-title{font-size:13px;color:#d8cbb8;text-align:center}
.dialogue-box{position:absolute;z-index:5;left:50%;bottom:calc(18px + env(safe-area-inset-bottom, 0px));transform:translateX(-50%);width:min(980px,calc(100% - 28px));min-height:180px;padding:28px 30px 34px;border:1px solid rgba(211,180,119,.42);border-radius:12px;background:var(--panel);backdrop-filter:blur(12px);box-shadow:0 20px 80px rgba(0,0,0,.5);cursor:pointer}
.speaker{min-height:25px;margin-bottom:10px;color:var(--gold);font-weight:700;font-size:18px}.dialogue-box p{margin:0;min-height:72px;font-size:clamp(17px,2.4vw,22px);line-height:1.85;word-break:keep-all}.next-indicator{position:absolute;right:22px;bottom:13px;color:var(--gold);animation:blink 1s infinite}
dialog{width:min(760px,92vw);max-height:80vh;border:1px solid #6a5840;border-radius:12px;background:#111318;color:var(--text)}dialog::backdrop{background:rgba(0,0,0,.7)}dialog header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #34302b}dialog button{background:transparent;border:1px solid #5a4d3c;color:var(--text);padding:8px 12px;border-radius:6px}#log-list{overflow:auto;max-height:60vh;padding:12px 0}.log-item{padding:12px 4px;border-bottom:1px solid #292a2c;color:#d7d0c6}.log-item strong{color:var(--gold);margin-right:8px}
.shake{animation:shake .28s linear}.flash::after{content:"";position:absolute;inset:0;background:white;animation:flash .35s forwards;z-index:7}.memory .dialogue-box{border-color:#8f6d6d;box-shadow:0 0 60px rgba(90,30,35,.3)}
@keyframes rain{to{transform:translate(-20px,45px)}}@keyframes blink{50%{opacity:.2}}@keyframes flash{to{opacity:0}}@keyframes shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}@media(max-width:600px){.dialogue-box{min-height:210px;padding:24px 20px 32px}.topbar{align-items:flex-start}#chapter-title{max-width:42%;font-size:11px}.title-wrap h1{font-size:72px}}

@media(max-height:520px){
  .dialogue-box{min-height:140px;padding:18px 22px 28px}
  .dialogue-box p{min-height:50px;font-size:16px;line-height:1.6}
}

.background-layer{position:absolute;inset:0;background-size:cover;background-position:center;transition:opacity .8s ease,filter .8s ease}
.character-layer{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
.character{position:absolute;bottom:0;max-height:92%;max-width:58%;object-fit:contain;object-position:bottom center;opacity:0;transform:translateY(25px) scale(.98);transition:opacity .5s ease,transform .5s ease,filter .4s ease;filter:drop-shadow(0 20px 28px rgba(0,0,0,.65))}
.character.visible{opacity:.9;transform:translateY(0) scale(1)}
.character.left{left:2%}.character.center{left:50%;transform:translate(-50%,25px) scale(.98)}.character.center.visible{transform:translate(-50%,0) scale(1)}.character.right{right:2%}
.choice-panel{position:absolute;z-index:8;left:50%;top:50%;transform:translate(-50%,-50%);width:min(620px,calc(100% - 34px));padding:24px;border:1px solid rgba(211,180,119,.5);border-radius:12px;background:rgba(9,11,14,.92);backdrop-filter:blur(14px);box-shadow:0 30px 100px rgba(0,0,0,.6)}
.choice-panel.hidden{display:none}.choice-panel h3{margin:0 0 18px;color:#e4d5bb;text-align:center}.choice-panel button{display:block;width:100%;margin:9px 0;padding:14px;border:1px solid #6d5a3f;border-radius:8px;background:#16171a;color:#f5efe5;cursor:pointer}.choice-panel button:hover{border-color:var(--gold);background:#242016}
.save-slots{display:grid;gap:10px;padding:12px 0}.save-slot{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px;border:1px solid #3d3933;border-radius:8px}.save-slot button{padding:8px 12px;border:1px solid #6a5840;background:#17181b;color:#fff;border-radius:6px}
#settings-dialog label{display:block;margin:18px 0;color:#ddd}#settings-dialog input[type=range]{width:100%;margin-top:8px}
.top-actions{flex-wrap:wrap;justify-content:flex-end}
@media(max-width:700px){
  .character{max-width:88%;max-height:78%}
  .topbar{padding:8px}.topbar button{padding:6px 7px;font-size:10px}
  #chapter-title{display:none}
  .dialogue-box{background:rgba(8,10,13,.9)}
}

.runtime-status{padding:6px 9px;border-radius:999px;background:rgba(0,0,0,.52);color:#d8c9af;font:10px Arial,sans-serif;white-space:nowrap}
.runtime-status.ok{color:#bde4bd}.runtime-status.warn{color:#f2c48d}
.character{z-index:2;opacity:0}
.character.visible{opacity:1}
.character.center{max-height:88%;max-width:min(62vw,760px);object-fit:contain;object-position:center bottom}
@media(max-width:700px){
  .runtime-status{display:none}
  .character.center{max-width:94vw;max-height:76%}
}


/* v0.8.4 Game Interaction Fix */
#vn-app{isolation:isolate}
.rain,.vignette,.background-layer,.character-layer{
  pointer-events:none !important;
  user-select:none;
}
.title-wrap,.title-wrap .menu,.title-wrap .menu *,
.topbar,.topbar *, .dialogue-box,.choice-panel,.choice-panel *,
dialog,dialog *{
  pointer-events:auto;
}
.title-wrap{z-index:10}
.menu{position:relative;z-index:20}
.menu button,.menu a{position:relative;z-index:21;cursor:pointer;touch-action:manipulation}
.topbar{z-index:30}
.dialogue-box{z-index:25}

.chapter-list{display:grid;gap:12px}.chapter-item{padding:14px;border:1px solid #4a4338;border-radius:9px;background:#14161a}.chapter-item p{color:#b9b1a5}.debug-list{list-style:none;padding:0;max-height:440px;overflow:auto}.debug-list li{padding:8px 0;border-bottom:1px solid #333;font:12px Consolas,monospace}.debug-list time{color:#d3b477;margin-right:8px}.character.battle-pose{max-width:78%;max-height:94%}


/* v0.9.1 Engine Stabilization */
.background-layer.bg-fade{animation:bgFade .45s ease}
@keyframes bgFade{from{opacity:.25}to{opacity:1}}

#stage.zoom-in{animation:cameraZoom .75s ease}
#stage.blackout::after,
#stage.whiteout::after{
  content:"";position:absolute;inset:0;z-index:90;pointer-events:none;
}
#stage.blackout::after{background:#000;animation:overlayPulse .8s ease}
#stage.whiteout::after{background:#fff;animation:overlayPulse .8s ease}
#stage.slow-motion{animation:slowMotion .9s ease}

@keyframes cameraZoom{from{transform:scale(1)}to{transform:scale(1.035)}}
@keyframes overlayPulse{0%{opacity:0}45%{opacity:1}100%{opacity:0}}
@keyframes slowMotion{0%{filter:blur(0)}50%{filter:blur(1px) saturate(.65)}100%{filter:blur(0)}}

.debug-state{
  background:#101216;border:1px solid #4d4437;border-radius:8px;
  padding:12px!important;line-height:1.75
}
.debug-list .warn{color:#e4c16f}
.debug-list .error{color:#ef8d8d}


/* v0.9.2 Scene Command System */
.character{
  transition:opacity .25s ease,filter .25s ease,transform .25s ease;
}
.character.speaker-active{
  opacity:1;
  filter:brightness(1.08) saturate(1.05);
  transform:translateY(0) scale(1.01);
}
.character.speaker-dim{
  opacity:.58;
  filter:brightness(.62) saturate(.75);
  transform:translateY(5px) scale(.985);
}


/* v0.9.3 Save & Playback Convenience */
.character.enter-left{animation:characterEnterLeft .32s ease}
.character.enter-right{animation:characterEnterRight .32s ease}
.character.fade-in{animation:characterFadeIn .3s ease}
.character.exit-left{animation:characterExitLeft .28s ease}
.character.exit-right{animation:characterExitRight .28s ease}
.character.fade-out{animation:characterFadeOut .28s ease}

@keyframes characterEnterLeft{
  from{opacity:0;transform:translateX(-48px)}
  to{opacity:1;transform:translateX(0)}
}
@keyframes characterEnterRight{
  from{opacity:0;transform:translateX(48px)}
  to{opacity:1;transform:translateX(0)}
}
@keyframes characterFadeIn{from{opacity:0}to{opacity:1}}
@keyframes characterExitLeft{from{opacity:1}to{opacity:0;transform:translateX(-48px)}}
@keyframes characterExitRight{from{opacity:1}to{opacity:0;transform:translateX(48px)}}
@keyframes characterFadeOut{from{opacity:1}to{opacity:0}}

.history-list{display:grid;gap:10px;max-height:62vh;overflow:auto}
.history-item{
  display:flex;justify-content:space-between;gap:14px;align-items:center;
  padding:12px;border:1px solid #4a4338;border-radius:8px;background:#121419
}
.history-item p{margin:5px 0;color:#c6c0b6}
.history-item small{color:#888}
.history-item button{white-space:nowrap}

.log-item{
  display:grid;grid-template-columns:minmax(80px,auto) 1fr auto;
  gap:10px;align-items:start
}
.log-item button{
  padding:5px 8px;font-size:12px;white-space:nowrap
}

/* v0.9.8.5 Scene ID-linked CG */
.scene-cg-layer{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;overflow:hidden;pointer-events:none;opacity:0;visibility:hidden;background:#05070a}
.scene-cg-layer.visible{opacity:1;visibility:visible}
.scene-cg-layer img{width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(.82) contrast(1.04);transform:scale(1.015)}
.scene-cg-layer.cg-fade{animation:sceneCgFade .55s ease-out both}
.scene-cg-layer.cg-flash{animation:sceneCgFlash .42s ease-out both}
.scene-id-badge{position:absolute;z-index:24;left:18px;top:74px;max-width:min(520px,calc(100% - 36px));padding:7px 11px;border:1px solid rgba(211,180,119,.44);border-radius:7px;background:rgba(5,7,10,.72);color:#dfc28a;font-size:12px;letter-spacing:.04em;opacity:0;transform:translateY(-4px);transition:.24s ease;pointer-events:none}
.scene-id-badge.visible{opacity:1;transform:translateY(0)}
@keyframes sceneCgFade{from{opacity:0;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}
@keyframes sceneCgFlash{0%{opacity:0;filter:brightness(2)}30%{opacity:1;filter:brightness(1.35)}100%{opacity:1;filter:brightness(1)}}
@media(max-width:700px){.scene-id-badge{top:64px;font-size:10px}}


/* v0.9.8.6 — exact scene CG visibility */
.scene-cg-layer{
  z-index:20 !important;
  background:#05070a;
}
.scene-cg-layer img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
#stage.scene-cg-active .character-layer,
#stage.scene-cg-active .character{
  opacity:0 !important;
  visibility:hidden !important;
  display:none !important;
}
#stage.scene-cg-active .background-layer{
  visibility:hidden;
}
#stage.scene-cg-active .scene-cg-layer{
  display:flex;
}
#stage:not(.scene-cg-active) .scene-cg-layer{
  opacity:0;
  visibility:hidden;
}
#stage.scene-cg-active .rain,
#stage.scene-cg-active .vignette{
  z-index:21;
}
#stage.scene-cg-active .dialogue-box{
  z-index:25;
}
#stage.scene-cg-active .topbar{
  z-index:30;
}


/* v0.9.8.7 — Responsive collapsible control panel */
.topbar{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:start;
  gap:12px;
  padding:
    calc(10px + env(safe-area-inset-top,0px))
    calc(12px + env(safe-area-inset-right,0px))
    10px
    calc(12px + env(safe-area-inset-left,0px));
}
.topbar-home,
.control-menu-toggle,
.icon-button{
  min-height:40px;
  white-space:nowrap;
}
.topbar-compact-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
}
.control-menu-toggle{
  display:none;
}
.control-menu-backdrop{
  position:fixed;
  inset:0;
  z-index:38;
  background:rgba(0,0,0,.58);
  backdrop-filter:blur(2px);
}
.control-menu-backdrop[hidden]{
  display:none;
}
.top-actions{
  grid-column:1 / -1;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}
.control-panel-header,
.control-group h2{
  display:none;
}
.control-group{
  display:contents;
}
.control-grid{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}
.advanced-controls{
  display:contents;
}
.advanced-controls summary{
  display:none;
}
.advanced-controls .control-grid{
  display:flex;
}
body.control-menu-open{
  overflow:hidden;
}

@media(max-width:900px){
  .topbar{
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    background:linear-gradient(rgba(0,0,0,.78),rgba(0,0,0,.22),transparent);
  }
  #chapter-title{
    display:block;
    max-width:none;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px;
  }
  .control-menu-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .top-actions{
    position:fixed;
    z-index:40;
    top:env(safe-area-inset-top,0px);
    right:0;
    bottom:0;
    width:min(390px,88vw);
    display:block;
    padding:
      18px
      calc(16px + env(safe-area-inset-right,0px))
      calc(20px + env(safe-area-inset-bottom,0px))
      16px;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:rgba(10,12,16,.97);
    border-left:1px solid rgba(211,180,119,.38);
    box-shadow:-18px 0 60px rgba(0,0,0,.58);
    transform:translateX(104%);
    visibility:hidden;
    pointer-events:none;
    transition:transform .25s ease,visibility .25s;
  }
  .top-actions.open{
    transform:translateX(0);
    visibility:visible;
    pointer-events:auto;
  }
  .control-panel-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:18px;
    padding-bottom:14px;
    border-bottom:1px solid rgba(211,180,119,.22);
  }
  .control-panel-header > div{
    display:grid;
    gap:7px;
  }
  .control-panel-header strong{
    font-size:20px;
    color:#f2e3c8;
  }
  .control-group{
    display:block;
    margin:0 0 22px;
  }
  .control-group h2{
    display:block;
    margin:0 0 9px;
    font-size:12px;
    font-weight:600;
    letter-spacing:.16em;
    color:var(--gold);
  }
  .control-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }
  .top-actions button{
    width:100%;
    min-height:48px;
    padding:10px 9px;
    font-size:14px;
    line-height:1.25;
    text-align:center;
  }
  .advanced-controls{
    display:block;
    margin-top:4px;
    border-top:1px solid rgba(211,180,119,.2);
    padding-top:13px;
  }
  .advanced-controls summary{
    display:block;
    padding:10px 2px;
    color:#cbbda8;
    cursor:pointer;
    user-select:none;
  }
  .advanced-controls .control-grid{
    display:none;
    margin-top:9px;
  }
  .advanced-controls[open] .control-grid{
    display:grid;
  }
  .runtime-status{
    display:inline-flex;
    width:max-content;
  }
  .dialogue-box{
    bottom:calc(14px + env(safe-area-inset-bottom,0px));
    width:calc(100% - 24px);
    min-height:190px;
    padding:22px 20px 31px;
  }
  .dialogue-box p{
    font-size:clamp(18px,5.2vw,24px);
    line-height:1.7;
  }
  .scene-id-badge{
    top:calc(66px + env(safe-area-inset-top,0px));
  }
}

@media(max-width:520px){
  .topbar{
    gap:7px;
    padding-left:8px;
    padding-right:8px;
  }
  .topbar-home{
    max-width:64px;
    padding:7px 8px!important;
    white-space:normal;
    line-height:1.2;
  }
  .topbar-compact-actions{
    gap:6px;
  }
  .topbar-compact-actions .icon-button{
    min-width:42px;
    padding:7px!important;
  }
  .control-menu-toggle{
    padding:7px 9px!important;
  }
  #chapter-title{
    padding:0 3px;
    font-size:11px;
  }
  .top-actions{
    width:min(360px,94vw);
  }
  .dialogue-box{
    min-height:180px;
  }
}

@media(max-height:560px) and (orientation:landscape){
  .top-actions{
    width:min(520px,72vw);
  }
  .control-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .dialogue-box{
    min-height:128px;
    padding:16px 18px 25px;
  }
  .dialogue-box p{
    min-height:44px;
    font-size:16px;
    line-height:1.55;
  }
}


/* v0.9.8.8 — mobile character vertical position correction */
.character{
  --mobile-character-offset-y:-10vh;
  --mobile-character-scale:1;
}

@media(max-width:900px){
  .character{
    bottom:0;
    max-height:86%;
    max-width:94vw;
    object-position:center bottom;
    transform:
      translateY(calc(var(--mobile-character-offset-y) + 25px))
      scale(calc(var(--mobile-character-scale) * .98));
    transform-origin:center bottom;
  }

  .character.visible{
    transform:
      translateY(var(--mobile-character-offset-y))
      scale(var(--mobile-character-scale));
  }

  .character.center{
    left:50%;
    max-width:94vw;
    max-height:86%;
    transform:
      translate(-50%,calc(var(--mobile-character-offset-y) + 25px))
      scale(calc(var(--mobile-character-scale) * .98));
  }

  .character.center.visible{
    transform:
      translate(-50%,var(--mobile-character-offset-y))
      scale(var(--mobile-character-scale));
  }

  .character.left{left:0}
  .character.right{right:0}

  .character[data-asset-type="expression"]{max-height:90%}
  .character[data-asset-type="faceExpression"]{
    max-height:94%;
    max-width:100vw;
  }
  .character.battle-pose,
  .character[data-asset-type="battle"]{
    max-height:88%;
    max-width:100vw;
  }
}

@media(max-width:520px){
  .character,
  .character.center{max-height:84%}

  .character[data-character-id="jeon-seoyul"]{max-height:88%}
  .character[data-character-id="seo-harin"][data-asset-type="expression"]{max-height:92%}
  .character[data-character-id="seo-harin"][data-asset-type="faceExpression"]{max-height:96%}
}

@media(max-height:560px) and (orientation:landscape){
  .character,
  .character.center{
    max-height:92%;
    --mobile-character-offset-y:-5vh;
  }

  .character[data-asset-type="expression"],
  .character[data-asset-type="faceExpression"]{
    --mobile-character-offset-y:-7vh;
  }
}


/* v0.9.8.9 — compact mobile bottom sheet */
@media(max-width:900px){
  .top-actions{
    top:auto !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100% !important;
    max-width:none !important;
    height:auto !important;
    max-height:min(46vh,430px) !important;
    padding:
      12px
      calc(14px + env(safe-area-inset-right,0px))
      calc(12px + env(safe-area-inset-bottom,0px))
      calc(14px + env(safe-area-inset-left,0px)) !important;
    border-left:0 !important;
    border-top:1px solid rgba(211,180,119,.45);
    border-radius:18px 18px 0 0;
    box-shadow:0 -18px 55px rgba(0,0,0,.58);
    transform:translateY(105%) !important;
    background:rgba(12,14,18,.94) !important;
    backdrop-filter:blur(14px);
  }
  .top-actions.open{
    transform:translateY(0) !important;
  }
  .control-panel-header{
    margin-bottom:8px !important;
    padding:0 0 8px !important;
    min-height:42px;
  }
  .control-panel-header > div{
    min-width:0;
    flex:1;
  }
  .control-panel-header strong{
    display:block;
    white-space:nowrap;
    word-break:keep-all;
    overflow-wrap:normal;
    font-size:18px !important;
    line-height:1.2;
  }
  #control-menu-close{
    flex:0 0 44px;
    width:44px !important;
    min-height:40px !important;
  }
  .control-group{
    margin:0 0 6px !important;
    border:1px solid rgba(211,180,119,.18);
    border-radius:10px;
    overflow:hidden;
  }
  .control-group h2{
    display:flex !important;
    align-items:center;
    justify-content:space-between;
    margin:0 !important;
    padding:10px 12px;
    cursor:pointer;
    user-select:none;
    font-size:13px !important;
    letter-spacing:.08em !important;
  }
  .control-group h2::after{
    content:"＋";
    font-size:18px;
    line-height:1;
  }
  .control-group.expanded h2::after{
    content:"－";
  }
  .control-group .control-grid{
    display:none !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:7px !important;
    padding:0 8px 9px;
  }
  .control-group.expanded .control-grid{
    display:grid !important;
  }
  .control-group:first-of-type{
    border-color:rgba(211,180,119,.34);
  }
  .control-group:first-of-type .control-grid{
    display:grid !important;
  }
  .control-group:first-of-type h2::after{
    content:"－";
  }
  .top-actions button{
    min-height:42px !important;
    padding:7px 6px !important;
    font-size:12px !important;
  }
  .advanced-controls{
    margin-top:6px !important;
    padding-top:4px !important;
  }
  .advanced-controls summary{
    padding:8px 10px !important;
    font-size:12px;
  }
  .advanced-controls[open] .control-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    padding:0 8px 8px;
  }
  .control-menu-backdrop{
    background:rgba(0,0,0,.28) !important;
    backdrop-filter:blur(1px) !important;
  }
}