:root{
  --bg:#0b0f17;
  --bg2:#121a2c;
  --panel:#0b0f17;
  --panel2:#0f1624;
  --muted:#a9b3c6;
  --text:#e9eef8;
  --panel-header-bg:#121a29;
  --panel-header-bg2:#0c1018;
  --panel-header-text:#e9eef8;
  --nav-bg1:#121a29;
  --nav-bg2:#0c1018;
  --window-bg1:#0b0f17;
  --window-bg2:#121a2c;
  --accent:#6aa9ff;
  --danger:#ff5d5d;
  --line:rgba(255,255,255,.08);
  --shadow: 0 10px 35px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  background: linear-gradient(180deg, var(--nav-bg2) 0%, var(--window-bg1) 120px, var(--window-bg1) 100%);
  color:var(--text);
}

#teacherApp{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
#studentApp{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
#teacherApp.hidden,
#studentApp.hidden,
#launchPage.hidden,
#accessGatePage.hidden{
  display:none !important;
}
#teacherApp:not(.hidden),
#studentApp:not(.hidden){
  display:flex;
}
#launchPage{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
}
#classSelectorPage{
  min-height:100vh;
}
.launch-page{
  background: linear-gradient(180deg, var(--nav-bg2) 0%, var(--window-bg1) 120px, var(--window-bg1) 100%);
}
.access-gate-page{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
  background:
    radial-gradient(circle at 20% 20%, rgba(106,169,255,.16), transparent 32%),
    radial-gradient(circle at 80% 10%, rgba(106,255,210,.12), transparent 30%),
    linear-gradient(180deg, var(--nav-bg2) 0%, var(--window-bg1) 120px, var(--window-bg1) 100%);
}
.launch-card{
  width:min(520px, 100%);
  padding:28px 26px;
  border-radius:22px;
  border:1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,26,41,.96), rgba(12,16,24,.92));
  box-shadow: var(--shadow);
  display:grid;
  gap:14px;
  justify-items:start;
}
.access-gate-card{
  width:min(520px, 100%);
  padding:28px 26px;
  border-radius:22px;
  border:1px solid var(--line);
  background: linear-gradient(180deg, rgba(18,26,41,.96), rgba(12,16,24,.92));
  box-shadow: var(--shadow);
  display:grid;
  gap:14px;
  justify-items:start;
}
.access-gate-card h1{
  margin:0;
}
.access-gate-label{
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
.access-gate-input{
  width:100%;
  min-height:44px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  font:inherit;
  outline:none;
}
.access-gate-input:focus{
  border-color:rgba(106,169,255,.78);
  box-shadow:0 0 0 3px rgba(106,169,255,.18);
}
.launch-logo{
  width:56px;
  height:56px;
  border-radius:16px;
  font-size:20px;
}
.launch-card h1{
  margin:0;
}
.launch-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.topbar{
  position:sticky; top:0; z-index:10;
  display:flex; align-items:center; justify-content:space-between;
  padding:8px 12px;
  background: linear-gradient(180deg, var(--nav-bg1), var(--nav-bg2));
  border-bottom:1px solid var(--line);
  backdrop-filter: blur(10px);
}
.topbar-teacher{
  align-items:center;
  gap:8px;
}
.teacher-brand-stack{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}

.brand{display:flex; align-items:center; gap:8px}
.logo{
  width:40px; height:40px; border-radius:12px;
  background: linear-gradient(135deg, rgba(106,169,255,.95), rgba(106,255,210,.55));
  display:grid; place-items:center;
  font-weight:900; color:#06101f;
}
.brand-title{font-weight:800; color:var(--panel-header-text); line-height:1.05}
.brand-sub{font-size:12px; color:var(--muted)}
.brand-tools{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  flex-wrap:nowrap;
}
.brand-color-pickers{
  display:flex;
  flex-wrap:nowrap;
  gap:8px 10px;
  align-items:center;
  min-width:0;
  overflow:visible;
  padding-bottom:0;
}
.btn-palette-toggle{
  padding:2px 6px;
  min-width:26px;
  min-height:24px;
  font-size:12px;
  line-height:1;
  border-radius:8px;
  margin-left:2px;
  align-self:center;
}
.theme-control{
  display:grid;
  grid-template-columns:auto auto;
  gap:2px 5px;
  align-items:center;
  padding:0;
  border:0;
  background:transparent;
  flex:0 0 auto;
}
.theme-control-label{
  grid-column:1 / -1;
  font-size:10px;
  color:var(--muted);
  white-space:nowrap;
  line-height:1;
}
.theme-control input[type="color"]{
  width:20px;
  height:20px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
}
.theme-code{
  width:52px;
  padding:3px 5px;
  border-radius:8px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.18);
  color:var(--text);
  font-size:11px;
  text-transform:lowercase;
}
.btn-palette-toggle.premium-locked,
.brand-color-pickers.premium-locked{
  opacity:.55;
}
.btn-palette-toggle.premium-locked{
  cursor:not-allowed;
}
.brand-color-pickers.premium-locked input{
  cursor:not-allowed;
}

@media (max-width: 980px){
  .topbar-teacher{
    flex-wrap:wrap;
    align-items:flex-start;
  }
  .tabs,
  .topbar-actions{
    width:100%;
  }
}

.tabs{display:flex; gap:8px; align-items:center}
.tab{
  border:1px solid var(--line);
  background: rgba(255,255,255,.03);
  color:var(--text);
  padding:8px 10px;
  border-radius:12px;
  cursor:pointer;
}
.tab.active{
  border-color: rgba(106,169,255,.55);
  background: rgba(106,169,255,.12);
}
.topbar-actions{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:flex-end;
  margin-left:auto;
}
.plan-badge{
  min-height:26px !important;
  padding:4px 9px !important;
  border-color:rgba(255,255,255,.16) !important;
  color:var(--minor2, var(--muted2));
  font-size:11px !important;
}
.plan-badge.premium{
  border-color:rgba(76,211,142,.42) !important;
  color:rgba(190,255,220,.95);
  background:rgba(76,211,142,.10) !important;
}
.plan-badge.admin::after{
  content:" admin";
  opacity:.72;
  font-size:10px;
}
.plan-admin-card{
  width:min(760px, 94vw);
}
.plan-admin-list{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.plan-admin-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 150px auto;
  align-items:center;
  gap:10px;
  padding:10px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:12px;
  background:rgba(255,255,255,.035);
}
.plan-admin-row b,
.plan-admin-row small{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.plan-admin-row small{
  margin-top:3px;
  color:var(--muted);
  font-size:11px;
}
.premium-lock-note{
  border-color:rgba(245,158,11,.28) !important;
  color:rgba(255,225,170,.9) !important;
}
.class-selector-page{
  display:flex;
  flex-direction:column;
  background:linear-gradient(180deg, var(--nav-bg2) 0%, var(--window-bg1) 120px, var(--window-bg1) 100%);
}
.class-selector-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:100%;
  padding:18px 24px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, var(--nav-bg1), var(--nav-bg2));
}
.class-selector-topbar h1{
  margin:0;
  color:var(--panel-header-text);
}
.class-selector-topbar .muted{
  margin-top:4px;
  color:var(--muted);
}
.class-selector-top-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.class-selector-add-btn{
  width:42px;
  height:42px;
  border-radius:50% !important;
  padding:0 !important;
  display:inline-flex;
  align-items:center;
  justify-content:inherit;
  font-size:26px;
  line-height:1;
}
.class-selector-content{
  flex:1 1 auto;
  min-height:0;
  width:100%;
  padding:18px 24px 28px;
}
#classSelectorStatus{
  margin-top:18px;
  color:var(--muted);
  font-size:clamp(22px, 3vw, 32px);
  font-weight:300;
  letter-spacing:.01em;
}
.class-selector-list{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
  width:100%;
  margin:14px 0 4px;
}
.class-selector-item{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:10px;
  width:100%;
  min-height:154px;
  padding:64px 12px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  color:var(--text);
  text-align:left;
  cursor:pointer;
  overflow:hidden;
}
.class-selector-item:hover{
  border-color:rgba(250,204,122,.34);
  background:rgba(250,204,122,.08);
}
.class-selector-empty-card{
  grid-column:1 / -1;
  padding:18px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.045);
  color:var(--muted);
}
.student-name-choice{
  min-height:124px;
  padding-top:18px;
}
.student-join-code-card{
  display:grid;
  gap:10px;
  max-width:420px;
}
.student-join-code-label{
  color:var(--panel-header-text);
  font-weight:900;
}
.student-join-code-input{
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:900;
}
.student-join-code-help{
  font-size:12px;
}
.class-selector-item[draggable="true"]{
  cursor:grab;
}
.class-selector-item.dragging{
  opacity:.48;
  cursor:grabbing;
}
.class-selector-item.drag-over{
  border-color:rgba(250,204,122,.7);
  box-shadow:0 0 0 2px rgba(250,204,122,.16), var(--shadow);
  transform:translateY(-2px);
}
.class-selector-image-slice{
  position:absolute;
  left:0;
  top:0;
  right:0;
  height:52px;
  border-radius:13px 13px 0 0;
  border-bottom:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 50% 0%, rgba(250,204,122,.32), transparent 55%),
    linear-gradient(90deg, var(--panel-header-bg), var(--panel-header-bg2));
  background-size:cover;
  background-position:center top;
  box-shadow:inset 0 -14px 18px rgba(0,0,0,.18);
  display:grid;
  place-items:center;
  color:var(--panel-header-text);
  font-weight:950;
  letter-spacing:.05em;
  pointer-events:none;
  overflow:hidden;
}
.class-selector-item-main{
  display:grid;
  gap:4px;
  min-width:0;
}
.class-selector-item-main b{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--panel-header-text);
}
.class-selector-item-main small{
  color:var(--muted2);
  font-size:12px;
}
.class-selector-open-pill{
  justify-self:start;
  align-self:flex-start;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  font-size:11px;
  font-weight:800;
}
.class-selector-card-menu{
  position:absolute;
  right:8px;
  bottom:8px;
}
.class-selector-menu-btn{
  width:28px;
  height:28px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.16);
  color:var(--text);
  cursor:pointer;
}
.class-selector-menu-btn:hover{
  background:rgba(255,255,255,.09);
}
.class-selector-menu-popover{
  position:absolute;
  right:0;
  bottom:34px;
  display:none;
  min-width:136px;
  padding:6px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:var(--panel2);
  box-shadow:var(--shadow);
  z-index:4;
}
.class-selector-card-menu.open .class-selector-menu-popover{
  display:grid;
  gap:4px;
}
.class-selector-menu-popover button{
  width:100%;
  padding:7px 8px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--text);
  text-align:left;
  cursor:pointer;
}
.class-selector-menu-popover button:hover{
  background:rgba(255,255,255,.08);
}

.layout{padding:14px}
#teacherApp .layout{
  flex:1 1 auto;
  min-height:0;
  padding:0;
  display:flex;
  flex-direction:column;
}
#teacherApp .layout > .panel{
  display:none;
}
#teacherApp .layout > .panel:not(.hidden){
  display:flex;
}
.panel{
  background: linear-gradient(180deg, var(--window-bg1), var(--window-bg2));
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow: var(--shadow);
  overflow:hidden;
}
#teacherApp .layout > .panel:not(.hidden){
  flex:1 1 auto;
  min-height:0;
  border-radius:0;
  border-left:0;
  border-right:0;
  border-bottom:0;
  box-shadow:none;
  display:flex;
  flex-direction:column;
}
#studentApp .topbar{
  gap:10px 12px;
  flex-wrap:wrap;
  align-items:center;
}
#studentApp .layout{
  flex:1 1 auto;
  min-height:0;
  padding:0;
  display:flex;
  flex-direction:column;
}
#studentApp .layout > .panel{
  display:none;
}
#studentApp .layout > .panel:not(.hidden){
  display:flex;
  flex:1 1 auto;
  min-height:0;
  flex-direction:column;
  border-radius:0;
  border-left:0;
  border-right:0;
  border-bottom:0;
  box-shadow:none;
}
.panel-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 12px;
  border-bottom:1px solid var(--line);
  background: linear-gradient(180deg, var(--window-bg2), var(--window-bg1));
  position: sticky;
  top: 0;
  z-index: 8;
  backdrop-filter: blur(8px);
}
.panel-title{font-weight:800; color:var(--panel-header-text)}
.panel-header-quest{
  align-items:center;
  justify-content:flex-start;
  flex-wrap:nowrap;
  gap:10px;
  overflow:visible;
  z-index:80;
}
.panel-header-quest .panel-title{
  width:auto;
  flex:0 0 auto;
}
.quest-toolbar{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  width:auto;
  flex:1 1 auto;
  min-width:0;
}
.quest-toolbar .btn{
  padding:5px 8px;
  border-radius:10px;
  font-size:12px;
  line-height:1.15;
  white-space:nowrap;
}
.move-path-toggle{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.move-path-icon{
  width:15px;
  height:15px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.move-path-icon svg{
  width:100%;
  height:100%;
  display:block;
  fill:currentColor;
}
.quest-toolbar .select{
  gap:5px;
  font-size:12px;
  white-space:nowrap;
}
.quest-toolbar .select span{
  font-size:11px;
}
.quest-toolbar .select select{
  padding:5px 8px;
  border-radius:10px;
  font-size:12px;
}
.quest-toolbar .divider{
  height:22px;
  margin:0 2px;
}
.quest-toolbar input[type="range"]{
  width:60px !important;
}
.share-block-inline{
  display:flex;
  align-items:center;
  min-width:0;
}
.share-block-inline:empty{
  display:none;
}
.share-block-control{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  padding:7px 8px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  background:rgba(255,255,255,.035);
}
.share-block-control.is-compact{
  gap:4px;
  flex-wrap:nowrap;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
}
.share-block-control.is-disabled{
  opacity:.72;
}
.share-block-label{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}
.share-block-dropdown{
  position:relative;
  z-index:1;
}
.share-block-dropdown[open]{
  z-index:5000;
}
.share-block-dropdown summary{
  list-style:none;
  cursor:pointer;
  min-width:112px;
  padding:6px 10px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
  color:var(--text);
  background:rgba(0,0,0,.16);
  font-size:12px;
}
.share-block-dropdown summary::-webkit-details-marker{
  display:none;
}
.share-block-dropdown.is-disabled summary{
  cursor:default;
}
.share-block-menu{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  z-index:5001;
  min-width:210px;
  max-height:220px;
  overflow:auto;
  padding:8px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:var(--window-bg2);
  box-shadow:var(--shadow);
}
.share-block-option{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px;
  border-radius:8px;
  color:var(--text);
  font-size:12px;
}
.share-block-option:hover{
  background:rgba(255,255,255,.06);
}
.share-block-empty{
  color:var(--muted);
  font-size:12px;
  padding:6px;
}
.share-settings-btn{
  padding:6px 9px !important;
  font-size:12px !important;
}
.share-block-control.is-compact .share-block-dropdown summary,
.share-block-control.is-compact .share-settings-btn{
  min-height:28px;
  padding:5px 8px !important;
  border-radius:10px;
  font-size:12px !important;
  line-height:1;
}
.share-settings-modal{
  position:fixed;
  inset:0;
  z-index:2200;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(0,0,0,.48);
}
.share-settings-card{
  width:min(520px,94vw);
  display:grid;
  gap:14px;
  padding:16px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:20px;
  background:linear-gradient(180deg, var(--window-bg2), var(--window-bg1));
  box-shadow:var(--shadow);
}
.share-settings-header,
.share-settings-footer{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.share-settings-title{
  color:var(--panel-header-text);
  font-size:18px;
  font-weight:900;
}
.share-settings-sub{
  margin-top:4px;
  color:var(--muted);
  font-size:12px;
}
.share-settings-body{
  display:grid;
  gap:10px;
}
.share-settings-check{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  background:rgba(255,255,255,.035);
  color:var(--text);
}
.share-settings-nested{
  display:grid;
  gap:8px;
  margin-left:18px;
}
.btn-controls-toggle{
  background: var(--window-bg1);
  border-color: rgba(255,255,255,.14);
}
.btn-controls-toggle:hover{
  border-color: rgba(255,255,255,.28);
}
.hidden{display:none}

.btn{
  border:1px solid var(--line);
  background: rgba(255,255,255,.04);
  color:var(--text);
  padding:8px 10px;
  border-radius:12px;
  cursor:pointer;
}
.btn:hover{border-color: rgba(106,169,255,.35)}
.btn-danger{border-color: rgba(255,93,93,.35); background: rgba(255,93,93,.08)}
.btn-danger:hover{border-color: rgba(255,93,93,.7)}

.row{display:flex; align-items:center; justify-content:flex-start}
.gap{gap:8px}
.divider{
  width:1px; height:28px;
  background: var(--line);
  display:inline-block;
  margin:0 8px;
}

.input{
  width:320px;
  padding:9px 10px;
  border-radius:12px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.18);
  color:var(--text);
}

.select{display:flex; align-items:center; gap:8px}
.select span{font-size:12px; color:var(--muted)}
.select select{
  padding:8px 10px;
  border-radius:12px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.18);
  color:var(--text);
}

.quest-body{
  display:flex;
  flex:1 1 auto;
  min-height:0;
}
.canvas-wrap{
  position:relative;
  background: var(--window-bg1);
  flex:1 1 auto;
  min-height:0 !important;
}
.canvas-wrap:fullscreen,
.canvas-wrap:-webkit-full-screen{
  width:100vw;
  height:100vh !important;
  min-height:100vh !important;
  background: var(--window-bg1);
}
.canvas-wrap:fullscreen .teacher-quest-floating-actions,
.canvas-wrap:-webkit-full-screen .teacher-quest-floating-actions{
  position:absolute;
  right:16px;
  bottom:16px;
  z-index:20;
}
.canvas-wrap:fullscreen #questCanvas,
.canvas-wrap:-webkit-full-screen #questCanvas{
  width:100%;
  height:100%;
}
.teacher-quest-preview-host{
  position:absolute;
  inset:0;
  z-index:4;
  display:flex;
  align-items:stretch;
  justify-content:stretch;
  width:100%;
  height:100%;
  background: linear-gradient(180deg, rgba(8,12,20,.22), rgba(8,12,20,.34));
}
.teacher-quest-preview-host > .student-quest-shell{
  width:100%;
  height:100%;
}
.teacher-quest-preview-host.hidden{
  display:none !important;
}
.teacher-quest-floating-actions{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:2147483000;
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  max-width:min(460px, calc(100% - 24px));
  pointer-events:none;
}
.teacher-quest-floating-actions .btn,
.teacher-quest-preview-toggle{
  pointer-events:auto;
  padding:8px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(12,18,30,.74);
  color: var(--muted);
  font-size:12px;
  font-weight:500;
  letter-spacing:.01em;
  box-shadow: 0 10px 24px rgba(0,0,0,.24);
  backdrop-filter: blur(10px);
}
.teacher-quest-floating-actions .btn:hover,
.teacher-quest-preview-toggle:hover{
  color: var(--text);
  border-color: rgba(255,255,255,.24);
  background: rgba(16,24,38,.84);
}
.teacher-quest-preview-toggle.is-active{
  color: var(--panel-header-text);
  border-color: rgba(245,158,11,.42);
  background: rgba(245,158,11,.14);
}

#nodeModal{
  z-index:2147483600 !important;
  background:#0b0f14 !important;
}
#nodeModalCard{
  background:#0b0f14 !important;
}

.teacher-quest-preview-mode .panel-header-quest .quest-toolbar{
  opacity:.58;
  pointer-events:none;
}
.teacher-quest-preview-mode .help{
  opacity:.32;
  pointer-events:none;
}
#questCanvas{
  display:block;
  width:100%;
  height:100%;
  background: var(--window-bg1);
}
.statusbar{
  position:absolute; left:10px; bottom:10px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.35);
  color: var(--muted);
  font-size:12px;
}

/* Draggable, collapsible help */
.help{
  position:absolute;
  right:10px;
  top:10px;
  left:auto;
  width:260px;
  max-width:calc(100% - 20px);
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.14);
  background: var(--window-bg1);
  color:var(--muted);
  font-size:12px;
  user-select:none;
  box-shadow:0 10px 28px rgba(0,0,0,.34);
}
.help-titlebar{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  cursor:move;
  margin-bottom:0;
}
.help-title{
  font-weight:800;
  font-size:12px;
  color:var(--text);
}
.help-x{
  border:1px solid var(--line);
  background: var(--window-bg1);
  color:var(--text);
  border-radius:12px;
  padding:6px 10px;
  cursor:pointer;
  font-size:12px;
  line-height:1;
}
.help-content{user-select:text}
.help.collapsed{
  width:fit-content;
  max-width:none;
  min-width:0;
  padding:6px 8px;
  background: var(--window-bg1);
}
.help.collapsed .help-titlebar{
  justify-content:flex-start;
  width:auto;
}

.help.collapsed .help-title{
  white-space:nowrap;
}

.help.collapsed .help-x{
  margin-left:0;
}
.help.collapsed .help-title{
  font-size:12px;
}

.help-content{
  user-select:text;
  margin-top:8px;
}

.help-content ul{
  margin:0;
  padding-left:18px;
}

.help-content li + li{
  margin-top:6px;
}
.small{font-size:12px; color:var(--muted)}

.inspector{
  border-left:1px solid var(--line);
  background: rgba(15,22,36,.55);
}
.inspector-header{
  padding:12px;
  border-bottom:1px solid var(--line);
}
.inspector-title{font-weight:900}
.inspector-sub{font-size:12px; color:var(--muted); margin-top:2px}
.inspector-body{padding:12px}
.muted{color:var(--muted); font-size:13px}

.card{
  margin:12px;
  padding:12px;
  border-radius:16px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.18);
}
.card-title{font-weight:900; margin-bottom:10px}

/* Recovered static shell helpers. The original app relies on app.js for most
   content, but these containers need to match the existing visual system. */
.class-selector-top-actions,
.row.gap{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.two-col > .card{
  min-width:0;
  min-height:0;
  overflow:auto;
}
#tab-assignments .two-col,
#tab-question-bank .two-col{
  flex:1 1 auto;
}
#tab-assets > .card{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
}
#tab-students .two-col{
  flex:1 1 auto;
  grid-template-columns:minmax(260px, 360px) minmax(0, 1fr);
}
.modal{
  position:fixed;
  inset:0;
  z-index:2147483400;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(6px);
}

body.assignment-node-workflow-active #tab-assignments.assignment-node-workflow-overlay{
  position:fixed !important;
  inset:0 !important;
  width:100vw;
  width:100dvw;
  height:100vh;
  height:100dvh;
  max-width:none;
  max-height:none;
  z-index:2147483647;
  display:flex !important;
  flex-direction:column;
  overflow:auto;
  box-sizing:border-box;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:linear-gradient(180deg, #111a1f, #0b1014);
  box-shadow:none;
  transform:none;
}

body.assignment-node-workflow-active{
  overflow:hidden;
}

body.assignment-node-workflow-active #tab-assignments.assignment-node-workflow-overlay .assignment-tab-layout{
  flex:1 1 auto;
  min-height:0;
  padding:14px;
}

.assignment-node-workflow-return{
  margin-left:8px;
  margin-right:auto;
}
.modal-card{
  width:min(860px, 94vw);
  max-height:90vh;
  border:1px solid var(--line);
  background:linear-gradient(180deg, var(--panel2), var(--panel));
  border-radius:18px;
  box-shadow:var(--shadow);
  color:var(--text);
  overflow:auto;
}
.modal-header,
.modal-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid var(--line);
}
.modal-footer{
  justify-content:flex-end;
  border-top:1px solid var(--line);
  border-bottom:0;
}
.modal-header h2{
  margin:0;
  color:var(--panel-header-text);
}
.node-modal-path-controls .btn.active,
.node-modal-path-controls .btn.is-pressed,
.node-modal-path-controls .btn[aria-pressed="true"]{
  border-color:rgba(250,204,122,.95) !important;
  background:linear-gradient(180deg, rgba(250,204,122,.42), rgba(250,204,122,.2)) !important;
  color:#fff4d0 !important;
  box-shadow:
    inset 0 2px 7px rgba(0,0,0,.48),
    0 0 0 1px rgba(250,204,122,.34),
    0 0 14px rgba(250,204,122,.18);
  transform:translateY(1px);
}
.node-modal-path-controls{
  justify-content:flex-end;
}
.node-modal-path-controls .path-toggle-btn{
  white-space:nowrap;
  min-width:92px;
}
.node-modal-path-controls .game-node-toggle{
  min-width:96px;
}
.game-node-editor{
  display:grid;
  gap:14px;
}
.game-node-editor-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(255,255,255,.04);
}
.game-node-editor-head h3{
  margin:2px 0 4px;
  color:var(--panel-header-text);
  font-size:26px;
}
.game-node-kicker{
  color:var(--minor-font-1, #facc7a);
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.game-node-select,
.game-node-config-grid label{
  display:grid;
  gap:6px;
  color:var(--muted2);
  font-size:12px;
  font-weight:800;
}
.game-node-config-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
}
.game-node-config-grid input,
.game-node-config-grid select,
.game-node-select select{
  min-width:0;
}
.student-game-node-shell{
  display:grid;
  gap:12px;
}
.dynamo-battle-scene{
  --battle-scene-layer:linear-gradient(180deg, #111b35 0%, #18284b 32%, #261c37 58%, #0b1019 100%);
  position:relative;
  min-height:clamp(420px, 58vh, 660px);
  overflow:hidden;
  border:1px solid rgba(110,231,255,.18);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(3,7,18,.05), rgba(3,7,18,.22)),
    var(--battle-scene-layer),
    radial-gradient(circle at 20% 20%, rgba(44,255,203,.18), transparent 22%),
    radial-gradient(circle at 82% 18%, rgba(255,46,149,.18), transparent 24%),
    linear-gradient(180deg, #111b35 0%, #18284b 32%, #261c37 58%, #0b1019 100%);
  background-size:cover, cover, auto, auto, auto;
  background-position:center, center, center, center, center;
  background-repeat:no-repeat;
  box-shadow:inset 0 0 70px rgba(0,0,0,.32), 0 18px 48px rgba(0,0,0,.28);
}
.dynamo-battle-platform{
  position:absolute;
  width:25%;
  height:8%;
  border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(0,0,0,.46), rgba(57,255,226,.12) 48%, transparent 72%);
  z-index:2;
}
.dynamo-battle-platform.player{left:18%; bottom:20%;}
.dynamo-battle-platform.opponent{right:16%; bottom:39%;}
.dynamo-battle-dynamo{
  position:absolute;
  z-index:3;
  display:grid;
  place-items:center;
  filter:drop-shadow(0 22px 18px rgba(0,0,0,.45));
  transform-origin:center center;
}
.dynamo-battle-dynamo img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.dynamo-battle-dynamo.player{
  left:28%;
  top:68%;
  width:34%;
  height:34%;
}
.dynamo-battle-dynamo.opponent{
  left:74%;
  top:56%;
  width:26%;
  height:26%;
}
.dynamo-battle-empty{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  border:1px dashed rgba(255,255,255,.2);
  border-radius:18px;
  color:var(--muted2);
  background:rgba(0,0,0,.2);
  text-align:center;
  padding:14px;
}
.dynamo-battle-hud{
  position:absolute;
  z-index:4;
  width:min(320px, 38%);
  padding:10px 14px;
  border:1px solid rgba(255,255,255,.26);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.84), rgba(255,255,255,.54));
  color:#0f172a;
  box-shadow:0 14px 28px rgba(0,0,0,.22);
  font-weight:950;
  text-transform:uppercase;
  text-shadow:0 1px 0 rgba(255,255,255,.55);
}
.dynamo-battle-hud.player{
  left:3%;
  top:23%;
  border-bottom:5px solid rgba(56,189,248,.72);
}
.dynamo-battle-hud.opponent{
  right:3%;
  top:8%;
  border-bottom:5px solid rgba(244,63,94,.72);
}
.dynamo-battle-hud small{
  display:block;
  margin-top:4px;
  text-align:right;
  color:#1e293b;
}
.dynamo-battle-health{
  height:12px;
  margin-top:6px;
  overflow:hidden;
  border:2px solid rgba(15,23,42,.18);
  border-radius:999px;
  background:rgba(15,23,42,.15);
}
.dynamo-battle-health span{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, #22c55e, #86efac);
}
.dynamo-battle-action-bar{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:5;
  display:flex;
  gap:14px;
  align-items:center;
  padding:14px 18px;
  background:linear-gradient(180deg, rgba(2,6,23,.15), rgba(2,6,23,.82));
}
.dynamo-battle-skill{
  width:82px;
  height:82px;
  border-radius:999px;
  border:3px solid rgba(255,255,255,.65);
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.35), transparent 28%),
    linear-gradient(135deg, rgba(57,255,226,.9), rgba(37,99,235,.86));
  color:#fff;
  font-size:12px;
  font-weight:950;
  text-transform:uppercase;
  box-shadow:0 10px 22px rgba(0,0,0,.35);
}
.dynamo-battle-skill.active{
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.45), transparent 28%),
    linear-gradient(135deg, rgba(255,46,149,.95), rgba(245,158,11,.9));
}
@media (max-width: 760px){
  .game-node-config-grid{
    grid-template-columns:1fr;
  }
  .dynamo-battle-hud{
    width:44%;
    font-size:12px;
  }
  .dynamo-battle-skill{
    width:58px;
    height:58px;
    font-size:10px;
  }
}
.modal-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:12px;
}
.btn.secondary{
  background:rgba(255,255,255,.025);
}
.btn.danger,
.btn-danger{
  border-color:rgba(255,93,93,.35);
  background:rgba(255,93,93,.08);
}
.btn.danger:hover,
.btn-danger:hover{
  border-color:rgba(255,93,93,.7);
}
.floating-help-btn{
  position:absolute;
  left:12px;
  bottom:12px;
  z-index:12;
  width:38px;
  height:38px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(11,15,23,.82);
  color:var(--text);
  box-shadow:var(--shadow);
  cursor:pointer;
}
.floating-help-btn:hover{
  border-color:rgba(106,169,255,.45);
}
.help-box{
  position:absolute;
  left:12px;
  bottom:58px;
  z-index:12;
  width:min(360px, calc(100% - 24px));
  max-height:55vh;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(11,15,23,.9);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.asset-picker-list,
.asset-preview-box,
.grade-grid{
  min-height:0;
  min-width:0;
}
.asset-picker-list{
  overflow:auto;
  display:grid;
  gap:8px;
}
.asset-preview-box{
  margin-top:12px;
}
.grade-grid{
  overflow:auto;
}
.student-node-tabs{
  flex:0 0 auto;
  padding:0 2px;
}

.student-quest-shell{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.18));
}
.teacher-student-preview-shell{
  height:100%;
}
.student-quest-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-bottom:1px solid var(--line);
  background: linear-gradient(180deg, var(--window-bg2), var(--window-bg1));
}
.student-quest-title{
  font-weight:800;
  color:var(--panel-header-text);
}
.student-quest-sub{
  margin-top:2px;
  font-size:12px;
  color:var(--muted);
}
.student-quest-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
}
.student-quest-wrap{
  position:relative;
  flex:1 1 auto;
  min-height:0;
  background: var(--window-bg1);
}
.student-quest-canvas{
  display:block;
  width:100%;
  height:100%;
  background: var(--window-bg1);
}
.path-debug-modal{
  position:fixed;
  inset:0;
  z-index:12000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(2,6,12,.72);
  backdrop-filter:blur(10px);
}
.path-debug-card{
  width:min(980px, 96vw);
  max-height:88vh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.16);
  border-radius:22px;
  background:linear-gradient(180deg, rgba(17,24,39,.98), rgba(6,10,18,.98));
  box-shadow:0 24px 80px rgba(0,0,0,.45);
}
.path-debug-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 18px;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.path-debug-title{
  font-size:18px;
  font-weight:900;
  color:var(--panel-header-text);
}
.path-debug-sub{
  margin-top:3px;
  color:var(--muted);
  font-size:12px;
}
.path-debug-summary{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:12px 18px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.path-debug-summary span,
.path-debug-chip{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:3px 8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  font-size:12px;
}
.path-debug-chip.subtle{
  color:var(--muted);
  background:rgba(255,255,255,.03);
}
.path-debug-body{
  overflow:auto;
  padding:12px 18px 18px;
}
.path-debug-body h3{
  margin:14px 0 8px;
  font-size:13px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--minor-font-2, var(--muted));
}
.path-debug-row{
  display:grid;
  grid-template-columns:minmax(180px, 280px) 1fr;
  gap:12px;
  align-items:start;
  padding:10px 0;
  border-top:1px solid rgba(255,255,255,.08);
}
.path-debug-row-title{
  font-weight:800;
  color:var(--text);
}
.path-debug-row-meta{
  margin-top:3px;
  font-size:12px;
  color:var(--muted);
}
.path-debug-chip-wrap{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.student-empty{
  margin:12px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background: rgba(0,0,0,.16);
  color:var(--muted);
}
.student-grade-list{
  display:grid;
  gap:0;
}
.student-grade-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:10px 12px;
  border-bottom:1px solid var(--line);
}
.student-grade-item.revisit{
  background:rgba(255,93,93,.06);
}
.student-grade-item:last-child{
  border-bottom:0;
}
.student-grade-main{
  display:grid;
  gap:3px;
  min-width:0;
}
.student-grade-name{
  font-weight:700;
  color:var(--text);
}
.student-grade-meta{
  font-size:12px;
  color:var(--muted);
}
.student-grade-score{
  flex:0 0 auto;
  min-width:54px;
  text-align:right;
  font-weight:800;
  color:var(--panel-header-text);
}
.student-grade-side{
  display:grid;
  gap:8px;
  justify-items:end;
  flex:0 0 auto;
}
.student-grade-node-btn{
  padding:6px 10px !important;
  font-size:11px;
  white-space:nowrap;
}
.student-grade-score.revisit{
  color:#ffb1b1;
}
.student-grade-score.pending-qualification{
  min-width:140px;
  font-size:12px;
  line-height:1.2;
  color:var(--minor2);
  white-space:normal;
}
.student-grade-warning{
  display:grid;
  gap:4px;
  margin-top:6px;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid rgba(255,93,93,.28);
  background:rgba(255,93,93,.08);
}
.student-grade-warning-title{
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  color:#ff9a9a;
}
.student-grade-warning-body{
  font-size:12px;
  line-height:1.35;
  color:#ffd2d2;
}
.student-results-score-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.student-results-retry-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:999px;
  border:1px solid rgba(126,211,134,.42);
  background:rgba(126,211,134,.12);
  color:#d8ffd9;
  cursor:pointer;
  font-size:17px;
  line-height:1;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}
.student-results-retry-btn:hover{
  background:rgba(126,211,134,.2);
  border-color:rgba(126,211,134,.72);
  transform:translateY(-1px);
}
.grade-reduction-resolver{
  position:fixed;
  z-index:2147483647;
  width:min(320px, calc(100vw - 16px));
  display:grid;
  gap:10px;
  padding:12px;
  border:2px solid rgba(255,180,120,.88);
  border-radius:14px;
  background:rgba(18,20,28,.98);
  box-shadow:0 22px 70px rgba(0,0,0,.72), 0 0 0 9999px rgba(0,0,0,.24), inset 0 0 0 1px rgba(255,255,255,.05);
  color:var(--text);
  pointer-events:auto;
}
.grade-reduction-resolver-title{
  color:#ffaaa6;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.grade-reduction-resolver-body{
  display:grid;
  gap:4px;
  color:var(--minor2);
  font-size:12px;
  line-height:1.35;
}
.grade-reduction-resolver-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.student-mastery-page{
  flex:1 1 auto;
  min-height:0;
  padding:14px;
  overflow:auto;
}
.student-mastery-shell{
  display:grid;
  gap:14px;
  max-width:1100px;
  margin:0 auto;
}
.student-mastery-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  background:
    radial-gradient(circle at top left, rgba(250,204,122,.18), transparent 46%),
    rgba(255,255,255,.045);
}
.student-mastery-title{
  color:var(--panel-header-text);
  font-size:24px;
  font-weight:900;
  line-height:1.05;
}
.student-mastery-sub{
  margin-top:5px;
  color:var(--muted2);
  font-size:13px;
}
.student-mastery-score{
  flex:0 0 auto;
  min-width:94px;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(250,204,122,.28);
  background:rgba(250,204,122,.10);
  color:var(--panel-header-text);
  text-align:center;
  font-size:24px;
  font-weight:950;
}
.student-mastery-summary{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
}
.student-mastery-summary-card{
  display:grid;
  gap:6px;
  min-width:0;
  padding:12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:rgba(255,255,255,.035);
}
.student-mastery-summary-card span{
  color:var(--muted2);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.student-mastery-summary-card b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text);
  font-size:15px;
}
.student-mastery-list{
  display:grid;
  gap:10px;
}
.student-mastery-row{
  display:grid;
  gap:8px;
  padding:12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:rgba(255,255,255,.035);
}
.student-mastery-row-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.student-mastery-tag{
  color:var(--text);
  font-weight:850;
  line-height:1.25;
}
.student-mastery-percent{
  flex:0 0 auto;
  color:var(--panel-header-text);
  font-weight:950;
}
.student-mastery-bar{
  height:10px;
  overflow:hidden;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
}
.student-mastery-bar-fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(94,234,212,.82), rgba(250,204,122,.95));
}
.student-mastery-evidence{
  color:var(--muted2);
  font-size:12px;
}
.student-video-assignment{
  display:grid;
  gap:12px;
}
.student-video-assignment-title{
  font-weight:800;
  color:var(--panel-header-text);
}
.student-video-assignment-meta{
  font-size:12px;
  color:var(--muted);
}
.student-video-assignment-collapsed{
  display:grid;
  gap:10px;
  padding:14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.025);
}
.student-video-assignment-frame{
  display:grid;
  gap:12px;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.1);
  background:#111;
}
.student-video-assignment-frame-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.student-video-assignment-player{
  width:100%;
  max-height:66vh;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:#000;
}
.student-video-assignment-prompt-wrap{
  display:grid;
  gap:10px;
}
.student-video-assignment-prompt{
  display:grid;
  gap:10px;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(106,169,255,.26);
  background:rgba(106,169,255,.08);
}
.student-video-assignment-prompt-title{
  font-weight:800;
  color:var(--panel-header-text);
}
.student-video-assignment-prompt-body{
  display:grid;
  gap:10px;
}
.student-video-assignment-prompt-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.two-col{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 420px;
  gap:12px;
  padding:12px;
}
#tab-assignments .two-col,
#tab-question-bank .two-col,
#tab-assets .assets,
#tab-gradebook .two-col{
  flex:1 1 auto;
  min-height:0;
}
#tab-gradebook .two-col{
  padding:0;
  display:flex !important;
}
#tab-gradebook .card{
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
}
#tab-gradebook .card-title{
  display:none;
}
#tab-gradebook #gradeGridWrapper{
  margin-top:0 !important;
  flex:1 1 auto;
  min-height:0;
  max-height:none !important;
  border-left:0 !important;
  border-right:0 !important;
  border-bottom:0 !important;
}
#gradeGrid{
  table-layout:fixed !important;
  border-collapse:separate !important;
  border-spacing:0;
}
#gradeGrid th,
#gradeGrid td{
  box-sizing:border-box;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#gradeGrid td[data-pending-grade-reduction="true"],
#gradeGrid td[data-grade-reduction-resolution="true"]{
  position:relative;
  padding-right:8px !important;
  overflow:visible;
}
#gradeGrid .grade-reduction-cell-overlay{
  position:absolute;
  inset:0;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:4px;
  padding:2px 4px 2px 6px;
  background:rgba(38,20,24,.97);
  border:1px solid rgba(255,130,130,.72);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
  user-select:none;
}
#gradeGrid .grade-reduction-cell-grade-flow{
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:2px;
  max-width:calc(100% - 40px);
  overflow:hidden;
  white-space:nowrap;
}
#gradeGrid .grade-reduction-cell-grade{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#ffd7d7;
  font-weight:800;
  font-size:10px;
  line-height:1;
}
#gradeGrid .grade-reduction-cell-grade.pending{
  color:#fff0f0;
}
#gradeGrid .grade-reduction-cell-arrow{
  color:rgba(255,215,215,.78);
  font-size:9px;
  font-weight:900;
}
#gradeGrid .grade-reduction-cell-actions{
  position:absolute;
  right:2px;
  bottom:2px;
  display:inline-flex;
  align-items:center;
  gap:2px;
}
#gradeGrid .grade-reduction-cell-action{
  width:12px;
  height:12px;
  padding:0;
  border:0;
  border-radius:3px;
  color:var(--minor2);
  background:transparent;
  font-size:9px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
#gradeGrid .grade-reduction-cell-action:hover{
  background:rgba(255,255,255,.14);
  color:#fff;
}
#gradeGrid .grade-reduction-cell-message{
  position:fixed;
  left:0;
  top:0;
  z-index:2147483646;
  width:220px;
  white-space:normal;
  display:none;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(13,18,25,.96);
  border:1px solid rgba(255,255,255,.16);
  color:var(--minor2);
  font-size:11px;
  line-height:1.35;
  box-shadow:0 12px 26px rgba(0,0,0,.35);
  pointer-events:none;
}
.grade-reduction-cell-message.visible{
  display:block;
}
.gradebook-floating-tooltip{
  position:fixed;
  left:0;
  top:0;
  z-index:2147483647;
  display:none;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,130,130,.36);
  background:rgba(15,18,25,.98);
  color:rgba(255,236,236,.94);
  font-size:12px;
  line-height:1.45;
  white-space:normal;
  overflow-wrap:anywhere;
  box-shadow:0 16px 34px rgba(0,0,0,.48);
  pointer-events:none;
}
.gradebook-floating-tooltip.visible{
  display:block;
}
.gradebook-floating-tooltip.compact{
  padding:7px 9px;
  font-size:11px;
  text-align:center;
  border-color:rgba(255,214,160,.34);
  background:rgba(18,20,28,.98);
}
.gradebook-floating-tooltip.interactive{
  pointer-events:auto;
}
.gradebook-floating-tooltip .grade-curved-show-originals-btn{
  border:0;
  padding:0;
  background:transparent;
  color:#ffd7a3;
  font:inherit;
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}
.gradebook-floating-tooltip .grade-curved-show-originals-btn:hover{
  color:#fff2cf;
}
#gradeGrid td[data-curved-pending-grade="true"]{
  position:relative;
  color:#ffe4e4;
}
#gradeGrid .grade-curved-pending-message{
  position:fixed;
  left:0;
  top:0;
  z-index:2147483646;
  width:238px;
  display:none;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid rgba(255,130,130,.36);
  background:rgba(18,20,28,.97);
  color:rgba(255,232,232,.92);
  font-size:12px;
  line-height:1.35;
  box-shadow:0 12px 28px rgba(0,0,0,.42);
}
#gradeGrid .grade-curved-pending-message.visible{
  display:block;
}
#gradeGrid .grade-curved-show-originals-btn{
  border:0;
  padding:0;
  background:transparent;
  color:#ffd7a3;
  font:inherit;
  font-weight:800;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}
#gradeGrid .grade-curved-show-originals-btn:hover{
  color:#fff2cf;
}
#gradeGrid .gradebook-name-col{
  position:sticky;
  width:132px;
  min-width:132px;
  max-width:132px;
  background:#111;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:8px 0 8px rgba(0,0,0,.25);
  padding:8px;
}
#gradeGrid th.gradebook-name-col{
  z-index:9;
}
#gradeGrid td.gradebook-name-col{
  z-index:7;
}
#gradeGrid .gradebook-name-col-last{
  left:0;
}
#gradeGrid .gradebook-name-col-first{
  left:132px;
}
#gradeGrid .gradebook-slot-head{
  position:relative;
  z-index:5;
  padding:8px;
  border:1px solid rgba(255,255,255,.1);
  min-width:0;
  overflow:visible;
  white-space:normal;
}
#gradeGrid .gradebook-subhead{
  padding:6px;
  border:1px solid rgba(255,255,255,.1);
  font-size:11px;
  min-width:0;
}
.list{
  border-radius:16px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.18);
  overflow:auto;
  max-height: 72vh;
}
#teacherApp .list{
  max-height:none;
  min-height:0;
}
.list-item{
  padding:10px 12px;
  border-bottom:1px solid var(--line);
  cursor:pointer;
}
.list-item:hover{background: rgba(255,255,255,.03)}
.list-item.active{background: rgba(106,169,255,.10); border-left:3px solid rgba(106,169,255,.8)}

.students-manage-layout{
  display:grid;
  grid-template-columns:minmax(340px, 1.02fr) minmax(320px, 1fr);
  gap:16px;
  padding:12px;
  flex:1 1 auto;
  min-height:0;
}
.students-roster-card,
.students-preview-card{
  display:flex;
  flex-direction:column;
  min-height:0;
}
.students-roster-controls{
  display:grid;
  gap:10px;
}
.students-roster-inputs{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:8px;
}
.students-roster-inputs .input{
  width:100%;
  min-width:0;
}
.students-roster-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.students-roster-actions .btn{
  padding-inline:14px;
}
.students-roster-list{
  flex:1 1 auto;
  min-height:0;
  max-height:none;
  padding:6px 0;
}
.students-roster-empty{
  padding:16px 14px;
  color:var(--muted);
}
.students-preview-shell{
  display:flex;
  flex-direction:column;
  gap:12px;
  flex:1 1 auto;
  min-height:0;
}
.students-roster-item{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:68px;
}
.students-roster-thumb{
  width:44px;
  height:44px;
  border-radius:14px;
  flex:0 0 44px;
  overflow:hidden;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--panel-header-text);
  font-size:15px;
  font-weight:900;
}
.students-roster-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.students-roster-main{
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:3px;
}
.students-roster-name{
  font-weight:800;
  color:var(--panel-header-text);
  font-size:14px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.students-roster-sub{
  color:var(--muted2);
  font-size:12px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.student-join-code-row{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin-top:3px;
}
.student-join-code-pill{
  position:relative;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid rgba(250,204,122,.34);
  background:rgba(250,204,122,.10);
  color:var(--panel-header-text);
  font-size:11px;
  font-weight:950;
  letter-spacing:.12em;
  cursor:pointer;
}
.student-join-code-btn{
  padding:3px 7px !important;
  font-size:10px;
  line-height:1.2;
}
.student-join-code-float{
  position:absolute;
  left:50%;
  top:-26px;
  transform:translateX(-50%);
  white-space:nowrap;
  padding:4px 7px;
  border-radius:999px;
  background:rgba(20,28,44,.94);
  color:var(--panel-header-text);
  box-shadow:var(--shadow);
  font-size:10px;
  letter-spacing:0;
  animation:student-code-float 1.1s ease forwards;
  pointer-events:none;
  z-index:5;
}
@keyframes student-code-float{
  0%{opacity:0; transform:translate(-50%, 6px);}
  18%{opacity:1; transform:translate(-50%, 0);}
  78%{opacity:1; transform:translate(-50%, -4px);}
  100%{opacity:0; transform:translate(-50%, -10px);}
}
.students-roster-delete{
  flex:0 0 auto;
  padding:6px 10px;
}
.students-preview-meta{
  display:grid;
  gap:4px;
}
.students-preview-name{
  font-weight:900;
  color:var(--panel-header-text);
  font-size:22px;
}
.students-preview-sub{
  color:var(--muted);
  font-size:13px;
}
.students-preview-toolbar{
  display:grid;
  gap:8px;
}
.students-preview-field{
  max-width:420px;
}
.students-preview-note{
  color:var(--muted2);
  font-size:12px;
}
.student-avatar-page{
  padding:8px 10px;
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:8px;
  overflow:auto;
}
.student-avatar-shell{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.student-avatar-shell-teacher{
  flex:1 1 auto;
  min-height:0;
}
.student-avatar-shell-page{
  width:min(760px, 100%);
  margin:0 auto;
  flex:0 0 auto;
  min-height:0;
}
.student-avatar-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.student-avatar-title{
  font-size:18px;
  font-weight:900;
  color:var(--panel-header-text);
  line-height:1.05;
}
.student-avatar-sub{
  margin-top:3px;
  color:var(--muted);
  font-size:12px;
}
.student-avatar-level-pill{
  flex:0 0 auto;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:var(--panel-header-text);
  font-weight:900;
  font-size:12px;
}
.student-avatar-construction{
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  background:rgba(255,255,255,.045);
  color:var(--panel-header-text);
  font-size:10px;
  font-weight:900;
  text-align:center;
  letter-spacing:0;
  text-transform:uppercase;
}
.student-avatar-stage{
  position:relative;
  border:1px solid var(--line);
  border-radius:20px;
  background:
    radial-gradient(circle at top, rgba(255,255,255,.08), rgba(255,255,255,0) 58%),
    linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.26));
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  padding:6px;
}
.student-avatar-shell-page .student-avatar-stage{
  height:clamp(300px, 56vh, 590px);
}
.student-avatar-shell-teacher .student-avatar-stage{
  height:clamp(410px, 58vh, 600px);
  padding:10px 8px 12px;
}
.student-avatar-shell-teacher .student-avatar-image{
  transform:none;
}
.student-avatar-image{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
}
.student-avatar-dynamo-companion{
  position:absolute;
  transform:translate(-50%, -50%);
  display:grid;
  place-items:center;
  pointer-events:none;
  z-index:2;
  filter:drop-shadow(0 16px 20px rgba(0,0,0,.32));
}
.student-avatar-dynamo-companion.behind-avatar{
  z-index:0;
}
.student-avatar-dynamo-companion.front-avatar{
  z-index:2;
}
.student-avatar-dynamo-companion img{
  width:100%;
  height:auto;
  max-height:100%;
  display:block;
  object-fit:contain;
}
.student-avatar-stage .student-avatar-image.modular-avatar-composite{
  position:relative;
  width:auto;
  height:100%;
  aspect-ratio:2 / 3;
  max-width:100%;
}
.modular-avatar-composite{
  position:relative;
}
.modular-avatar-base{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  pointer-events:none;
}
.modular-avatar-layer{
  position:absolute;
  inset:0;
  background-repeat:no-repeat;
  background-size:600% 600%;
  pointer-events:none;
}
.roster-avatar-composite{
  width:auto;
  height:100%;
  aspect-ratio:2 / 3;
}
.student-avatar-shell-page .student-avatar-image{
  max-height:100%;
}
.student-avatar-stats{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:7px;
}
.student-avatar-stat{
  padding:6px 8px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
}
.student-avatar-stat-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-bottom:4px;
}
.student-avatar-stat-label{
  color:var(--panel-header-text);
  font-weight:800;
  font-size:12px;
}
.student-avatar-stat-value{
  color:var(--muted2);
  font-size:11px;
  font-weight:700;
}
.student-avatar-bar{
  height:7px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.06);
}
.student-avatar-bar-fill{
  height:100%;
  border-radius:999px;
}
.student-avatar-bar-fill.health{
  background:linear-gradient(90deg, #ff5f6d, #ff9f7a);
}
.student-avatar-bar-fill.xp{
  background:linear-gradient(90deg, #5db7ff, #7df0ff);
}
.student-avatar-bar-fill.elixir{
  background:linear-gradient(90deg, #9a7dff, #d86eff);
}
.student-avatar-caption{
  color:var(--muted2);
  font-size:12px;
}
.student-dynamo-panel{
  width:100%;
  display:grid;
  gap:8px;
  padding:10px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:
    radial-gradient(circle at top left, rgba(76,211,142,.10), transparent 38%),
    rgba(255,255,255,.035);
}
.student-dynamo-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.student-dynamo-title{
  color:var(--panel-header-text);
  font-size:14px;
  font-weight:950;
}
.student-dynamo-sub{
  margin-top:2px;
  color:var(--muted2);
  font-size:12px;
  font-weight:800;
}
.student-dynamo-equipped{
  display:grid;
  grid-template-columns:minmax(84px, 120px) minmax(0, 1fr);
  gap:10px;
  align-items:center;
}
.student-dynamo-art{
  min-height:92px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  display:grid;
  place-items:center;
  background:rgba(0,0,0,.18);
  overflow:hidden;
  color:var(--muted);
  font-weight:900;
}
.student-dynamo-art img{
  width:100%;
  height:100%;
  max-height:120px;
  object-fit:contain;
  display:block;
}
.student-dynamo-stats{
  display:grid;
  gap:7px;
}
.student-dynamo-roster{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));
  gap:6px;
}
.student-dynamo-option{
  min-width:0;
  padding:6px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  display:grid;
  grid-template-columns:38px minmax(0, 1fr);
  gap:7px;
  align-items:center;
  text-align:left;
  cursor:pointer;
}
.student-dynamo-option:hover,
.student-dynamo-option.active{
  border-color:rgba(76,211,142,.55);
  background:rgba(76,211,142,.09);
}
.student-dynamo-option-thumb{
  width:38px;
  height:38px;
  border-radius:10px;
  background:rgba(0,0,0,.18);
  display:grid;
  place-items:center;
  overflow:hidden;
}
.student-dynamo-option-thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.student-dynamo-option-main{
  min-width:0;
  display:grid;
  gap:2px;
}
.student-dynamo-option-main b,
.student-dynamo-option-main small{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.student-dynamo-option-main b{
  color:var(--panel-header-text);
  font-size:12px;
}
.student-dynamo-option-main small{
  color:var(--muted2);
  font-size:11px;
  font-weight:800;
}
#student-tab-avatar .student-avatar-page{
  flex:1 1 auto;
  min-height:0;
  padding:10px 12px;
  display:grid;
  grid-template-columns:minmax(310px, .95fr) minmax(360px, 1.05fr);
  align-content:start;
  align-items:start;
  gap:14px;
}
.student-avatar-left-column{
  min-width:0;
  display:grid;
  gap:12px;
  align-content:start;
}
#student-tab-avatar .student-avatar-shell-page{
  width:100%;
  max-width:none;
  grid-column:2;
  grid-row:1;
}
#student-tab-avatar .student-avatar-shell-page .student-avatar-stage{
  flex:0 0 auto;
  height:clamp(350px, 62vh, 640px);
  min-height:0;
}
@media (max-width: 1100px){
  .students-manage-layout{
    grid-template-columns:1fr;
  }
  .student-mastery-summary{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .student-avatar-shell-page .student-avatar-stage{
    height:clamp(260px, 46vh, 460px);
  }
  .class-selector-list{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .student-avatar-stats{
    grid-template-columns:1fr;
  }
  .student-dynamo-equipped{
    grid-template-columns:1fr;
  }
  #student-tab-avatar .student-avatar-page{
    grid-template-columns:1fr;
  }
  #student-tab-avatar .student-avatar-shell-page{
    grid-column:auto;
    grid-row:auto;
  }
  .student-avatar-left-column{
    order:2;
  }
  #student-tab-avatar .student-avatar-shell-page{
    order:1;
  }
}
@media (max-width: 700px){
  .class-selector-topbar{
    align-items:flex-start;
    flex-direction:column;
  }
  .class-selector-list{
    grid-template-columns:1fr;
  }
  .student-mastery-hero,
  .student-mastery-row-head{
    align-items:stretch;
    flex-direction:column;
  }
  .student-mastery-score{
    width:max-content;
  }
  .student-mastery-summary{
    grid-template-columns:1fr;
  }
}

.form{display:grid; gap:10px}
.field{display:grid; gap:6px}
.field label{font-size:12px; color:var(--muted)}
.field-label-row{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.field-info-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  color:var(--muted);
  font-size:10px;
  line-height:1;
  cursor:help;
}
.field input,.field select,.field textarea{
  padding:10px 10px;
  border-radius:12px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.18);
  color: var(--text);
}
.field textarea{min-height:90px; resize:vertical}

.pill{
  display:inline-flex; gap:6px; align-items:center;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.03);
  font-size:12px;
  color: var(--muted);
}

.assets{
  display:grid;
  grid-template-columns: 1fr 360px;
  gap:12px;
  padding:12px;
}
.asset-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap:10px;
  position:relative;
  align-content:start;
  min-height:520px;
}
.asset-card{
  border:1px solid var(--line);
  border-radius:16px;
  background: rgba(0,0,0,.18);
  padding:10px;
  cursor:pointer;
  position:relative;
  transition:border-color .16s ease, background .16s ease, opacity .16s ease, filter .16s ease;
}
.asset-card:hover{border-color: rgba(106,169,255,.35)}
.asset-card.badge-free-upload{
  border-color:rgba(76,211,142,.56);
  box-shadow:0 0 0 1px rgba(76,211,142,.18) inset;
}
.asset-card.badge-premium-slot{
  opacity:.48;
  filter:grayscale(.86);
}
.asset-card.badge-premium-slot:hover{
  opacity:.72;
  filter:grayscale(.55);
}
.asset-thumb{
  width:100%;
  height:120px;
  border-radius:12px;
  background: rgba(255,255,255,.03);
  display:grid; place-items:center;
  overflow:hidden;
}
.asset-thumb img{width:100%; height:100%; object-fit:cover}
.asset-keepsake-thumb{
  width:100%;
  height:100%;
  min-height:72px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:12px;
  background:
    radial-gradient(circle at 30% 20%, rgba(96,165,250,.18), transparent 40%),
    rgba(0,0,0,.24);
  color:var(--panel-header-text);
  text-align:center;
  font-size:13px;
  font-weight:900;
  padding:10px;
  box-sizing:border-box;
}
.asset-keepsake-thumb.large{
  min-height:260px;
}
.asset-keepsake-thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:10px;
}
.asset-keepsake-thumb span{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
}
.asset-keepsake-preview{
  width:100%;
  display:grid;
  gap:10px;
  padding:10px;
  box-sizing:border-box;
}
.asset-keepsake-preview-box{
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  background:rgba(255,255,255,.03);
}
.asset-dynamo-thumb{
  width:100%;
  height:100%;
  min-height:96px;
  display:grid;
  grid-template-rows:1fr auto;
  place-items:center;
  gap:6px;
  overflow:hidden;
  border-radius:12px;
  background:
    radial-gradient(circle at 25% 18%, rgba(250,204,21,.18), transparent 34%),
    radial-gradient(circle at 75% 22%, rgba(56,189,248,.16), transparent 38%),
    rgba(0,0,0,.24);
  padding:8px;
  box-sizing:border-box;
}
.asset-dynamo-thumb.large{
  min-height:260px;
  padding:12px;
}
.asset-dynamo-thumb img{
  width:100%;
  height:100%;
  min-height:0;
  object-fit:contain;
  border-radius:12px;
}
.asset-dynamo-thumb span{
  color:var(--panel-header-text);
  font-size:13px;
  font-weight:900;
  text-align:center;
}
.dynamo-type-chip{
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  border:1px solid color-mix(in srgb, var(--dynamo-type-color, #6aa9ff) 70%, transparent);
  border-radius:999px;
  padding:3px 7px;
  background:color-mix(in srgb, var(--dynamo-type-color, #6aa9ff) 18%, transparent);
  color:#f8fafc;
  font-size:11px;
  font-weight:900;
  letter-spacing:.02em;
}
.asset-dynamo-preview{
  width:100%;
  display:grid;
  grid-template-columns:minmax(220px, .72fr) minmax(320px, 1.28fr);
  gap:12px;
  padding:10px;
  box-sizing:border-box;
  align-items:start;
}
.asset-dynamo-side-preview{
  width:100%;
  display:grid;
  gap:10px;
  padding:10px;
  box-sizing:border-box;
}
.dynamo-builder-overlay{
  position:absolute;
  inset:0;
  z-index:12;
  border:1px solid rgba(106,169,255,.22);
  border-radius:18px;
  background:
    radial-gradient(circle at 12% 10%, rgba(106,169,255,.14), transparent 30%),
    rgba(6,10,18,.97);
  box-shadow:0 22px 70px rgba(0,0,0,.42);
  overflow:hidden;
  padding:12px;
}
.dynamo-builder-shell{
  width:100%;
  height:100%;
  min-height:520px;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  gap:12px;
}
.dynamo-builder-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:18px;
  background:linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
  padding:12px 14px;
}
.dynamo-builder-kicker{
  color:var(--minor-font-2, var(--muted));
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.dynamo-builder-heading{
  color:var(--panel-header-text);
  font-family:var(--header-font, inherit);
  font-size:27px;
  font-weight:900;
  line-height:1.05;
}
.dynamo-builder-exit{
  background:rgba(8,12,20,.92);
  backdrop-filter:blur(10px);
  white-space:nowrap;
}
.dynamo-builder-body{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(260px, 340px) minmax(360px, 1fr);
  gap:12px;
  overflow:hidden;
}
.dynamo-preview-panel,
.dynamo-chain-panel{
  min-height:0;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(0,0,0,.18);
  padding:12px;
  display:grid;
  gap:12px;
  overflow:auto;
}
.asset-dynamo-main-card,
.dynamo-builder{
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(0,0,0,.18);
  padding:10px;
  display:grid;
  gap:10px;
  min-width:0;
}
.asset-dynamo-preview-art{
  position:relative;
  min-height:240px;
  max-height:320px;
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,.03);
}
.dynamo-main-drop-zone{
  border:1px dashed rgba(255,255,255,.12);
  transition:border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.dynamo-main-drop-zone.drag-over{
  border-color:rgba(76,211,142,.8);
  background:rgba(76,211,142,.08);
  box-shadow:0 0 0 2px rgba(76,211,142,.12) inset;
}
.dynamo-main-drop-hint{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:7px 8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(6,10,18,.82);
  color:var(--minor-font-2, var(--muted));
  font-size:11px;
  font-weight:900;
  backdrop-filter:blur(8px);
}
.dynamo-main-drop-hint .btn{
  min-height:0;
  padding:5px 8px;
  font-size:11px;
}
.dynamo-panel-head{
  display:flex;
  justify-content:space-between;
  align-items:start;
  gap:12px;
}
.dynamo-panel-title{
  font-family:var(--header-font, inherit);
  color:var(--panel-header-text);
  font-size:20px;
  font-weight:900;
}
.dynamo-type-selects{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.dynamo-type-selects label{
  display:grid;
  gap:4px;
  color:var(--minor-font-2, var(--muted));
  font-size:12px;
  font-weight:800;
}
.dynamo-dye-panel{
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  background:rgba(255,255,255,.035);
  padding:9px;
  display:grid;
  gap:8px;
}
.dynamo-dye-title{
  color:var(--minor-font-1, #f8fafc);
  font-size:12px;
  font-weight:900;
  letter-spacing:.03em;
}
.dynamo-dye-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.dynamo-dye-control{
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(0,0,0,.16);
  padding:7px;
  display:grid;
  grid-template-columns:1fr 34px;
  align-items:center;
  gap:7px;
  color:var(--minor-font-2, var(--muted));
  font-size:11px;
  font-weight:900;
}
.dynamo-dye-control input[type="color"]{
  width:34px;
  height:28px;
  padding:0;
  border:1px solid rgba(255,255,255,.16);
  border-radius:9px;
  background:transparent;
  overflow:hidden;
}
.dynamo-dye-panel code{
  color:var(--minor-font-1, #f8fafc);
  font-size:11px;
}
.dynamo-format-note{
  color:var(--muted);
  font-size:11px;
  line-height:1.35;
}
.dynamo-stage-count-row{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  color:var(--minor-font-2, var(--muted));
  font-size:12px;
  font-weight:900;
}
.dynamo-stage-count-select{
  display:flex;
  align-items:center;
  gap:7px;
}
.dynamo-stage-count-select select{
  min-width:58px;
  height:30px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:10px;
  padding:4px 8px;
  background:rgba(255,255,255,.06);
  color:var(--panel-header-text);
  font-weight:900;
}
.dynamo-stage-list{
  display:grid;
  gap:10px;
  align-content:start;
}
.dynamo-stage-box{
  position:relative;
  border:1px dashed rgba(255,255,255,.22);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  min-height:110px;
  padding:12px;
  display:grid;
  grid-template-columns:96px minmax(0, 1fr);
  gap:12px;
  align-items:center;
  transition:border-color .16s ease, background .16s ease, transform .16s ease;
}
.dynamo-stage-box.filled{
  border-style:solid;
  border-color:rgba(106,169,255,.28);
}
.dynamo-stage-box.drag-over{
  border-color:rgba(76,211,142,.78);
  background:rgba(76,211,142,.12);
  transform:translateY(-1px);
}
.dynamo-stage-label{
  color:var(--minor-font-1, #f8fafc);
  font-size:12px;
  font-weight:900;
  display:grid;
  gap:6px;
}
.dynamo-stage-level{
  display:grid;
  gap:3px;
  color:var(--minor-font-2, var(--muted));
  font-size:11px;
}
.dynamo-stage-level input{
  width:82px;
  min-width:0;
  padding:5px 6px;
  border-radius:9px;
  border:1px solid var(--line);
  background:rgba(0,0,0,.22);
  color:var(--text);
}
.dynamo-stage-content{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(170px, 220px) minmax(0, 1fr);
  align-items:center;
  gap:10px;
}
.dynamo-stage-view-pair{
  min-width:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.dynamo-stage-view-slot{
  min-width:0;
  display:grid;
  gap:5px;
  justify-items:center;
  color:var(--minor-font-2, var(--muted));
  font-size:10px;
  font-weight:900;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.dynamo-stage-view-slot .btn{
  min-height:0;
  padding:4px 7px;
  font-size:10px;
  line-height:1;
}
.dynamo-stage-view-slot.drag-over .dynamo-stage-thumb{
  border-color:rgba(74,222,128,.75);
  box-shadow:0 0 0 2px rgba(74,222,128,.16);
}
.dynamo-stage-view-slot .dynamo-stage-thumb{
  width:74px;
  height:74px;
}
.dynamo-stage-thumb{
  width:82px;
  height:82px;
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,.03);
}
.dynamo-stage-thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.dynamo-stage-thumb.empty{
  border:1px dashed rgba(255,255,255,.18);
  border-radius:14px;
  display:grid;
  place-items:center;
  color:var(--muted);
  font-size:26px;
  font-weight:900;
  background:rgba(255,255,255,.03);
  font-size:13px;
}
.dynamo-stage-thumb .asset-dynamo-thumb{
  min-height:0;
  padding:5px;
}
.dynamo-stage-name{
  min-width:0;
  color:var(--panel-header-text);
  font-weight:900;
  display:grid;
  gap:6px;
}
.dynamo-stage-name > span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.dynamo-stage-title-input{
  min-width:0;
  width:100%;
  padding:2px 0;
  border:0;
  border-bottom:1px solid transparent;
  background:transparent;
  color:var(--panel-header-text);
  font:inherit;
  font-weight:900;
  outline:none;
}
.dynamo-stage-title-input:hover,
.dynamo-stage-title-input:focus{
  border-bottom-color:rgba(255,255,255,.24);
  background:rgba(255,255,255,.04);
  border-radius:6px;
  padding-inline:4px;
}
.dynamo-stage-front-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.dynamo-stage-front-actions .btn,
.dynamo-stage-name > .btn{
  min-height:0;
  width:max-content;
  padding:6px 9px;
  font-size:11px;
}
.dynamo-placement-modal{
  position:fixed;
  inset:0;
  z-index:10020;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(3, 7, 18, .76);
  backdrop-filter:blur(10px);
}
.dynamo-placement-card{
  width:min(900px, 96vw);
  max-height:94vh;
  display:grid;
  gap:12px;
  padding:16px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:22px;
  background:linear-gradient(180deg, rgba(18,27,39,.98), rgba(8,12,20,.98));
  box-shadow:0 24px 70px rgba(0,0,0,.48);
}
.dynamo-placement-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.dynamo-placement-title{
  color:var(--panel-header-text);
  font-size:24px;
  font-weight:950;
  line-height:1;
}
.dynamo-placement-preview{
  position:relative;
  height:min(62vh, 560px);
  min-height:340px;
  border:1px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 22%, rgba(255,255,255,.12), transparent 46%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(0,0,0,.18));
}
.dynamo-placement-avatar{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  height:92%;
  max-width:68%;
  object-fit:contain;
  pointer-events:none;
  user-select:none;
  z-index:2;
}
.dynamo-placement-companion{
  position:absolute;
  transform:translate(-50%, -50%);
  cursor:grab;
  touch-action:none;
  filter:drop-shadow(0 18px 20px rgba(0,0,0,.36));
  z-index:3;
}
.dynamo-placement-preview.dynamo-layer-behind .dynamo-placement-companion{
  z-index:1;
}
.dynamo-placement-companion:active{
  cursor:grabbing;
}
.dynamo-placement-companion img{
  width:100%;
  height:auto;
  display:block;
  pointer-events:none;
  user-select:none;
}
.dynamo-placement-controls{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
}
.dynamo-placement-layer-toggle{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:3px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.045);
}
.dynamo-placement-layer-toggle .btn{
  min-height:0;
  padding:6px 10px;
}
.dynamo-placement-layer-toggle .btn.active{
  border-color:rgba(76,211,142,.42);
  background:rgba(76,211,142,.16);
  color:var(--panel-header-text);
}
.dynamo-placement-controls .btn.active{
  border-color:rgba(76,211,142,.42);
  background:rgba(76,211,142,.16);
  color:var(--panel-header-text);
}
.dynamo-placement-controls .btn.default-reference-active{
  border-color:rgba(248,113,113,.72);
  background:rgba(248,113,113,.22);
  color:#fecaca;
  box-shadow:0 0 0 1px rgba(248,113,113,.16), 0 0 18px rgba(248,113,113,.12);
}
.dynamo-placement-controls .btn.default-reference-stale{
  border-color:rgba(148,163,184,.22);
  background:rgba(148,163,184,.10);
  color:rgba(203,213,225,.64);
}
.dynamo-battle-placement-card{
  width:min(1040px, 98vw);
}
.dynamo-battle-placement-preview{
  min-height:clamp(440px, 62vh, 660px);
}
.battle-scene-preview-card{
  position:relative;
  min-height:260px;
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(3,7,18,.05), rgba(3,7,18,.22)),
    var(--battle-scene-layer),
    linear-gradient(180deg, #111b35 0%, #18284b 50%, #0b1019 100%);
  background-size:cover, cover, cover;
  background-position:center;
  box-shadow:inset 0 0 60px rgba(0,0,0,.28);
}
.battle-scene-reference-chip{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:130px;
  min-height:22px;
  padding:2px 12px;
  border-radius:999px;
  background:rgba(7,10,18,.72);
  border:1px solid rgba(255,255,255,.22);
  color:rgba(255,255,255,.88);
  font-size:11px;
  font-weight:900;
}
.battle-scene-reference-chip.muted-chip{
  color:var(--muted2);
  border-style:dashed;
}
.dynamo-battle-placement-token{
  position:absolute;
  z-index:8;
  display:grid;
  place-items:center;
  cursor:grab;
  touch-action:none;
  filter:drop-shadow(0 18px 18px rgba(0,0,0,.42));
}
.dynamo-battle-placement-token.active{
  filter:drop-shadow(0 18px 18px rgba(0,0,0,.42)) drop-shadow(0 0 12px rgba(76,211,142,.22));
}
.dynamo-battle-placement-token:active{
  cursor:grabbing;
}
.dynamo-battle-placement-token img{
  width:100%;
  height:100%;
  object-fit:contain;
  pointer-events:none;
  user-select:none;
}
.dynamo-battle-placement-token b{
  position:absolute;
  left:50%;
  bottom:-30px;
  transform:translateX(-50%);
  padding:4px 9px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(5,10,20,.82);
  color:var(--panel-header-text);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.dynamo-placement-hint{
  text-align:center;
}
.dynamo-animation-modal{
  position:fixed;
  inset:0;
  z-index:10040;
  background:rgba(3,7,18,.92);
  backdrop-filter:blur(12px);
  display:block;
  color:var(--panel-header-text);
}
.dynamo-animation-shell{
  height:100vh;
  width:100vw;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  padding:14px;
  box-sizing:border-box;
  gap:12px;
}
.dynamo-animation-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  padding:12px 14px;
  background:linear-gradient(135deg, rgba(18,27,39,.94), rgba(8,12,20,.9));
}
.dynamo-animation-title{
  font-size:26px;
  font-weight:950;
  line-height:1;
}
.dynamo-animation-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}
.dynamo-animation-control{
  min-height:32px;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  padding:4px 9px;
  background:rgba(255,255,255,.055);
  color:var(--muted2);
  font-size:11px;
  font-weight:850;
}
.dynamo-animation-control input[type="range"]{
  width:112px;
  accent-color:var(--panel-header-text);
}
.dynamo-animation-layer-control{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  padding:4px 7px;
  background:rgba(255,255,255,.055);
  color:var(--muted2);
  font-size:11px;
  font-weight:850;
}
.dynamo-animation-layer-control strong{
  min-width:38px;
  text-align:center;
  color:var(--panel-header-text);
  font-size:12px;
  font-weight:950;
}
.dynamo-animation-layer-control .btn{
  min-height:24px;
  min-width:24px;
  padding:0;
  border-radius:999px;
  line-height:1;
}
.dynamo-animation-layer-control.disabled{
  opacity:.48;
}
.dynamo-animation-layer-control .btn:disabled{
  opacity:.35;
  cursor:not-allowed;
}
.dynamo-animation-layer-overlay{
  position:absolute;
  top:12px;
  left:12px;
  z-index:6;
  background:rgba(8,12,20,.86);
  box-shadow:0 12px 28px rgba(0,0,0,.28);
}
.dynamo-animation-color-control input[type="color"]{
  width:28px;
  height:24px;
  border:0;
  border-radius:999px;
  padding:0;
  background:transparent;
  cursor:pointer;
}
.dynamo-animation-actions .btn.active{
  border-color:rgba(76,211,142,.42);
  background:rgba(76,211,142,.16);
  color:var(--panel-header-text);
}
.dynamo-animation-grid{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(430px, .9fr) minmax(480px, 1.1fr);
  gap:12px;
}
.dynamo-animation-left,
.dynamo-animation-right,
.dynamo-animation-stage-wrap{
  min-height:0;
  border:1px solid rgba(255,255,255,.13);
  border-radius:20px;
  background:rgba(8,12,20,.72);
  overflow:hidden;
}
.dynamo-animation-left,
.dynamo-animation-right{
  display:grid;
  align-content:start;
  gap:10px;
  padding:12px;
  overflow:auto;
}
.dynamo-animation-help{
  display:grid;
  gap:8px;
  color:var(--muted2);
  font-size:12px;
  line-height:1.35;
}
.dynamo-animation-help b,
.dynamo-frame-bank-head b,
.dynamo-sequencer-head b,
.dynamo-bone-panel-title{
  color:var(--panel-header-text);
  font-weight:950;
}
.dynamo-animation-stage-wrap{
  display:grid;
  place-items:center;
  padding:16px;
}
.dynamo-animation-stage{
  position:relative;
  width:100%;
  height:min(100%, 76vh);
  min-height:520px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.10), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(0,0,0,.16));
  overflow:hidden;
}
.dynamo-floating-frame-host{
  position:absolute;
  left:18px;
  bottom:18px;
  z-index:4;
  pointer-events:none;
}
.dynamo-floating-frame{
  width:88px;
  height:88px;
  display:grid;
  place-items:center;
  border:1px solid rgba(250,204,21,.5);
  border-radius:14px;
  padding:6px;
  background:linear-gradient(135deg, rgba(250,204,21,.22), rgba(14,165,233,.16));
  box-shadow:0 16px 36px rgba(0,0,0,.32), 0 0 18px rgba(250,204,21,.18);
  cursor:grab;
  pointer-events:auto;
}
.dynamo-floating-frame img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.dynamo-animation-viewport{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  transform-origin:0 0;
  will-change:transform;
}
.dynamo-animation-stage img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  pointer-events:none;
  user-select:none;
}
.dynamo-animation-mesh-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  pointer-events:none;
  user-select:none;
}
.dynamo-animation-mesh-canvas.active{
  opacity:1;
}
.dynamo-animation-svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  cursor:crosshair;
  touch-action:none;
}
.dynamo-erasing .dynamo-animation-svg{
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cg transform='rotate(-35 14 14)'%3E%3Crect x='6' y='10' width='16' height='9' rx='2' fill='%23f8fafc' stroke='%230f172a' stroke-width='2'/%3E%3Crect x='6' y='10' width='6' height='9' rx='2' fill='%23fb7185' stroke='%230f172a' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E") 7 20, cell;
}
.dynamo-pivot-active .dynamo-animation-svg{
  cursor:crosshair;
}
.dynamo-bone-line{
  stroke:var(--dynamo-bone-color, rgba(110,231,255,.96));
  stroke-width:1.25;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
  cursor:grab;
  filter:drop-shadow(0 0 6px rgba(110,231,255,.32));
}
.dynamo-bone-line.selected{
  stroke:#facc15;
  stroke-width:1.75;
}
.dynamo-bone-line.temp{
  stroke:#c4b5fd;
  stroke-width:1.4;
  stroke-dasharray:2 2;
}
.dynamo-bone-joint{
  fill:rgba(8,12,20,.92);
  stroke:rgba(255,255,255,.88);
  stroke-width:.65;
  vector-effect:non-scaling-stroke;
  cursor:grab;
}
.dynamo-bone-joint.selected{
  fill:#facc15;
  stroke:#fff7ed;
}
.dynamo-bone-hinge{
  fill:#22c55e;
  stroke:#ecfdf5;
  stroke-width:.75;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 6px rgba(34,197,94,.75));
}
.dynamo-pivot-handle{
  cursor:grab;
}
.dynamo-pivot-handle path{
  fill:none;
  stroke:#facc15;
  stroke-width:.85;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 5px rgba(250,204,21,.5));
  pointer-events:none;
}
.dynamo-pivot-handle circle{
  fill:rgba(250,204,21,.12);
  stroke:rgba(250,204,21,.78);
  stroke-width:.5;
  vector-effect:non-scaling-stroke;
}
.dynamo-paint-blob{
  opacity:.76;
  pointer-events:none;
}
.dynamo-mesh-influence-blob{
  opacity:.32;
  pointer-events:none;
  mix-blend-mode:screen;
}
.dynamo-mesh-influence-blob.selected{
  opacity:.62;
}
.dynamo-mesh-influence-blob .dynamo-paint-stroke,
.dynamo-mesh-influence-blob .dynamo-paint-cell{
  filter:drop-shadow(0 0 2px rgba(34,197,94,.5));
}
.dynamo-paint-mask{
  opacity:.76;
  pointer-events:none;
}
.dynamo-captured-flesh{
  opacity:1;
  pointer-events:none;
}
.dynamo-paint-cell{
  stroke:none;
  pointer-events:none;
}
.dynamo-paint-stroke{
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}
.dynamo-bone-list{
  display:grid;
  gap:8px;
}
.dynamo-bone-list-item{
  display:flex;
  justify-content:space-between;
  gap:8px;
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  padding:8px 10px;
  background:rgba(255,255,255,.045);
  color:var(--panel-header-text);
  cursor:pointer;
}
.dynamo-bone-list-item.active{
  border-color:rgba(250,204,21,.42);
  background:rgba(250,204,21,.12);
}
.dynamo-bone-list-item small{
  color:var(--muted2);
  white-space:nowrap;
}
.dynamo-frame-bank-head,
.dynamo-sequencer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.dynamo-frame-storage-panel{
  display:grid;
  gap:8px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  padding:9px;
  background:rgba(255,255,255,.035);
}
.dynamo-frame-storage-panel[hidden]{
  display:none;
}
.dynamo-frame-bank{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(88px, 1fr));
  gap:8px;
  padding-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.dynamo-frame-tile{
  aspect-ratio:1 / 1;
  min-height:72px;
  display:grid;
  place-items:center;
  border:1px solid rgba(110,231,255,.2);
  border-radius:12px;
  padding:5px;
  background:rgba(14,165,233,.08);
  cursor:grab;
}
.dynamo-frame-tile img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.dynamo-sequencer{
  display:grid;
  gap:9px;
}
.dynamo-sequence-row{
  display:grid;
  grid-template-columns:44px minmax(92px, 140px) 62px minmax(250px, 1fr);
  gap:7px;
  align-items:center;
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  padding:8px;
  background:rgba(255,255,255,.035);
}
.dynamo-sequence-row .btn{
  min-height:44px;
  font-size:16px;
}
.dynamo-sprite-upload-btn{
  min-height:38px !important;
  padding:0 8px;
  font-size:12px !important;
  font-weight:900;
  cursor:pointer;
}
.dynamo-play-btn{
  width:44px;
  padding:0;
}
.dynamo-sequence-name{
  min-width:0;
}
.dynamo-sequence-slots{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
}
.dynamo-frame-slot{
  position:relative;
  aspect-ratio:1 / 1;
  width:var(--slot-size, 58px);
  min-width:var(--slot-size, 58px);
  height:var(--slot-size, 58px);
  border:1px dashed rgba(147,184,236,.45);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  color:var(--panel-header-text);
  display:grid;
  place-items:center;
  cursor:pointer;
}
.dynamo-frame-slot.filled{
  z-index:1;
}
.dynamo-frame-slot.filled:hover,
.dynamo-frame-slot.filled:focus-visible{
  z-index:25;
}
.dynamo-frame-slot.filled:hover img,
.dynamo-frame-slot.filled:focus-visible img{
  position:absolute;
  inset:50% auto auto 50%;
  width:174px;
  height:174px;
  transform:translate(-50%, -50%);
  z-index:30;
  border:1px solid rgba(250,204,21,.65);
  border-radius:16px;
  background:rgba(8,12,20,.95);
  box-shadow:0 18px 42px rgba(0,0,0,.5), 0 0 18px rgba(250,204,21,.18);
  padding:7px;
}
.dynamo-frame-slot:hover,
.dynamo-frame-slot:focus-visible{
  border-color:rgba(250,204,21,.65);
  background:rgba(250,204,21,.09);
  outline:none;
}
.dynamo-frame-slot.filled{
  border-style:solid;
  border-color:rgba(110,231,255,.42);
  background:linear-gradient(135deg, rgba(14,165,233,.14), rgba(76,211,142,.08));
}
.dynamo-frame-slot span{
  font-size:12px;
  font-weight:950;
  line-height:1;
}
.dynamo-frame-slot img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.dynamo-frame-slot.add,
.dynamo-add-sequence-row{
  border-style:solid;
  border-color:rgba(250,204,21,.28);
  background:rgba(250,204,21,.08);
  color:var(--panel-header-text);
  font-size:22px;
  font-weight:950;
}
.dynamo-add-sequence-row{
  width:46px;
  height:46px;
  border-radius:999px;
  justify-self:center;
  cursor:pointer;
}
.dynamo-add-sequence-row:hover,
.dynamo-frame-slot.add:hover{
  border-color:rgba(250,204,21,.7);
  background:rgba(250,204,21,.16);
}
@media (max-width: 1100px){
  .dynamo-animation-grid{
    grid-template-columns:1fr;
    overflow:auto;
  }
  .dynamo-animation-stage{
    height:70vh;
  }
}
.dynamo-stage-clear{
  padding:5px 8px;
  min-height:0;
}
.dynamo-readonly-note{
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  padding:6px 9px;
  color:var(--minor-font-2, var(--muted));
  background:rgba(255,255,255,.04);
  font-size:12px;
  font-weight:800;
}
.asset-name{margin-top:8px; font-weight:800; font-size:13px}
.asset-type{font-size:12px; color:var(--muted)}
.asset-plan-label{
  margin-top:6px;
  display:inline-flex;
  width:max-content;
  max-width:100%;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  padding:3px 7px;
  font-size:11px;
  color:var(--minor-font-2, var(--muted));
  background:rgba(0,0,0,.18);
}
.badge-free-upload .asset-plan-label{
  color:rgba(194,255,218,.96);
  border-color:rgba(76,211,142,.32);
  background:rgba(76,211,142,.11);
}
.badge-premium-slot .asset-plan-label{
  color:rgba(255,220,166,.92);
  border-color:rgba(245,158,11,.28);
  background:rgba(245,158,11,.1);
}

.asset-preview .preview-box{
  border:1px solid var(--line);
  border-radius:16px;
  background: rgba(0,0,0,.18);
  min-height:320px;
  display:grid; place-items:center;
  overflow:hidden;
}
.preview-box img{max-width:100%; max-height:100%; object-fit:contain}

.footer{
  padding:14px;
  text-align:center;
}
select {
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  color: var(--text);
}

select option {
  color: #000 !important;
  background: #e6e6e6 !important;
}

select option:disabled,
select option.premium-locked-option,
select option[data-premium-locked="true"]{
  color:#7b8495 !important;
  background:#d4d8df !important;
}

.node-asset-picker{
  position:relative;
}

.node-asset-picker-trigger{
  width:100%;
  display:grid;
  grid-template-columns: 104px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(0,0,0,.18);
  color:var(--text);
  text-align:left;
  cursor:pointer;
}

.node-asset-picker.open .node-asset-picker-trigger{
  border-color:rgba(255,255,255,.22);
  box-shadow:0 10px 28px rgba(0,0,0,.24);
}

.node-asset-picker-strip{
  width:104px;
  height:36px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  overflow:hidden;
  display:grid;
  place-items:center;
  color:var(--muted);
  font-size:11px;
  letter-spacing:.03em;
  text-transform:uppercase;
}

.node-asset-picker-strip img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

.node-asset-picker-strip.placeholder{
  background:rgba(255,255,255,.04);
}

.node-asset-picker-labels{
  display:grid;
  gap:2px;
  min-width:0;
}

.node-asset-picker-name{
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.node-asset-picker-sub{
  font-size:12px;
  color:var(--muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.node-asset-picker-caret{
  color:rgba(255,255,255,.62);
  font-size:14px;
}

.node-asset-picker-menu{
  position:absolute;
  z-index:30;
  left:0;
  right:0;
  top:calc(100% + 8px);
  display:none;
  gap:8px;
  padding:8px;
  max-height:280px;
  overflow:auto;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(15,18,28,.98);
  box-shadow:0 18px 40px rgba(0,0,0,.35);
}

.node-asset-picker.open .node-asset-picker-menu{
  display:grid;
}

.node-asset-picker-option{
  width:100%;
  display:grid;
  grid-template-columns: 104px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:8px 10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:var(--text);
  text-align:left;
  cursor:pointer;
}

.node-asset-picker-option:hover{
  border-color:rgba(245,158,11,.28);
  background:rgba(245,158,11,.08);
}

.node-asset-picker-option.active{
  border-color:rgba(245,158,11,.4);
  background:rgba(245,158,11,.12);
}

.node-thumbnail-frame-controls{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}

.node-thumbnail-zoom-btn{
  min-width:40px;
  min-height:36px;
  padding:4px 10px;
  font-size:20px;
  line-height:1;
}

.node-thumbnail-zoom-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.node-thumbnail-scale-readout{
  min-width:68px;
  text-align:center;
  color:rgba(255,255,255,.84);
  font-weight:700;
  letter-spacing:.03em;
}

.question-bank-layout{display:grid; gap:10px}
.question-bank-meta{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) 180px;
  gap:8px;
}
.question-bank-editor{
  display:grid;
  gap:8px;
  min-height:0;
  padding:8px 10px 10px;
}
.question-bank-sidebar{
  display:grid;
  min-height:0;
  transition: width .18s ease;
}
.question-strand-wrap{
  display:grid;
  gap:6px;
  padding:10px;
}
.question-drop-zone{
  height:5px;
  position:relative;
  cursor:default;
}
.question-drop-zone::before{
  content:"";
  position:absolute;
  left:4px;
  right:4px;
  top:50%;
  height:0;
  border-top:1px solid transparent;
  transform:translateY(-50%);
  transition:border-color .12s ease, border-top-width .12s ease;
}
.question-drop-zone.active::before{
  border-top-color: rgba(106,169,255,.85);
  border-top-width: 2px;
}
.question-drop-zone-topic{
  margin-left:18px;
}
.question-drop-zone-subtopic{
  margin-left:14px;
}
.question-strand-block{
  display:grid;
  gap:2px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:10px;
  background: rgba(255,255,255,.018);
}
.question-strand-block.expanded{
  background: rgba(255,255,255,.024);
}
.question-strand-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
  cursor:default;
}
.question-strand-drag-icon{
  flex:0 0 auto;
  color:var(--panel-header-text);
  font-size:12px;
  line-height:1;
  letter-spacing:-1px;
  cursor:grab;
}
.question-strand-title{
  font-size:18px;
  font-weight:900;
  color:var(--panel-header-text);
  line-height:1.1;
  min-width:0;
  flex:1 1 auto;
  text-align:left;
}
.question-strand-edit-btn{
  background: transparent;
  border-color: rgba(255,255,255,.12);
  color: var(--muted);
  cursor: default !important;
  padding:1px 6px !important;
  font-size:10px;
  line-height:1.1;
  flex:0 0 auto;
  min-width:0;
  white-space:nowrap;
  border-radius:8px;
  opacity:0;
  pointer-events:none;
  transition: opacity .14s ease;
}
.question-strand-edit-btn.is-fixed{
  display:none !important;
}
.question-bank-explorer-row-title-line{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  flex:1 1 auto;
  justify-content:flex-start;
}
.question-strand-chevron{
  flex:0 0 auto;
  color:var(--muted);
  font-size:12px;
  transition:transform .14s ease, color .14s ease;
}
.question-strand-block.is-focused .question-strand-chevron{
  transform:rotate(90deg);
  color:var(--panel-header-text);
}
.question-strand-body{
  display:grid;
  gap:2px;
  padding:1px 0 0 12px;
}
.question-topic-block{
  display:grid;
  gap:2px;
}
.question-strand-add-row{
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  align-items:center;
}
.question-bank-entity-editor{
  display:grid;
  gap:8px;
  margin-top:2px;
}
.question-bank-entity-editor-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.question-bank-description-input{
  width:100%;
  min-height:84px;
  padding:10px 10px;
  border-radius:12px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.18);
  color: var(--text);
  resize:vertical;
}
.question-bank-parent-description{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.18);
  color: var(--panel-header-text);
  font-size:12px;
  line-height:1.35;
  white-space:pre-wrap;
}
.question-bank-root-ghosted{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.question-strand-input{
  flex:1 1 auto;
  min-width:0;
}
.question-strand-add-btn{
  background: var(--nav-bg2);
  border-color: transparent;
  color: var(--text);
  padding:4px 8px !important;
  font-size:11px;
  line-height:1.1;
  white-space:nowrap;
}
.question-strand-add-btn:hover{
  border-color: rgba(255,255,255,.18);
}
.question-bank-sync-strands-row{
  display:flex;
  justify-content:flex-start;
  padding:6px 10px 10px;
}
.question-bank-sync-strands-btn{
  padding:5px 9px !important;
  border-radius:10px;
  font-size:11px;
  color:var(--minor2);
  background:rgba(255,255,255,.035);
  border-color:rgba(255,255,255,.1);
}
.question-bank-sync-strands-btn:hover{
  color:var(--text);
  border-color:rgba(255,255,255,.2);
  background:rgba(255,255,255,.06);
}
.sync-strands-modal{
  position:fixed;
  inset:0;
  z-index:2147483600;
  background:rgba(0,0,0,.72);
  display:flex;
  padding:12px;
}
.sync-strands-card{
  width:100%;
  height:100%;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:10px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(22,25,30,.98), rgba(12,14,18,.98));
  box-shadow:0 24px 70px rgba(0,0,0,.42);
  padding:14px;
}
.sync-strands-header,
.sync-strands-footer{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.sync-strands-header-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}
.sync-strands-expand{
  padding:6px 10px !important;
  font-size:12px;
  color:var(--minor2);
  background:rgba(255,255,255,.035);
  border-color:rgba(255,255,255,.12);
}
.sync-strands-expand:hover{
  color:var(--text);
  background:rgba(255,255,255,.06);
}
.sync-strands-title{
  color:var(--panel-header-text);
  font-size:22px;
  font-weight:900;
}
.sync-strands-sub{
  margin-top:4px;
  color:var(--muted);
  font-size:12px;
}
.sync-strands-body{
  min-height:0;
  overflow:auto;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}
.sync-strands-table-wrap{
  min-width:100%;
  overflow:auto;
}
.sync-strands-table{
  width:100%;
  min-width:760px;
  border-collapse:separate;
  border-spacing:0;
  font-size:13px;
}
.sync-strands-table th,
.sync-strands-table td{
  padding:10px;
  border-right:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  vertical-align:middle;
}
.sync-strands-table th{
  position:sticky;
  top:0;
  z-index:2;
  color:var(--panel-header-text);
  background:rgba(12,14,18,.96);
  text-align:center;
  font-weight:900;
}
.sync-strands-table th:first-child,
.sync-strands-label{
  position:sticky;
  left:0;
  z-index:3;
  background:rgba(14,17,22,.98);
}
.sync-strands-label{
  min-width:260px;
  color:var(--text);
}
.sync-strands-label-inner{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.sync-strands-tree-toggle{
  width:20px;
  height:20px;
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  background:rgba(255,255,255,.035);
  color:var(--muted);
  font-size:14px;
  line-height:1;
  cursor:pointer;
  transition:transform .14s ease, background .14s ease, color .14s ease;
}
.sync-strands-tree-toggle.expanded{
  transform:rotate(90deg);
  color:var(--panel-header-text);
}
.sync-strands-tree-toggle.is-spacer{
  border-color:transparent;
  background:transparent;
  cursor:default;
}
.sync-strands-label-main{
  display:grid;
  gap:2px;
  min-width:0;
}
.sync-strands-label-main span{
  display:block;
  font-weight:800;
}
.sync-strands-label-main small{
  display:block;
  margin-top:2px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:10px;
}
.sync-strands-label.sync-strands-kind-strand .sync-strands-label-main span{
  color:var(--panel-header-text);
  font-size:16px;
  font-weight:900;
}
.sync-strands-label.sync-strands-kind-topic .sync-strands-label-main span{
  color:var(--minor3);
  font-size:14px;
  font-weight:800;
}
.sync-strands-label.sync-strands-kind-subtopic .sync-strands-label-main span{
  color:var(--minor1);
  font-size:13px;
  font-weight:800;
}
.sync-strands-row-topic .sync-strands-label{
  background:rgba(16,19,25,.98);
}
.sync-strands-row-subtopic .sync-strands-label{
  background:rgba(18,20,27,.98);
}
.sync-strands-label.sync-strands-kind-strand{
  cursor:pointer;
}
.sync-strands-label.sync-strands-kind-topic{
  cursor:pointer;
}
.sync-strands-cell{
  min-width:120px;
  text-align:center;
}
.sync-strands-cell.is-present{
  background:rgba(65,190,120,.18);
}
.sync-strands-cell.is-missing{
  background:rgba(220,70,70,.18);
}
.sync-strands-check{
  display:inline-grid;
  place-items:center;
  width:24px;
  height:24px;
  border-radius:999px;
  background:rgba(65,190,120,.35);
  color:#d8ffe6;
  font-weight:900;
}
.sync-strands-cell input[type="checkbox"]{
  width:20px;
  height:20px;
  accent-color:#f0b45a;
}
.sync-strands-empty{
  height:100%;
  min-height:220px;
  display:grid;
  place-items:center;
  color:var(--muted);
  text-align:center;
  padding:24px;
}
.sync-strands-status{
  align-self:center;
}
.question-strand-delete-btn{
  background: transparent;
  border-color: rgba(255,255,255,.12);
  color: var(--danger);
  cursor: default !important;
  padding:1px 5px !important;
  font-size:10px;
  line-height:1.1;
  flex:0 0 auto;
  min-width:0;
  white-space:nowrap;
  border-radius:8px;
  opacity:0;
  pointer-events:none;
  transition: opacity .14s ease;
}
.question-strand-delete-btn.is-fixed{
  display:none !important;
}
.question-strand-delete-btn:hover{
  border-color: rgba(255,255,255,.18);
}
.question-strand-header:hover .question-strand-edit-btn,
.question-strand-block:hover .question-strand-edit-btn,
.question-strand-header:hover .question-strand-delete-btn,
.question-strand-block:hover .question-strand-delete-btn{
  opacity:1;
  pointer-events:auto;
}
.question-topic-row{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  cursor:default;
}
.question-topic-drag-icon{
  flex:0 0 auto;
  color:var(--panel-header-text);
  font-size:12px;
  line-height:1;
  letter-spacing:-1px;
  cursor:grab;
}
.question-topic-drag-icon[draggable="false"],
.question-subtopic-drag-icon[draggable="false"]{
  opacity:.35;
  cursor:default;
}
.question-strand-block.dragging,
.question-topic-row.dragging,
.question-subtopic-row.dragging{
  opacity:.7;
  border-color: rgba(233,238,248,.4);
}
.question-strand-block.dragging .question-strand-drag-icon,
.question-topic-row.dragging .question-topic-drag-icon,
.question-subtopic-row.dragging .question-subtopic-drag-icon{
  cursor:grabbing;
}
.question-topic-title{
  color:var(--muted);
  font-size:14px;
  font-weight:700;
  line-height:1.2;
  min-width:0;
  flex:1 1 auto;
}
.question-topic-chevron{
  flex:0 0 auto;
  color:var(--muted);
  font-size:12px;
}
.question-topic-delete-btn{
  background: transparent;
  border-color: rgba(255,255,255,.1);
  color: var(--danger);
  cursor: default !important;
  padding:1px 5px !important;
  font-size:10px;
  line-height:1.1;
  min-width:0;
  border-radius:8px;
  opacity:0;
  pointer-events:none;
  transition: opacity .14s ease;
}
.question-topic-delete-btn.is-fixed,
.question-subtopic-delete-btn.is-fixed{
  display:none !important;
}
.question-topic-row:hover .question-topic-delete-btn{
  opacity:1;
  pointer-events:auto;
}
.question-subtopic-add-btn{
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.08);
  color: var(--minor2);
  padding:4px 8px !important;
  font-size:11px;
  line-height:1.1;
  white-space:nowrap;
  width:fit-content;
}
.question-topic-add-btn{
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.08);
  color: var(--muted);
  padding:4px 8px !important;
  font-size:11px;
  line-height:1.1;
  white-space:nowrap;
  width:fit-content;
}
.question-topic-add-row{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:nowrap;
}
.question-topic-input{
  flex:1 1 auto;
  min-width:0;
}
.question-topic-body{
  display:grid;
  gap:2px;
  padding-left:10px;
}
.question-subtopic-row{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.question-subtopic-drag-icon{
  flex:0 0 auto;
  color:var(--minor2);
  font-size:12px;
  line-height:1;
  letter-spacing:-1px;
  cursor:grab;
}
.question-subtopic-delete-btn{
  background: transparent;
  border-color: rgba(255,255,255,.1);
  color: var(--danger);
  cursor: default !important;
  padding:1px 5px !important;
  font-size:10px;
  line-height:1.1;
  min-width:0;
  border-radius:8px;
  opacity:0;
  pointer-events:none;
  transition: opacity .14s ease;
}
.question-subtopic-row:hover .question-subtopic-delete-btn{
  opacity:1;
  pointer-events:auto;
}
.question-subtopic-title{
  color:var(--minor2);
  font-size:12px;
  line-height:1.2;
  min-width:0;
  flex:1 1 auto;
}
.question-subtopic-add-row{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:nowrap;
}
.question-subtopic-input{
  flex:1 1 auto;
  min-width:0;
}
.question-list-divider{
  height:1px;
  margin:0 10px 2px;
  background: var(--line);
}
.question-bank-sidebar .list{
  min-height:0;
}
.question-bank-editor-title{
  font-weight:900;
  color:var(--panel-header-text);
}
.question-bank-form-shell{
  gap:8px;
}
#tab-question-bank .two-col{
  gap:10px !important;
  padding:10px;
  align-items:stretch !important;
  grid-template-columns:300px minmax(0,1fr) !important;
}
#tab-question-bank .two-col.question-bank-wide{
  grid-template-columns:430px minmax(0,1fr) !important;
}
#tab-question-bank .list{
  margin:0;
  overflow:auto;
}
#tab-assignments .two-col{
  gap:10px !important;
  padding:10px;
  align-items:start !important;
  grid-template-columns:minmax(390px, 460px) minmax(0, 1fr) !important;
}
#tab-assignments .assignment-tab-layout{
  min-height:0;
}
#tab-assignments .assignment-left-stack{
  display:grid;
  min-height:0;
}
#tab-assignments .assignment-side-panel,
#tab-assignments .assignment-question-bank-panel,
#tab-assignments .assignment-organizer-panel{
  display:grid;
  grid-template-rows:auto auto;
  align-content:start;
  align-self:start;
  position:relative;
  min-height:0;
  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
  background:rgba(255,255,255,.012);
  overflow:hidden;
}
.assignment-bank-switcher{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px;
  background:rgba(255,255,255,.018);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.assignment-bank-switch-btn{
  appearance:none;
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  background:rgba(255,255,255,.03);
  color:rgba(233,238,248,.7);
  padding:7px 12px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.01em;
  line-height:1;
  position:relative;
  top:auto;
  left:auto;
  width:auto;
  height:auto;
  box-shadow:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space:nowrap;
  overflow:visible;
}
.assignment-bank-switch-btn.active{
  color:var(--panel-header-text);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)), var(--window-bg2);
  border-color:rgba(255,255,255,.18);
}
.assignment-bank-switch-btn::before{
  content:none;
}
.assignment-bank-switch-btn.active::before{
  content:none;
}
.assignment-bank-switch-btn.active::after{
  content:none;
}
.assignment-bank-pane{
  min-height:0;
  display:grid;
  grid-template-rows:auto auto;
  align-content:start;
  overflow:hidden;
  position:relative;
  z-index:1;
  margin-top:0;
}
.assignment-bank-pane.hidden{
  display:none !important;
}
.assignment-bank-header{
  display:grid;
  gap:8px;
  padding:10px 10px 6px;
  align-content:start;
  border-bottom:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.018);
}
.assignment-bank-title{
  font-size:13px;
  font-weight:800;
  color:var(--panel-header-text);
}
.assignment-bank-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.assignment-bank-toolbar .input{
  min-width:0;
  flex:1 1 auto;
}
.assignment-bank-toolbar .btn{
  flex:0 0 auto;
  padding:6px 8px !important;
  font-size:11px;
}
#tab-assignments .assignment-question-bank-panel .list,
#tab-assignments .assignment-organizer-panel .list,
#tab-assignments .assignment-bank-pane .list{
  overflow:auto;
  min-height:0;
  align-content:start;
  position:relative;
}
#tab-assignments .assignment-organizer-panel .list,
#tab-assignments #assignmentOrganizerPane .list{
  padding-top:2px;
}
#tab-assignments .assignment-question-bank-panel .question-bank-sidebar{
  min-height:0;
}
.assignment-editor-card{
  display:grid;
  align-content:start;
  gap:10px;
  min-height:0;
  padding:10px 12px;
  position:relative;
}
.assignment-editor-header{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
}
.assignment-editor-header .card-title{
  margin:0;
  width:0;
  min-width:0;
  overflow:hidden;
}
.assignment-source-mini-wrap{
  min-width:120px;
  max-width:190px;
  flex:0 1 170px;
}
.assignment-source-mini-select{
  width:100%;
  height:30px;
  padding:4px 26px 4px 9px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  background:rgba(255,255,255,.07);
  color:var(--text);
  font:inherit;
  font-size:12px;
  font-weight:800;
  line-height:1.1;
}
.assignment-source-mini-select:focus{
  outline:2px solid rgba(96,211,148,.32);
  outline-offset:2px;
}
.assignment-editor-header .btn{
  padding:6px 10px !important;
  font-size:11px;
  white-space:nowrap;
}
.assignment-editor-header #btnNewAssignment,
.assignment-worksheet-new-assignment-slot #btnNewAssignment{
  padding:4px 0 !important;
  border:0;
  background:transparent;
  color:var(--panel-header-text);
  font-size:1.18rem;
  font-weight:950;
  line-height:1;
  box-shadow:none;
}
.assignment-editor-header #btnNewAssignment:hover,
.assignment-worksheet-new-assignment-slot #btnNewAssignment:hover{
  color:var(--accent);
  background:transparent;
}
#tab-assignments .list{
  margin:0;
  min-height:0;
  padding:6px 0;
}
#assignmentList{
  display:grid;
  gap:0 !important;
  align-content:start;
}
.assignment-objective-drop-zone{
  height:8px;
  position:relative;
}
.assignment-objective-drop-zone::before{
  content:"";
  position:absolute;
  left:6px;
  right:6px;
  top:50%;
  border-top:1px solid transparent;
  transform:translateY(-50%);
  transition:border-color .12s ease, border-top-width .12s ease;
}
.assignment-objective-drop-zone.active::before{
  border-top-color: rgba(106,169,255,.85);
  border-top-width:2px;
}
.assignment-group{
  display:grid;
  gap:0 !important;
  margin:0 !important;
  padding:0 !important;
  align-content:start;
}
.assignment-group.dragging{
  opacity:.7;
}
.assignment-group + .assignment-group{
  margin-top:0 !important;
  padding-top:0 !important;
  border-top:0 !important;
}
.assignment-group-header{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.assignment-group-drag-icon{
  flex:0 0 auto;
  color:var(--panel-header-text);
  font-size:12px;
  line-height:1;
  letter-spacing:-1px;
  cursor:grab;
}
.assignment-group.dragging .assignment-group-drag-icon{
  cursor:grabbing;
}
.assignment-group-toggle,
.assignment-subgroup-toggle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:100%;
  background:transparent;
  border:0;
  border-radius:0;
  text-align:left;
  padding:0 !important;
  margin:0 !important;
  cursor:pointer;
  min-height:0 !important;
  height:auto;
  line-height:1 !important;
}
.assignment-group-toggle{
  flex:1 1 auto;
  width:auto;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  padding:4px 10px !important;
}
.assignment-group-main{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.assignment-group-label{
  min-width:0;
  font-size:13px;
  font-weight:800;
  color:var(--panel-header-text);
  line-height:1 !important;
  margin:0;
  padding:0;
}
.assignment-group-count{
  flex:0 0 auto;
  font-size:10px;
  color:var(--muted);
  line-height:1 !important;
  margin:0;
  padding:0;
}
.assignment-group-delete-btn{
  background:transparent;
  border-color:rgba(255,255,255,.12);
  color:var(--danger);
  cursor:default !important;
  padding:1px 5px !important;
  font-size:10px;
  line-height:1.1;
  flex:0 0 auto;
  min-width:0;
  border-radius:8px;
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease;
}
.assignment-group-header:hover .assignment-group-delete-btn,
.assignment-group:hover .assignment-group-delete-btn{
  opacity:1;
  pointer-events:auto;
}
.assignment-group-body{
  display:grid;
  gap:1px !important;
  padding-left:12px;
  margin-top:0 !important;
}
.assignment-subgroup{
  display:grid;
  gap:0 !important;
  margin:0 !important;
  padding:0 !important;
}
.assignment-subgroup-label{
  min-width:0;
  font-size:12px;
  font-weight:700;
  color:var(--minor1);
  line-height:1 !important;
  margin:0;
  padding:0;
}
.assignment-subgroup-count{
  flex:0 0 auto;
  font-size:10px;
  color:var(--muted);
  line-height:1 !important;
  margin:0;
  padding:0;
}
.assignment-subgroup-body{
  display:grid;
  gap:1px !important;
  padding-left:12px;
  margin:0 !important;
}
.assignment-entry{
  position:relative;
  padding:7px 8px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  background:rgba(255,255,255,.018);
  transition:background .12s ease, border-color .12s ease;
}
.assignment-entry-delete-btn{
  position:absolute;
  top:5px;
  right:6px;
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,93,93,.45);
  border-radius:999px;
  background:rgba(255,93,93,.10);
  color:#ffb1b1;
  cursor:pointer;
  font-size:11px;
  font-weight:900;
  line-height:1;
  opacity:0;
  pointer-events:none;
  transition:opacity .12s ease, background .12s ease, border-color .12s ease;
}
.assignment-entry:hover .assignment-entry-delete-btn,
.assignment-entry-delete-btn:focus-visible{
  opacity:1;
  pointer-events:auto;
}
.assignment-entry-delete-btn:hover{
  background:rgba(255,93,93,.22);
  border-color:rgba(255,93,93,.75);
}
.assignment-entry-title{
  font-size:11px;
  font-weight:800;
  color:var(--minor1, var(--muted));
  line-height:1.1;
}
.assignment-entry-name{
  margin-top:3px;
  font-size:12px;
  color:var(--minor2, var(--muted2, var(--muted)));
  line-height:1.25;
}
.assignment-name-field > label{
  color:var(--minor2, var(--muted2, var(--muted)));
}
.assignment-tier-field > label{
  color:var(--minor1, var(--muted));
}
.assignment-entry-meta{
  margin-top:4px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  font-size:11px;
  color:var(--muted);
  line-height:1.2;
}
.assignment-entry-source{
  color:var(--text);
  font-weight:700;
}
.assignment-entry:hover{
  background:rgba(255,255,255,.035);
}
.assignment-entry.active{
  background:rgba(106,169,255,.10);
  border-color:rgba(106,169,255,.35);
  box-shadow: inset 0 0 0 1px rgba(106,169,255,.18);
}
.assignment-worksheet-box{
  display:grid;
  gap:10px;
  padding:10px;
  border-radius:12px;
  border:1px dashed rgba(255,255,255,.18);
  background:rgba(255,255,255,.018);
}
.assignment-worksheet-host{
  margin-bottom:10px;
}
.assignment-worksheet-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:40px;
  padding:0;
  background:transparent;
  border:0;
  color:var(--panel-header-text);
  font-size:14px;
  font-weight:800;
  text-align:left;
  cursor:pointer;
}
.assignment-worksheet-toggle.collapsed{
  color:var(--minor2);
  font-size:12px;
  font-weight:700;
  min-height:28px;
}
.assignment-worksheet-toggle-icon{
  flex:0 0 auto;
  margin-left:10px;
  font-size:12px;
  line-height:1;
  opacity:.9;
}
.assignment-worksheet-box:has(.assignment-worksheet-toggle.collapsed){
  padding:6px 10px;
}
.assignment-worksheet-content{
  display:grid;
  gap:10px;
}
.assignment-worksheet-new-assignment-slot{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-start;
  margin-bottom:8px;
}
.assignment-worksheet-drop{
  min-height:76px;
  display:grid;
  place-items:center;
  padding:14px;
  text-align:center;
  color:var(--minor2);
  border-radius:12px;
  border:1px dashed rgba(255,255,255,.16);
  background:rgba(255,255,255,.02);
  transition:border-color .12s ease, background .12s ease, color .12s ease;
}
.assignment-worksheet-drop.active{
  border-color:rgba(106,169,255,.7);
  background:rgba(106,169,255,.08);
  color:var(--text);
}
.assignment-worksheet-list{
  display:grid;
  gap:8px;
}
.assignment-worksheet-item{
  display:grid;
  gap:6px;
  padding:9px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}
.assignment-worksheet-item-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.assignment-worksheet-item-title{
  font-weight:800;
  color:var(--panel-header-text);
  min-width:0;
}
.assignment-worksheet-item-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  font-size:11px;
  color:var(--muted);
}
.assignment-worksheet-item-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
}
.assignment-worksheet-add{
  justify-self:start;
}

.assignment-presentation-builder,
.assignment-presentation-list{
  display:grid;
  gap:12px;
}
.assignment-presentation-list{
  align-content:start;
}
.assignment-presentation-head,
.assignment-presentation-slide-top,
.assignment-presentation-actions,
.student-presentation-header,
.student-presentation-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.assignment-presentation-title,
.assignment-presentation-slide-label{
  color:var(--panel-header-text);
  font-weight:900;
}
.assignment-presentation-actions{
  justify-content:flex-end;
}
.assignment-presentation-slide-slice{
  display:grid;
  grid-template-columns:74px minmax(0, 1fr) auto;
  align-items:center;
  gap:10px;
  padding:8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(255,255,255,.045);
  cursor:pointer;
}
.assignment-presentation-slide-slice:hover{
  border-color:rgba(255,255,255,.22);
  background:rgba(255,255,255,.07);
}
.assignment-presentation-slide-thumb{
  position:relative;
  width:74px;
  aspect-ratio:16 / 10;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  font-weight:900;
  box-shadow:inset 0 0 0 999px rgba(0,0,0,.12);
}
.assignment-presentation-slide-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.assignment-presentation-slide-thumb span{
  position:absolute;
  inset:auto 6px 5px auto;
  min-width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:rgba(0,0,0,.62);
  font-size:11px;
}
.assignment-presentation-slide-slice-main{
  min-width:0;
}
.assignment-presentation-slide-card{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(255,255,255,.04);
}
.assignment-presentation-slide-body{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
}
.assignment-presentation-slide-body .field:nth-child(2){
  grid-column:1 / -1;
}
.assignment-presentation-preview{
  min-height:170px;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:10px;
  padding:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  color:#f7f4ea;
  text-align:center;
  overflow:hidden;
}
.assignment-presentation-preview img{
  max-width:min(460px, 100%);
  max-height:180px;
  object-fit:contain;
  border-radius:12px;
}
.assignment-presentation-preview-title{
  font-size:1.55rem;
  font-weight:900;
}
.assignment-presentation-preview-body{
  max-width:70ch;
  white-space:pre-wrap;
}
.assignment-presentation-question-chip{
  padding:4px 10px;
  border-radius:999px;
  background:rgba(0,0,0,.34);
  color:#ffd166;
  font-weight:800;
}

.presentation-slide-maker-overlay{
  position:fixed;
  inset:0;
  z-index:2147483647;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  background:linear-gradient(180deg, rgba(14,21,31,.99), rgba(8,12,18,.99));
  color:var(--text);
  overflow:hidden;
}
.presentation-slide-maker-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
}
.presentation-slide-maker-title{
  color:var(--panel-header-text);
  font-size:1.2rem;
  font-weight:900;
}
.presentation-slide-maker-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
.presentation-slide-maker-shell{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(280px, 360px) minmax(0, 1fr);
  gap:14px;
  padding:14px;
  overflow:hidden;
}
.presentation-slide-maker-controls{
  min-height:0;
  display:grid;
  align-content:start;
  gap:10px;
  overflow:auto;
  padding:12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.04);
}
.presentation-slide-maker-image-add{
  display:grid;
  grid-template-columns:minmax(0, 1fr) repeat(3, auto);
  gap:8px;
}
.presentation-slide-background-panel{
  border:1px solid rgba(106,169,255,.20);
  border-radius:14px;
  background:rgba(106,169,255,.07);
  overflow:hidden;
}
.presentation-slide-background-panel summary{
  padding:10px 11px;
  color:rgba(255,255,255,.82);
  font-size:.8rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
  user-select:none;
}
.presentation-slide-background-panel[open] summary{
  border-bottom:1px solid rgba(255,255,255,.10);
}
.presentation-slide-background-body{
  display:grid;
  gap:9px;
  padding:10px;
}
.presentation-slide-background-upload{
  width:100%;
}
.presentation-slide-text-toolbar{
  display:grid;
  grid-template-columns:1fr auto auto auto;
  align-items:center;
  gap:8px;
  padding:9px;
  border:1px solid rgba(245,158,11,.22);
  border-radius:14px;
  background:rgba(245,158,11,.08);
}
.presentation-slide-points-toolbar{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:8px;
  padding:9px;
  border:1px solid rgba(76,217,100,.24);
  border-radius:14px;
  background:rgba(76,217,100,.08);
}
.presentation-slide-points-hint{
  grid-column:1 / -1;
  color:rgba(255,255,255,.68);
  font-size:.78rem;
  font-weight:800;
  line-height:1.25;
}
.presentation-slide-text-toolbar-title{
  grid-column:1 / -1;
  color:rgba(255,255,255,.72);
  font-size:.74rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.presentation-slide-shape-toolbar{
  display:grid;
  gap:8px;
  padding:9px;
  border:1px solid rgba(96,211,148,.20);
  border-radius:14px;
  background:rgba(96,211,148,.07);
}
.presentation-slide-shape-toolbar .question-small-note{
  margin:0;
  font-size:11px;
  line-height:1.25;
}
.presentation-slide-keepsake-panel{
  display:grid;
  gap:8px;
  padding:8px;
  border:1px solid rgba(96,165,250,.18);
  border-radius:14px;
  background:rgba(96,165,250,.06);
}
.presentation-slide-keepsake-panel.open{
  background:rgba(96,165,250,.09);
}
.presentation-slide-keepsake-toggle{
  width:100%;
  justify-content:center;
}
.presentation-slide-keepsake-body{
  display:grid;
  gap:7px;
}
.presentation-slide-keepsake-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:6px;
}
.presentation-slide-keepsake-card{
  position:relative;
  min-width:0;
}
.presentation-slide-keepsake-choice{
  width:100%;
  min-height:62px;
  display:grid;
  place-items:center;
  gap:4px;
  border:1px dashed rgba(255,255,255,.22);
  border-radius:11px;
  background:rgba(255,255,255,.055);
  color:var(--text);
  cursor:pointer;
}
.presentation-slide-keepsake-choice:hover{
  border-color:rgba(96,165,250,.68);
  background:rgba(96,165,250,.15);
}
.presentation-slide-keepsake-choice small{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:9px;
  font-weight:850;
  opacity:.76;
}
.presentation-slide-keepsake-thumb{
  width:48px;
  height:30px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:8px;
  background:rgba(0,0,0,.26);
  color:rgba(255,255,255,.82);
  font-size:10px;
  font-weight:900;
  line-height:1.1;
  text-align:center;
}
.presentation-slide-keepsake-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.presentation-slide-keepsake-delete{
  position:absolute;
  top:4px;
  right:4px;
  z-index:4;
  width:16px;
  height:16px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:rgba(8,13,22,.76);
  color:rgba(255,255,255,.82);
  font-size:10px;
  font-weight:1000;
  line-height:16px;
  text-align:center;
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease, transform .14s ease, border-color .14s ease, background .14s ease;
}
.presentation-slide-keepsake-card:hover .presentation-slide-keepsake-delete,
.presentation-slide-keepsake-delete:focus-visible{
  opacity:1;
  pointer-events:auto;
}
.presentation-slide-keepsake-delete:hover{
  border-color:rgba(248,113,113,.72);
  background:rgba(127,29,29,.84);
}
.presentation-slide-text-toolbar select,
.presentation-slide-text-toolbar input,
.presentation-slide-points-toolbar input[type="number"]{
  min-width:0;
  height:34px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  background:rgba(0,0,0,.28);
  color:var(--text);
  padding:0 8px;
}
.presentation-slide-text-toolbar-font{
  width:100%;
}
.presentation-slide-text-toolbar-size{
  display:flex;
  align-items:center;
  gap:6px;
  color:rgba(255,255,255,.7);
  font-size:.78rem;
  font-weight:800;
}
.presentation-slide-text-toolbar-size input{
  width:62px;
}
.presentation-slide-points-toggle{
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.78);
  font-size:.82rem;
  font-weight:900;
}
.presentation-slide-points-toggle input{
  width:16px;
  height:16px;
  accent-color:#4cd964;
}
.presentation-slide-text-toolbar-toggle{
  width:34px;
  height:34px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:10px;
  background:rgba(0,0,0,.24);
  color:var(--text);
  font-weight:900;
  cursor:pointer;
}
.presentation-slide-text-toolbar-toggle:hover,
.presentation-slide-text-toolbar-toggle.active{
  border-color:rgba(245,158,11,.58);
  background:rgba(245,158,11,.22);
}
.presentation-slide-text-toolbar-toggle[title="Underline"]{
  text-decoration:underline;
}
.presentation-slide-text-align-group{
  display:flex;
  align-items:center;
  gap:4px;
}
.presentation-slide-text-align-button{
  width:28px;
  padding:0;
  font-size:.76rem;
  display:grid;
  place-items:center;
}
.presentation-slide-align-icon{
  width:16px;
  height:14px;
  display:grid;
  gap:2px;
}
.presentation-slide-align-icon span{
  display:block;
  height:2px;
  border-radius:999px;
  background:currentColor;
}
.presentation-slide-align-icon.align-left span:nth-child(1),
.presentation-slide-align-icon.align-left span:nth-child(3){
  width:70%;
  justify-self:start;
}
.presentation-slide-align-icon.align-left span:nth-child(2){
  width:100%;
  justify-self:start;
}
.presentation-slide-align-icon.align-center span:nth-child(1),
.presentation-slide-align-icon.align-center span:nth-child(3){
  width:70%;
  justify-self:center;
}
.presentation-slide-align-icon.align-center span:nth-child(2){
  width:100%;
  justify-self:center;
}
.presentation-slide-align-icon.align-right span:nth-child(1),
.presentation-slide-align-icon.align-right span:nth-child(3){
  width:70%;
  justify-self:end;
}
.presentation-slide-align-icon.align-right span:nth-child(2){
  width:100%;
  justify-self:end;
}
.presentation-slide-maker-element-controls,
.presentation-slide-maker-element-detail{
  display:grid;
  gap:8px;
}
.presentation-slide-maker-element-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  align-items:center;
  gap:8px;
  padding:7px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
  background:rgba(255,255,255,.035);
  cursor:pointer;
}
.presentation-slide-maker-element-row.active{
  border-color:rgba(245,158,11,.42);
  background:rgba(245,158,11,.12);
}
.presentation-slide-maker-preview{
  position:relative;
  min-height:0;
  display:block;
  padding:34px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:24px;
  color:#f7f4ea;
  text-align:center;
  overflow:auto;
  box-shadow:0 24px 64px rgba(0,0,0,.34);
}
.presentation-slide-maker-preview.drag-over{
  outline:3px dashed rgba(245,158,11,.72);
  outline-offset:-12px;
}
.presentation-slide-maker-empty{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.58);
  font-size:1.2rem;
  font-weight:800;
  pointer-events:none;
}
.presentation-slide-marquee{
  position:absolute;
  z-index:2147483646;
  border:2px dashed rgba(245,158,11,.88);
  border-radius:10px;
  background:rgba(245,158,11,.12);
  pointer-events:none;
}
.presentation-slide-element{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  min-height:24px;
  padding:8px;
  border:1px solid transparent;
  border-radius:10px;
  cursor:grab;
  user-select:none;
  touch-action:none;
}
.presentation-slide-element.active{
  border-color:rgba(245,158,11,.9);
  box-shadow:0 0 0 2px rgba(245,158,11,.18);
}
.presentation-slide-element.ghosted{
  display:none;
  pointer-events:none;
}
.presentation-slide-element:active{
  cursor:grabbing;
}
.presentation-slide-element-image{
  padding:0;
  overflow:visible;
}
.presentation-slide-element-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  pointer-events:none;
  border-radius:10px;
  clip-path:inset(0 round 10px);
}
.presentation-slide-element-group{
  padding:0;
  overflow:visible;
}
.presentation-slide-group-content{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:visible;
  pointer-events:none;
}
.presentation-slide-group-child,
.student-presentation-group-child{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px;
  border-radius:10px;
  overflow:hidden;
  text-align:center;
  white-space:pre-wrap;
  word-break:break-word;
  pointer-events:none;
}
.presentation-slide-group-child-image,
.student-presentation-group-child-image{
  padding:0;
}
.presentation-slide-group-child-image img,
.student-presentation-group-child-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  pointer-events:none;
  border-radius:10px;
}
.presentation-slide-element-text{
  align-items:center;
  justify-content:center;
  overflow:visible;
  text-align:center;
  white-space:pre-wrap;
}
.presentation-slide-text-content{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:inherit;
  text-align:inherit;
  outline:none;
  overflow:hidden;
  white-space:pre-wrap;
  word-break:break-word;
}
.presentation-slide-text-content[contenteditable="true"]{
  cursor:text;
  user-select:text;
  box-shadow:inset 0 0 0 2px rgba(245,158,11,.55);
  background:rgba(0,0,0,.18);
}
.presentation-slide-element-chrome{
  position:absolute;
  inset:-5px;
  z-index:20;
  border:1px dashed transparent;
  border-radius:14px;
  pointer-events:none;
}
.presentation-slide-element:hover .presentation-slide-element-chrome,
.presentation-slide-element.active .presentation-slide-element-chrome,
.presentation-slide-question-field:hover .presentation-slide-element-chrome,
.presentation-slide-question-field.active .presentation-slide-element-chrome{
  border-color:rgba(255,255,255,.52);
}
.presentation-slide-element-tool{
  position:absolute;
  top:50%;
  z-index:30;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  display:none;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(0,0,0,.72);
  color:var(--panel-header-text);
  font-size:10px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  box-shadow:0 5px 12px rgba(0,0,0,.24);
}
.presentation-slide-element-tool.danger{ left:-6px; }
.presentation-slide-element-tool.color{ right:-6px; }
.presentation-slide-element-tool.layer-up,
.presentation-slide-element-tool.layer-down{
  top:-10px;
  transform:none;
}
.presentation-slide-element-tool.layer-up{ left:calc(50% - 22px); }
.presentation-slide-element-tool.layer-down{ left:calc(50% + 4px); }
.presentation-slide-element-tool.interactable{
  top:auto;
  bottom:-14px;
  left:calc(50% - 30px);
  width:auto;
  min-width:74px;
  height:20px;
  padding:0 8px;
  transform:translateX(-50%);
  border-radius:999px;
  font-size:9px;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.presentation-slide-element-tool.shape{
  top:auto;
  bottom:-14px;
  left:calc(50% + 54px);
  width:auto;
  min-width:46px;
  height:20px;
  padding:0 8px;
  transform:translateX(-50%);
  border-radius:999px;
  font-size:9px;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.presentation-slide-element:hover .presentation-slide-element-tool,
.presentation-slide-element.active .presentation-slide-element-tool,
.presentation-slide-element:focus-within .presentation-slide-element-tool,
.presentation-slide-question-field:hover .presentation-slide-element-tool,
.presentation-slide-question-field.active .presentation-slide-element-tool,
.presentation-slide-question-field:focus-within .presentation-slide-element-tool{
  display:flex;
}
.presentation-slide-element-tool:hover{
  background:rgba(245,158,11,.92);
  color:#111827;
}
.presentation-slide-element-tool.danger:hover{
  background:rgba(248,113,113,.95);
  color:#111827;
}
.presentation-slide-color-popover{
  position:absolute;
  top:calc(100% + 8px);
  right:-6px;
  z-index:40;
  display:grid;
  gap:7px;
  min-width:132px;
  padding:9px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:rgba(11,18,28,.96);
  box-shadow:0 12px 28px rgba(0,0,0,.36);
}
.presentation-slide-interactable-popover{
  position:absolute;
  left:50%;
  top:calc(100% + 14px);
  z-index:10;
  width:min(210px, 90vw);
  max-height:180px;
  display:grid;
  gap:7px;
  padding:9px;
  overflow:auto;
  transform:translateX(-50%);
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:rgba(11,18,28,.97);
  box-shadow:0 14px 30px rgba(0,0,0,.38);
}
.presentation-slide-interactable-popover.floating{
  z-index:2147483647;
  transform:translateX(-50%);
}
.presentation-slide-interactable-popover button{
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  padding:8px 10px;
  font:inherit;
  font-size:12px;
  font-weight:800;
  text-align:left;
}
.presentation-slide-interactable-popover button:hover{
  background:rgba(76,217,100,.16);
  border-color:rgba(76,217,100,.36);
}
.presentation-slide-shape-popover{
  position:absolute;
  z-index:2147483647;
  width:min(260px, 92vw);
  display:grid;
  gap:8px;
  padding:10px;
  transform:translateX(-50%);
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;
  background:rgba(11,18,28,.97);
  box-shadow:0 14px 30px rgba(0,0,0,.38);
}
.presentation-slide-shape-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:6px;
}
.presentation-slide-shape-choice{
  position:relative;
  min-height:48px;
  display:grid;
  place-items:center;
  gap:2px;
  border:1px dashed rgba(255,255,255,.22);
  border-radius:11px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  cursor:grab;
}
.presentation-slide-shape-choice:disabled{
  cursor:not-allowed;
  opacity:.42;
}
.presentation-slide-shape-choice span{
  font-size:20px;
  line-height:1;
}
.presentation-slide-shape-choice small{
  font-size:9px;
  font-weight:850;
  opacity:.72;
}
.presentation-slide-shape-choice.custom{
  overflow:hidden;
}
.presentation-slide-shape-choice-thumb{
  position:relative;
  width:28px;
  height:24px;
  color:#f59e0b;
  filter:drop-shadow(0 1px 4px rgba(0,0,0,.45));
}
.presentation-slide-shape-choice-delete{
  position:absolute;
  top:3px;
  right:3px;
  z-index:3;
  display:grid;
  place-items:center;
  box-sizing:border-box;
  width:15px;
  height:15px;
  padding:0;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(8,13,22,.72);
  color:rgba(255,255,255,.76);
  font-size:0;
  font-family:Arial, sans-serif;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  box-shadow:0 4px 10px rgba(0,0,0,.24);
  transform:scale(.96);
  transition:opacity .14s ease, transform .14s ease, border-color .14s ease, background .14s ease, color .14s ease;
}
.presentation-slide-shape-choice-delete::before{
  content:"x";
  display:block;
  font-size:10px;
  line-height:1;
  transform:translateY(-.5px);
}
.presentation-slide-shape-choice.custom:hover .presentation-slide-shape-choice-delete,
.presentation-slide-shape-choice-delete:focus-visible{
  opacity:.95;
  pointer-events:auto;
  transform:scale(1);
}
.presentation-slide-shape-choice-delete:hover{
  opacity:1;
  border-color:rgba(248,113,113,.72);
  background:rgba(127,29,29,.82);
  color:#fff;
}
.presentation-slide-shape-choice:hover,
.presentation-slide-shape-choice.active{
  border-color:rgba(245,158,11,.72);
  background:rgba(245,158,11,.16);
}
.presentation-slide-shape-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.presentation-slide-shape-actions button{
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  padding:8px 10px;
  font:inherit;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}
.presentation-slide-shape-actions button:hover{
  border-color:rgba(245,158,11,.46);
  background:rgba(245,158,11,.16);
}
.presentation-slide-shape-frame{
  position:absolute;
  z-index:25;
  display:grid;
  place-items:center;
  border:0;
  color:rgba(245,158,11,.9);
  background:transparent;
  cursor:move;
  pointer-events:auto;
}
.presentation-slide-shape-frame-outline{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  color:#f59e0b;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.55));
  pointer-events:none;
}
.presentation-slide-shape-choice .presentation-slide-shape-choice-thumb{
  position:relative;
  inset:auto;
  width:28px;
  height:24px;
  filter:drop-shadow(0 1px 4px rgba(0,0,0,.45));
}
.presentation-slide-shape-frame-resize{
  position:absolute;
  width:13px;
  height:13px;
  border-radius:4px;
  border:1px solid rgba(255,255,255,.86);
  background:#f59e0b;
  cursor:nwse-resize;
}
.presentation-slide-shape-frame-resize.nw{
  left:-7px;
  top:-7px;
  cursor:nwse-resize;
}
.presentation-slide-shape-frame-resize.ne{
  right:-7px;
  top:-7px;
  cursor:nesw-resize;
}
.presentation-slide-shape-frame-resize.sw{
  left:-7px;
  bottom:-7px;
  cursor:nesw-resize;
}
.presentation-slide-shape-frame-resize.se{
  right:-7px;
  bottom:-7px;
  cursor:nwse-resize;
}
.presentation-slide-shape-sketch{
  position:absolute;
  inset:0;
  z-index:26;
  width:100%;
  height:100%;
  cursor:crosshair;
  overflow:visible;
  pointer-events:auto;
}
.presentation-slide-shape-sketch-line{
  fill:none;
  stroke:#f59e0b;
  stroke-width:2.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:3 4;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.52));
}
.presentation-slide-context-menu{
  position:fixed;
  z-index:2147483647;
  min-width:144px;
  display:grid;
  gap:6px;
  padding:7px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  background:rgba(11,18,28,.98);
  box-shadow:0 16px 34px rgba(0,0,0,.42);
}
.presentation-slide-context-menu button{
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:9px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  padding:8px 10px;
  font:inherit;
  font-size:12px;
  font-weight:850;
  text-align:left;
  cursor:pointer;
}
.presentation-slide-context-menu button:hover{
  border-color:rgba(245,158,11,.46);
  background:rgba(245,158,11,.16);
}
.presentation-slide-interactable-answer{
  position:absolute;
  left:50%;
  bottom:-38px;
  z-index:8;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  transform:translateX(-50%);
  border:2px solid rgba(255,255,255,.72);
  border-radius:999px;
  color:#07110a;
  font-size:18px;
  font-weight:1000;
  line-height:1;
  box-shadow:0 8px 16px rgba(0,0,0,.3);
  cursor:pointer;
}
.presentation-slide-interactable-answer.correct{
  background:#4cd964;
}
.presentation-slide-interactable-answer.incorrect{
  background:#ff5b5b;
}
.presentation-slide-interactable-answer:hover{
  filter:brightness(1.08);
  transform:translateX(-50%) scale(1.06);
}
.presentation-slide-interactable-match-badge{
  position:absolute;
  left:50%;
  bottom:-38px;
  z-index:8;
  transform:translateX(-50%);
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(76,217,100,.34);
  background:rgba(11,18,28,.92);
  color:rgba(255,255,255,.82);
  font-size:.64rem;
  font-weight:900;
  white-space:nowrap;
  pointer-events:none;
}
.presentation-slide-interactable-match-badge.linked{
  color:#baf7c7;
  border-color:rgba(76,217,100,.62);
}
.presentation-slide-reveal-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:2147483200;
  pointer-events:none;
  overflow:visible;
}
.presentation-slide-reveal-line{
  fill:none;
  stroke:rgba(76,217,100,.62);
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.35));
}
.presentation-slide-reveal-target{
  position:absolute;
  z-index:2147483400;
  display:grid;
  place-items:center;
  min-width:18px;
  min-height:18px;
  border:2px dashed rgba(76,217,100,.92);
  border-radius:999px;
  background:rgba(76,217,100,.13);
  box-shadow:0 0 0 4px rgba(76,217,100,.08), 0 10px 22px rgba(0,0,0,.22);
  cursor:grab;
  pointer-events:auto;
}
.presentation-slide-reveal-target::before{
  content:"";
  width:38%;
  height:38%;
  border-radius:999px;
  background:rgba(76,217,100,.88);
  box-shadow:0 0 16px rgba(76,217,100,.5);
}
.presentation-slide-reveal-target.drag{
  border-color:rgba(255,185,64,.84);
  background:rgba(255,185,64,.14);
  box-shadow:0 0 0 4px rgba(255,185,64,.12), 0 10px 22px rgba(0,0,0,.28);
}
.presentation-slide-reveal-target.drag::before{
  background:rgba(255,185,64,.9);
  box-shadow:0 0 16px rgba(255,185,64,.5);
}
.presentation-slide-reveal-target-resize{
  position:absolute;
  right:-5px;
  bottom:-5px;
  width:10px;
  height:10px;
  border:1px solid rgba(255,255,255,.86);
  border-radius:999px;
  background:#4cd964;
  cursor:nwse-resize;
  box-shadow:0 3px 8px rgba(0,0,0,.3);
}
.presentation-slide-match-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:6;
  pointer-events:none;
  overflow:visible;
}
.presentation-slide-match-line{
  fill:none;
  stroke:rgba(76,217,100,.92);
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.presentation-slide-match-line.active{
  stroke-dasharray:5 4;
  opacity:.78;
}
.presentation-slide-connector-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  overflow:visible;
}
.presentation-slide-connector-line{
  fill:none;
  stroke:rgba(76,217,100,.68);
  stroke-width:1.45;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.35));
}
.presentation-slide-connector-line.match{
  stroke:rgba(76,217,100,.76);
}
.presentation-slide-connector-line.reveal{
  stroke:rgba(76,217,100,.58);
}
.presentation-slide-connector-line.drag{
  stroke:rgba(255,185,64,.74);
  stroke-width:2.6;
}
.presentation-slide-color-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 32px;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.84);
  font-size:11px;
  font-weight:800;
}
.presentation-slide-color-row input[type="color"]{
  width:32px;
  height:24px;
  padding:1px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:8px;
  background:transparent;
  cursor:pointer;
}
.presentation-slide-maker-question-tools{
  display:grid;
  gap:8px;
  padding:10px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}
.presentation-slide-question-field{
  position:absolute;
  z-index:5;
  display:grid;
  align-content:start;
  gap:6px;
  padding:12px;
  border:1px dashed rgba(250,204,122,.74);
  border-radius:16px;
  background:rgba(11,18,28,.72);
  color:#f7f4ea;
  text-align:left;
  cursor:grab;
  box-shadow:0 12px 26px rgba(0,0,0,.24);
}
.presentation-slide-question-full{
  position:absolute;
  inset:54px 24px 24px;
  z-index:5;
  display:grid;
  align-content:stretch;
  justify-items:stretch;
  gap:12px;
  padding:20px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  background:rgba(11,18,28,.94);
  color:#f7f4ea;
  text-align:left;
  overflow:auto;
  box-shadow:0 20px 46px rgba(0,0,0,.28);
}
.presentation-slide-question-full .question-preview-shell{
  width:100%;
  max-width:100%;
  align-self:stretch;
  color:inherit;
}
.presentation-slide-question-full .question-preview-prompt{
  color:inherit;
  font-size:clamp(1rem, 2vw, 1.35rem);
}
.presentation-slide-question-field.active{
  border-color:rgba(245,158,11,.92);
  box-shadow:0 0 0 2px rgba(245,158,11,.18), 0 12px 26px rgba(0,0,0,.24);
}
.presentation-slide-question-field:active{
  cursor:grabbing;
}
.presentation-slide-question-field-type{
  color:#facc7a;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.presentation-slide-question-field-prompt{
  min-width:0;
  overflow:hidden;
  color:rgba(255,255,255,.9);
  font-size:clamp(.9rem, 1.7vw, 1.18rem);
  line-height:1.25;
}
.presentation-slide-picture-arrow-layer,
.presentation-slide-picture-target-layer{
  z-index:4;
  pointer-events:none;
}
.presentation-slide-picture-target-layer .question-picture-target-shell{
  pointer-events:auto;
}
/* Legacy guard in case an older cached slide-maker view still emits the old toolbar class. */
.presentation-slide-element-toolbar{
  position:absolute;
  top:-18px;
  right:-10px;
  z-index:6;
  display:flex;
  align-items:center;
  gap:4px;
  opacity:0;
  pointer-events:none;
  transform:translateY(4px);
  transition:opacity .12s ease, transform .12s ease;
}
.presentation-slide-element:hover .presentation-slide-element-toolbar,
.presentation-slide-element.active .presentation-slide-element-toolbar{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}
.presentation-slide-element-resize{
  position:absolute;
  width:14px;
  height:14px;
  border-radius:4px;
  border:1px solid rgba(255,255,255,.82);
  background:#f59e0b;
  display:none;
  z-index:8;
}
.presentation-slide-element:hover .presentation-slide-element-resize,
.presentation-slide-element.active .presentation-slide-element-resize,
.presentation-slide-element:focus-within .presentation-slide-element-resize{
  display:block;
}
.presentation-slide-element-resize.nw{
  left:-6px;
  top:-6px;
  cursor:nwse-resize;
}
.presentation-slide-element-resize.ne{
  right:-6px;
  top:-6px;
  cursor:nesw-resize;
}
.presentation-slide-element-resize.sw{
  left:-6px;
  bottom:-6px;
  cursor:nesw-resize;
}
.presentation-slide-element-resize.se{
  right:-6px;
  bottom:-6px;
  cursor:nwse-resize;
}
.presentation-slide-maker-chip{
  position:absolute;
  right:18px;
  bottom:18px;
}

.student-presentation-assignment{
  display:grid;
  gap:12px;
}
.student-presentation-stage{
  display:grid;
}
.student-presentation-slide{
  position:relative;
  min-height:56vh;
  display:block;
  padding:28px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:24px;
  color:#f7f4ea;
  text-align:center;
  box-shadow:0 18px 42px rgba(0,0,0,.28);
  overflow:hidden;
}
.student-presentation-slide[hidden]{
  display:none !important;
}
.student-presentation-slide-count,
.student-presentation-counter{
  color:rgba(255,255,255,.72);
  font-size:.86rem;
  font-weight:800;
}
.student-presentation-slide.question-only .student-presentation-slide-count{
  display:none;
}
.student-presentation-slide-title{
  font-size:clamp(1.7rem, 4vw, 3.2rem);
  line-height:1.05;
  font-weight:900;
}
.student-presentation-slide img{
  max-width:min(760px, 100%);
  max-height:36vh;
  object-fit:contain;
  border-radius:18px;
}
.student-presentation-slide-elements{
  position:absolute;
  inset:0;
}
.student-presentation-slide.question-only .student-presentation-slide-elements{
  display:none;
}
.student-presentation-rendered-element{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px;
  border-radius:10px;
  overflow:hidden;
  white-space:pre-wrap;
  text-align:left;
}
.student-presentation-rendered-element.interactable{
  cursor:pointer;
  outline:2px solid rgba(76,217,100,.28);
  outline-offset:3px;
  transition:outline-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.student-presentation-rendered-element.interactable:hover,
.student-presentation-rendered-element.interactable:focus-visible{
  outline-color:rgba(76,217,100,.72);
  box-shadow:0 0 0 5px rgba(76,217,100,.12);
}
.student-presentation-rendered-element.interactable.selected{
  outline-color:rgba(76,217,100,.95);
  box-shadow:0 0 0 6px rgba(76,217,100,.18), 0 12px 24px rgba(0,0,0,.24);
}
.student-presentation-rendered-element.interactable.disabled{
  cursor:default;
  opacity:.78;
}
.student-presentation-rendered-element.reveal-field{
  opacity:0;
  pointer-events:none;
  transform:scale(.98);
  transition:opacity .22s ease, transform .22s ease;
}
.student-presentation-rendered-element.reveal-field.revealed{
  opacity:1;
  transform:scale(1);
}
.student-presentation-rendered-element.drag-field{
  cursor:grab;
  touch-action:none;
  transition:transform .12s ease;
}
.student-presentation-rendered-element.drag-field:hover,
.student-presentation-rendered-element.drag-field:focus-visible{
  box-shadow:none;
}
.student-presentation-rendered-element.drag-field.dragging{
  cursor:grabbing;
  opacity:.9;
  pointer-events:none;
}
.student-presentation-rendered-element.drag-field.disabled{
  cursor:default;
  opacity:.78;
}
.student-presentation-rendered-element.drop-field{
  outline:0;
}
.student-presentation-reveal-target{
  position:absolute;
  display:grid;
  place-items:center;
  min-width:18px;
  min-height:18px;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  box-shadow:none;
  opacity:0;
  cursor:pointer;
  transition:transform .16s ease, background .16s ease, box-shadow .16s ease, border-color .16s ease;
  z-index:2147483000;
}
.student-presentation-reveal-target:hover,
.student-presentation-reveal-target:focus-visible{
  opacity:0;
  transform:none;
  background:transparent;
  box-shadow:none;
}
.student-presentation-reveal-target.found{
  opacity:.35;
  pointer-events:none;
}
.student-presentation-drag-target{
  position:absolute;
  opacity:0;
  background:transparent;
  border:0;
  pointer-events:auto;
  z-index:2147483000;
}
.student-presentation-rendered-element.field-match{
  cursor:crosshair;
  outline:2px solid rgba(86,190,255,.28);
  outline-offset:3px;
  transition:outline-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.student-presentation-rendered-element.field-match:hover,
.student-presentation-rendered-element.field-match:focus-visible{
  outline-color:rgba(86,190,255,.74);
  box-shadow:0 0 0 5px rgba(86,190,255,.12);
}
.student-presentation-rendered-element.field-match.selected{
  outline-color:rgba(86,190,255,.95);
  box-shadow:0 0 0 6px rgba(86,190,255,.18), 0 12px 24px rgba(0,0,0,.24);
}
.student-presentation-rendered-element.field-match.connected{
  outline-color:rgba(76,217,100,.78);
}
.student-presentation-rendered-element.field-match.disabled{
  cursor:default;
  opacity:.78;
}
.student-presentation-match-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:9;
  pointer-events:none;
  overflow:visible;
}
.student-presentation-match-line{
  fill:none;
  stroke:rgba(86,190,255,.92);
  stroke-width:4;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.student-presentation-match-line.active{
  stroke-dasharray:10 8;
  opacity:.82;
}
.student-presentation-rendered-image{
  padding:0;
}
.student-presentation-rendered-image img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:fill;
  border-radius:0;
}
.student-presentation-rendered-group{
  padding:0;
  overflow:visible;
}
.student-presentation-slide-body{
  max-width:76ch;
  font-size:clamp(1rem, 2vw, 1.35rem);
  line-height:1.45;
  white-space:pre-wrap;
}
.student-presentation-question{
  width:min(860px, 100%);
  display:grid;
  gap:10px;
  padding:14px;
  border-radius:18px;
  background:rgba(8,12,18,.72);
  text-align:left;
}
.student-presentation-question.positioned{
  position:absolute;
  z-index:6;
  width:auto;
  max-width:none;
  overflow:auto;
}
.student-presentation-question.full-slide{
  position:absolute;
  z-index:20;
  inset:24px;
  width:auto;
  max-width:none;
  overflow:auto;
  align-content:start;
  background:rgba(11,18,28,.9);
  box-shadow:0 18px 44px rgba(0,0,0,.34);
}
.student-presentation-question.picture-label{
  position:absolute;
  left:16px;
  right:16px;
  bottom:16px;
  z-index:7;
  width:auto;
  max-width:min(640px, calc(100% - 32px));
  padding:10px 12px;
  background:rgba(11,18,28,.56);
}
.student-presentation-picture-arrow-layer,
.student-presentation-picture-target-layer{
  z-index:5;
  pointer-events:none;
}
.student-presentation-picture-target-layer .question-picture-preview-pill,
.student-presentation-picture-target-layer .question-picture-preview-drop{
  pointer-events:auto;
}
.student-presentation-picture-bank{
  margin-top:6px;
}
.student-presentation-nav{
  justify-content:center;
}
.assignment-video-box{
  display:grid;
  gap:10px;
  padding:10px;
  border-radius:12px;
  border:1px dashed rgba(255,255,255,.18);
  background:rgba(255,255,255,.018);
}
.assignment-video-source-card{
  display:grid;
  gap:10px;
}
.assignment-video-rewind-row{
  display:flex;
  align-items:center;
  gap:8px;
}
.assignment-video-rewind-row input{
  width:96px;
}
.assignment-video-node-list{
  display:grid;
  gap:10px;
}
.assignment-video-node-list-title{
  font-weight:800;
  color:var(--panel-header-text);
}
.assignment-video-node{
  display:grid;
  gap:8px;
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}
.assignment-video-node.is-focused{
  border-color:rgba(106,169,255,.35);
  box-shadow:0 0 0 1px rgba(106,169,255,.16) inset;
}
.assignment-video-node-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.assignment-video-node-time{
  font-weight:800;
  color:var(--panel-header-text);
}
.assignment-video-node-meta{
  margin-top:4px;
  font-size:12px;
  color:var(--muted);
}
.assignment-video-node-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
  flex-wrap:wrap;
}
.assignment-video-node-drop{
  min-height:58px;
  display:grid;
  place-items:center;
  padding:12px;
  text-align:center;
  color:var(--muted);
  border-radius:12px;
  border:1px dashed rgba(255,255,255,.16);
  background:rgba(255,255,255,.02);
  transition:border-color .12s ease, background .12s ease, color .12s ease;
}
.assignment-video-node-drop.active{
  border-color:rgba(106,169,255,.7);
  background:rgba(106,169,255,.08);
  color:var(--text);
}
.assignment-video-node-question{
  cursor:pointer;
}
.question-tag-modal.in-assignment-editor{
  position:absolute;
  inset:0;
  z-index:11;
  padding:10px 12px 12px;
  background:linear-gradient(180deg, rgba(12,12,14,.98), rgba(18,18,22,.97));
}
.question-tag-modal.in-assignment-editor .question-tag-modal-card.question-video-viewer-card{
  width:100%;
  max-width:none;
  max-height:none;
  height:100%;
  border-radius:inherit;
}
.question-video-viewer-extra{
  display:grid;
  gap:10px;
}

.question-editor-modal{
  position:fixed;
  inset:0;
  z-index:1660;
  background:rgba(0,0,0,.62);
  display:flex;
  align-items:center;
  justify-content:center;
}
.question-editor-card{
  width:min(1100px,95vw);
  max-height:min(90vh,960px);
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:16px;
  border-radius:18px;
  background:#111;
  border:1px solid rgba(255,255,255,.08);
}
.question-editor-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.question-editor-title{
  font-size:20px;
  font-weight:800;
  color:var(--panel-header-text);
}
.question-editor-subtitle{
  font-size:12px;
  color:var(--muted);
}
.question-editor-body{
  overflow:auto;
  min-height:0;
}
.assignment-question-overlay{
  position:absolute;
  inset:0;
  z-index:120;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:10px;
  padding:10px 12px 12px;
  border-radius:inherit;
  background:linear-gradient(180deg, #0c0c0e, #121216);
}
.presentation-slide-maker-overlay > .assignment-question-overlay{
  position:fixed;
  inset:0;
  z-index:2147483647;
  border-radius:0;
  background:#0c0c0e;
}
.assignment-question-overlay-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.assignment-question-overlay-back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:700;
}
.assignment-question-overlay-title{
  font-size:18px;
  font-weight:800;
  color:var(--panel-header-text);
}
.assignment-question-overlay-subtitle{
  font-size:12px;
  color:var(--muted);
}
.assignment-question-overlay-body{
  min-height:0;
  overflow:auto;
}
.question-filing-inputs{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) auto;
  gap:8px;
  align-items:end;
}
.question-filing-list{
  display:grid;
  gap:6px;
}
.question-filing-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.02);
}
.question-filing-row-compact .btn{
  padding:5px 8px !important;
}
.question-filing-head{
  font-size:11px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
}
.question-filing-cell{
  min-width:0;
  font-size:13px;
  font-weight:700;
}
.question-filing-path{
  min-width:0;
  font-size:12px;
  font-weight:700;
  color:var(--text);
}
.question-filing-usage{
  min-width:28px;
  text-align:center;
  padding:3px 6px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  color:var(--muted);
  font-size:11px;
}
.question-bank-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}
.question-type-grid{display:grid; gap:10px}
.question-card-lite{
  border:1px solid rgba(255,255,255,.06);
  border-radius:10px;
  background: rgba(255,255,255,.015);
  padding:8px 10px;
  display:grid;
  gap:8px;
}
.student-worksheet-question-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.student-question-submitted-badge{
  justify-self:end;
  border:1px solid rgba(255,90,90,.42);
  border-radius:999px;
  background:rgba(255,70,70,.12);
  color:#ffb4b4;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  line-height:1;
  padding:5px 8px;
  text-transform:uppercase;
  white-space:nowrap;
}
.question-inline-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.question-inline-row > *{min-width:0}
.question-tag-list,.question-chip-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.question-tag{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 8px;
  border-radius:999px;
  background: rgba(106,169,255,.12);
  border:1px solid rgba(106,169,255,.3);
  font-size:12px;
}
.question-tag button,.mini-x{
  border:0;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  padding:0;
  line-height:1;
}
.question-bank-entry{display:grid; gap:4px}
.question-bank-entry-title{font-weight:800}
.question-bank-entry-meta{
  font-size:12px;
  color:var(--muted);
}
.question-bank-entry-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.question-tag-count-btn{
  flex:0 0 auto;
  min-width:24px;
  padding:1px 7px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
  color:var(--minor1);
  font-size:11px;
  line-height:1.3;
}
.question-tag-count-btn:hover{
  border-color: rgba(255,255,255,.2);
  background: rgba(255,255,255,.08);
}
.question-tag-dropbox-card{
  gap:8px;
}
.question-tag-dropbox-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.question-tag-dropbox{
  min-height:54px;
  border:1px dashed rgba(255,255,255,.14);
  border-radius:12px;
  padding:8px;
  background:rgba(255,255,255,.02);
  transition:border-color .12s ease, background .12s ease;
}
.question-tag-dropbox.active{
  border-color: rgba(106,169,255,.8);
  background: rgba(106,169,255,.08);
}
.question-tag-dropbox-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.question-tag-dropbox-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  font-size:11px;
  position:relative;
}
.question-tag-dropbox-chip-remove{
  border:none;
  background:transparent;
  color:var(--danger);
  padding:0;
  font-size:10px;
  line-height:1;
}
.question-tag-dropbox-detail{
  display:none;
  position:absolute;
  left:0;
  top:calc(100% + 6px);
  z-index:30;
  min-width:280px;
  max-width:420px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:#111;
  box-shadow:0 10px 22px rgba(0,0,0,.35);
  pointer-events:none;
}
.question-tag-dropbox-chip:hover .question-tag-dropbox-detail{
  display:grid;
  gap:4px;
}
.question-tag-dropbox-detail-line{
  font-size:12px;
  line-height:1.35;
  white-space:pre-wrap;
}
.question-tag-dropbox-detail-name{
  font-weight:800;
}
.question-tag-dropbox-detail-separator{
  opacity:.8;
}
.question-tag-dropbox-detail-line.is-strand{
  color:var(--panel-header-text);
}
.question-tag-dropbox-detail-line.is-topic{
  color:var(--minor3);
}
.question-tag-dropbox-detail-line.is-subtopic{
  color:var(--minor1);
}
.question-tag-modal{
  position:fixed;
  inset:0;
  z-index:1600;
  background:rgba(0,0,0,.55);
  align-items:center;
  justify-content:center;
}
.question-tag-modal-card{
  width:min(620px,92vw);
  max-height:min(78vh,760px);
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:16px;
  border-radius:16px;
  background:#111;
  border:1px solid rgba(255,255,255,.08);
}
.question-tag-modal-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.question-tag-modal-title{
  font-weight:800;
  color:var(--panel-header-text);
}
.question-tag-modal-body{
  display:grid;
  gap:8px;
  overflow:auto;
}
.question-tag-modal-item{
  text-align:left;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:var(--text);
}
.question-tag-modal-item-main{
  display:grid;
  gap:3px;
  min-width:0;
  flex:1 1 auto;
  cursor:grab;
  user-select:none;
}
.question-tag-modal-item-main:active{
  cursor:grabbing;
}
.question-tag-modal-item-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:6px;
}
.question-tag-modal-item .question-tag-modal-item-actions{
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease;
}
.question-tag-modal-item:hover .question-tag-modal-item-actions{
  opacity:1;
  pointer-events:auto;
}
.question-tag-modal-item:hover .question-bank-explorer-inline-edit,
.question-tag-modal-item:hover .question-bank-explorer-inline-delete{
  opacity:1;
  pointer-events:auto;
}
.question-bank-explorer-question-item .question-tag-modal-item-actions{
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease;
}
.question-bank-explorer-question-item:hover .question-tag-modal-item-actions{
  opacity:1;
  pointer-events:auto;
}
.question-bank-explorer-question-item:hover .question-bank-explorer-inline-edit,
.question-bank-explorer-question-item:hover .question-bank-explorer-inline-delete{
  opacity:1;
  pointer-events:auto;
}
.question-tag-modal-edit-btn{
  padding:5px 8px !important;
  font-size:11px;
}
.question-tag-modal-preview-btn{
  padding:5px 8px !important;
  font-size:11px;
}
.question-tag-modal-delete-btn{
  padding:5px 8px !important;
  font-size:11px;
  color:var(--danger);
}
.question-tag-modal-item:hover{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.15);
}
.question-tag-modal-item-title{
  font-weight:700;
}
.question-bank-tag-overlay .question-tag-modal-item-title{
  color:var(--minor2);
}
.question-tag-modal-item-meta{
  font-size:12px;
  color:var(--muted);
}
.question-bank-panel-overlay{
  position:absolute;
  inset:0;
  z-index:25;
  display:flex;
  align-items:stretch;
  justify-content:stretch;
  background:rgba(0,0,0,.18);
}
.question-bank-panel-overlay-card{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:8px 10px 10px;
  background:transparent;
  border-radius:0;
  border:none;
}
.question-bank-tag-overlay{
  background:rgba(0,0,0,.42);
}
.question-bank-tag-overlay-card{
  background:#111;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
}
.question-bank-tag-overlay-body{
  gap:8px;
}
.question-bank-panel-overlay-body{
  display:grid;
  gap:6px;
  overflow:auto;
  min-height:0;
}
.question-bank-explorer-header{
  display:flex;
  order:2;
  align-items:center;
  gap:8px;
  padding:8px 2px 0;
  margin-top:auto;
  background:transparent;
  border:none;
}
.question-bank-explorer-header .question-tag-modal-title{
  display:none;
}
.question-bank-explorer-back{
  padding:4px 8px !important;
  font-size:11px;
  margin-right:auto;
}
.question-bank-explorer-body{
  order:1;
  align-content:start;
}
.question-bank-explorer-row{
  width:100%;
  text-align:left;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:7px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.018);
  color:var(--text);
  cursor:pointer;
}
.question-bank-explorer-row:hover{
  background:rgba(255,255,255,.024);
  border-color:rgba(255,255,255,.1);
}
.question-bank-explorer-row-main{
  display:grid;
  gap:3px;
  min-width:0;
  flex:1 1 auto;
}
.question-bank-explorer-row-kind{
  display:none !important;
}
.question-bank-explorer-row-title{
  font-size:18px;
  font-weight:900;
  color:var(--panel-header-text);
  line-height:1.1;
  text-align:left;
}
.question-bank-explorer-row-description{
  display:none;
  font-size:11px;
  line-height:1.3;
  color:inherit;
  white-space:pre-wrap;
}
.question-strand-block .question-bank-explorer-row-description{
  color:var(--panel-header-text);
}
.question-bank-explorer-row-topic .question-bank-explorer-row-title,
.question-bank-explorer-row-topic .question-bank-explorer-row-description{
  color:var(--minor3);
}
.question-bank-explorer-row-topic.is-focused .question-bank-explorer-chevron{
  transform:rotate(90deg);
  color:var(--minor3);
}
.question-bank-explorer-row-subtopic .question-bank-explorer-row-title{
  font-size:13px;
  color:var(--minor1);
}
.question-bank-explorer-row-subtopic .question-bank-explorer-row-description{
  color:var(--minor1);
}
.question-bank-explorer-row-meta{
  font-size:12px;
  color:var(--muted);
}
.question-bank-explorer-row-meta.is-action{
  margin-right:2px;
  font-size:12px;
  line-height:1.1;
  white-space:nowrap;
}
.question-bank-explorer-row-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
}
.question-bank-explorer-drag-icon{
  color:var(--panel-header-text);
  cursor:grab;
}
.question-bank-explorer-row-tail{
  display:flex;
  align-items:center;
  gap:8px;
}
.question-bank-explorer-question-list{
  display:grid;
  gap:8px;
  margin:0 0 4px 18px;
  padding:0;
  border-left:none;
}
.question-bank-explorer-question-item .question-tag-modal-item-title{
  color:var(--minor2);
}
.question-bank-explorer-question-item{
  background:rgba(255,255,255,.02);
  border-color:rgba(255,255,255,.06);
}
#questionBankList .question-strand-wrap{
  gap:3px;
  padding:8px;
}
#questionBankList .question-strand-block{
  padding:4px 7px;
  border-radius:9px;
  transition:padding .14s ease, background .14s ease, border-color .14s ease;
}
#questionBankList .question-strand-block:hover,
#questionBankList .question-strand-block.is-focused{
  padding:6px 8px;
}
#questionBankList .question-strand-header{
  gap:6px;
  min-height:28px;
}
#questionBankList .question-strand-title{
  font-size:15px;
}
#questionBankList .question-bank-explorer-row{
  padding:4px 7px;
  gap:6px;
  border-radius:9px;
  min-height:28px;
  transition:padding .14s ease, background .14s ease, border-color .14s ease, margin-left .14s ease, width .14s ease;
}
#questionBankList .question-bank-explorer-row:hover,
#questionBankList .question-bank-explorer-row.is-focused{
  padding:6px 8px;
}
#questionBankList .question-bank-explorer-row-topic{
  margin-left:16px;
  width:calc(100% - 16px);
}
#questionBankList .question-bank-explorer-row-subtopic{
  margin-left:32px;
  width:calc(100% - 32px);
}
#questionBankList .question-bank-explorer-row-topic:hover,
#questionBankList .question-bank-explorer-row-topic.is-focused,
#questionBankList .question-bank-explorer-row-subtopic:hover,
#questionBankList .question-bank-explorer-row-subtopic.is-focused{
  margin-left:0;
  width:100%;
}
#questionBankList .question-bank-explorer-row-title{
  font-size:14px;
}
#questionBankList .question-bank-explorer-row-topic .question-bank-explorer-row-title{
  font-size:13px;
}
#questionBankList .question-bank-explorer-row-subtopic .question-bank-explorer-row-title{
  font-size:12px;
}
#questionBankList .question-strand-drag-icon,
#questionBankList .question-bank-explorer-drag-icon{
  opacity:0;
  width:0;
  overflow:hidden;
  transition:opacity .14s ease, width .14s ease;
}
#questionBankList .question-strand-block:hover .question-strand-drag-icon,
#questionBankList .question-bank-explorer-row:hover .question-bank-explorer-drag-icon,
#questionBankList .question-strand-drag-icon:active,
#questionBankList .question-bank-explorer-drag-icon:active{
  opacity:1;
  width:12px;
}
#questionBankList .question-bank-explorer-row-actions,
#questionBankList .question-bank-explorer-row-tail{
  gap:5px;
}
#questionBankList .question-bank-explorer-question-list{
  gap:5px;
  margin:2px 0 4px 20px;
}
.assignment-node-picker-list{
  align-content:start;
}
.assignment-node-picker-assignment{
  cursor:pointer;
}
.assignment-node-picker-assignment .question-tag-modal-item-main{
  cursor:pointer;
}
.assignment-node-picker-assignment .question-tag-modal-item-title{
  color:var(--minor2);
}
.assignment-node-picker-assignment.is-selected{
  background:rgba(106,169,255,.12);
  border-color:rgba(106,169,255,.38);
  box-shadow:inset 0 0 0 1px rgba(106,169,255,.2);
}
.question-topic-add-btn,
.question-subtopic-add-btn{
  background: var(--nav-bg2);
  border-color: transparent;
  color: var(--text);
  padding:6px 10px !important;
  font-size:11px;
  line-height:1.1;
  width:100%;
  justify-content:center;
}
.question-topic-add-btn:hover,
.question-subtopic-add-btn:hover{
  border-color: rgba(255,255,255,.18);
}
.question-topic-add-row,
.question-subtopic-add-row{
  display:flex;
  flex-wrap:nowrap;
  gap:8px;
  align-items:center;
}
.question-topic-add-row .btn,
.question-subtopic-add-row .btn{
  width:auto;
}
.question-topic-input,
.question-subtopic-input{
  flex:1 1 auto;
  min-width:0;
}
.question-bank-explorer-row-tools{
  display:flex;
  align-items:center;
  gap:6px;
}
.question-bank-explorer-inline-btn{
  min-width:0;
  padding:4px 8px !important;
  border-radius:8px;
  background:transparent;
  border-color:rgba(255,255,255,.12);
  color:var(--muted);
  font-size:10px;
  line-height:1.1;
}
.question-bank-explorer-inline-btn.is-active{
  border-color:rgba(255,255,255,.2);
  color:var(--text);
}
.question-bank-inline-rename-input{
  flex:1 1 auto;
  min-width:0;
  padding:4px 8px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
  color:var(--text);
  font-size:inherit;
  line-height:1.1;
}
.question-bank-inline-description-input{
  width:100%;
  min-height:52px;
  padding:6px 8px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
  color:var(--text);
  font-size:11px;
  line-height:1.3;
  resize:vertical;
}
.question-bank-explorer-inline-btn.is-danger{
  color:var(--danger);
}
.question-bank-explorer-inline-edit{
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease;
}
.question-bank-explorer-inline-delete{
  opacity:0;
  pointer-events:none;
  transition:opacity .14s ease;
}
.question-bank-explorer-row:hover .question-bank-explorer-inline-edit,
.question-strand-header:hover .question-bank-explorer-inline-edit,
.question-bank-explorer-row:hover .question-bank-explorer-inline-delete,
.question-strand-header:hover .question-bank-explorer-inline-delete{
  opacity:1;
  pointer-events:auto;
}
.question-bank-explorer-row:hover .question-bank-explorer-row-description,
.question-strand-header:hover .question-bank-explorer-row-description{
  display:block;
}
.question-strand-block.is-focused .question-bank-explorer-row-description,
.question-bank-explorer-row.is-focused .question-bank-explorer-row-description{
  display:block;
}
.question-strand-block.is-focused,
.question-bank-explorer-row.is-focused{
  background:rgba(255,255,255,.024);
  border-color:rgba(255,255,255,.1);
}
.question-bank-explorer-chevron{
  color:var(--muted);
  font-size:14px;
  line-height:1;
}
.question-overlay-drag-ghost{
  position:fixed;
  z-index:2147483647;
  pointer-events:none;
  max-width:260px;
  min-width:180px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(245,158,11,.55);
  background:rgba(15,18,28,.97);
  color:var(--text);
  box-shadow:0 16px 42px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.05) inset;
  transform:translate3d(0,0,0);
}
.question-overlay-drag-ghost-title{
  font-weight:800;
  line-height:1.2;
}
.question-overlay-drag-ghost-meta{
  margin-top:3px;
  font-size:11px;
  color:var(--muted);
}
.question-pill{
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  font-size:12px;
  color:var(--muted);
}
.question-option-row,
.question-answer-row,
.question-pair-row,
.question-label-row,
.question-group-row,
.question-item-row{
  display:grid;
  gap:8px;
  padding:8px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.015);
}
.question-option-row{grid-template-columns:auto minmax(0,1fr) auto}
.question-answer-row{grid-template-columns:110px minmax(0,1fr) auto}
.question-answer-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
}
.question-answer-column{
  display:grid;
  align-content:start;
  gap:8px;
  padding:8px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.018);
}
.question-answer-column-header{
  font-size:12px;
  font-weight:800;
  color:var(--panel-header-text);
}
.question-answer-column-prompt{
  padding:6px 8px;
  border-radius:8px;
  background:rgba(255,255,255,.05);
  color:var(--text);
  font-size:12px;
  line-height:1.3;
}
.question-answer-cell{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:6px;
  align-items:center;
}
.question-answer-cell .btn{
  min-width:0;
  padding:6px 7px;
}
.question-label-row{grid-template-columns:minmax(0,1fr) 88px 88px auto auto}
.question-pair-row{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;
  gap:6px;
  padding:5px 6px;
}
.question-match-side{
  padding:1px 2px;
  gap:4px;
  border:none;
  background:transparent;
  box-shadow:none;
}
.question-match-side .field{
  gap:2px;
}
.question-match-side .field label{
  font-size:10px;
}
.question-match-side .field input,
.question-match-side .field select{
  padding:5px 7px;
  border-radius:8px;
}
.question-match-source-row{
  gap:5px;
  flex-wrap:nowrap;
}
.question-match-value-input{
  flex:1 1 auto;
  min-width:0;
}
.question-ghost-input{
  opacity:.5;
  background:rgba(255,255,255,.04) !important;
  color:var(--muted) !important;
  border-style:dashed !important;
  cursor:default !important;
}
.question-ghost-input::placeholder{
  color:var(--muted);
}
.question-match-source-row .btn{
  padding:5px 7px;
  white-space:nowrap;
}
.question-mini-audio-player{
  flex:1 1 auto;
  width:100%;
  height:24px;
  min-width:0;
  display:block;
  color-scheme:dark;
  background:transparent;
  border-radius:999px;
}
.question-mini-audio-player::-webkit-media-controls-enclosure{
  background:rgba(255,255,255,.06);
  border-radius:999px;
}
.question-mini-audio-player::-webkit-media-controls-panel{
  background:transparent;
}
.question-mini-video-player{
  flex:1 1 auto;
  width:100%;
  max-width:180px;
  height:56px;
  border-radius:8px;
  background:rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.08);
}
.question-video-viewer-card{
  width:min(820px, 94vw);
}
.question-video-viewer-body{
  display:grid;
  gap:12px;
  align-content:start;
}
.question-video-viewer-note{
  width:100%;
  text-align:left;
  font-size:12px;
  color:var(--muted);
}
.question-video-viewer-player{
  width:100%;
  max-height:72vh;
  border-radius:12px;
  background:#000;
  border:1px solid rgba(255,255,255,.08);
}
.question-video-viewer-controls{
  display:grid;
  gap:8px;
  width:100%;
}
.question-video-viewer-controls .btn.active{
  background:rgba(106,169,255,.22) !important;
  border-color:rgba(106,169,255,.44) !important;
  color:var(--panel-header-text) !important;
  box-shadow:0 0 0 1px rgba(106,169,255,.18) inset;
}
.question-video-viewer-controls .btn.warning{
  background:rgba(255,166,0,.14) !important;
  border-color:rgba(255,166,0,.44) !important;
  color:var(--panel-header-text) !important;
}
.question-video-viewer-note.warning{
  color:#ffcc7a;
}
.question-video-progress-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
}
.question-video-progress-range{
  width:100%;
}
.question-video-timeline{
  position:relative;
  width:100%;
  min-height:34px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  overflow:hidden;
}
.question-video-segment{
  position:absolute;
  top:7px;
  height:18px;
  border-radius:8px;
  background:rgba(106,169,255,.18);
  border:1px solid rgba(106,169,255,.28);
}
.question-video-segment.removed{
  background:rgba(255,90,95,.18);
  border-color:rgba(255,90,95,.32);
  opacity:.75;
}
.question-video-segment-delete{
  position:absolute;
  top:8px;
  transform:translateX(-50%);
  width:18px;
  height:18px;
  padding:0;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(10,14,22,.92);
  color:var(--panel-header-text);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  line-height:1;
  z-index:2;
}
.question-video-break-node{
  position:absolute;
  top:4px;
  bottom:4px;
  width:2px;
  transform:translateX(-50%);
  background:rgba(255,255,255,.72);
  z-index:1;
}
.question-video-question-node{
  position:absolute;
  top:8px;
  width:18px;
  height:18px;
  padding:0;
  transform:translateX(-50%);
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(20,20,30,.96);
  color:var(--panel-header-text);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  font-weight:800;
  line-height:1;
  z-index:3;
}
.question-item-row{grid-template-columns:120px minmax(0,1fr) auto}
.question-group-item-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:start;
}
.question-group-item-source{
  min-width:0;
  display:grid;
  gap:6px;
}
.question-group-item-inline{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:8px;
  align-items:center;
}
.question-group-item-inline-label{
  font-size:11px;
  color:var(--muted);
  white-space:nowrap;
}
.question-group-item-source .question-match-source-row{
  flex-wrap:nowrap;
  gap:5px;
}
.question-group-item-source .question-match-value-input{
  flex:1 1 190px;
  max-width:280px;
}
.question-group-item-source .field input,
.question-group-item-source .field select{
  padding:5px 7px;
}
.question-group-item-source .btn{
  padding:5px 7px;
}
.question-group-item-side{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:6px;
  justify-content:flex-end;
}
.question-group-item-side select{
  min-width:120px;
}
.question-media-preview{
  max-width:180px;
  max-height:120px;
  border-radius:12px;
  border:1px solid var(--line);
  background: rgba(0,0,0,.2);
}
.question-picture-stage{
  position:relative;
  width:100%;
  min-height:280px;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(0,0,0,.18);
  overflow:hidden;
  user-select:none;
}
.question-picture-canvas-image{
  display:block;
  position:relative;
  z-index:0;
  width:100%;
  height:auto;
  min-height:280px;
  object-fit:contain;
  background:rgba(0,0,0,.18);
}
.question-picture-arrow-layer,
.question-picture-target-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.question-picture-arrow-layer{
  z-index:50;
  pointer-events:none;
}
.question-picture-target-layer{
  z-index:60;
}
.question-picture-target-shell{
  position:absolute;
  z-index:1;
  transform:translate(-50%, -50%);
}
.question-picture-target-pill{
  width:100%;
  height:100%;
  min-width:0;
  border:0;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 8px;
  box-shadow:0 6px 18px rgba(0,0,0,.28);
  cursor:default;
}
.question-picture-target-pill.checkbox{
  padding:0 6px;
}
.question-picture-checkbox{
  width:18px;
  height:18px;
  border-radius:4px;
  border:2px solid currentColor;
  background:rgba(255,255,255,.2);
}
.question-picture-target-pill.drag{
  border-radius:18px;
}
.question-picture-target-chrome{
  position:absolute;
  inset:-5px;
  border:1px dashed transparent;
  border-radius:18px;
  pointer-events:none;
}
.question-picture-target-shell:hover .question-picture-target-chrome,
.question-picture-target-shell.is-selected .question-picture-target-chrome{
  border-color:rgba(255,255,255,.52);
}
.question-picture-target-delete,
.question-picture-target-color{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  border:0;
  border-radius:999px;
  display:none;
  align-items:center;
  justify-content:center;
  padding:0;
  font-size:10px;
  line-height:1;
  color:var(--panel-header-text);
  background:rgba(0,0,0,.72);
  pointer-events:auto;
}
.question-picture-target-shell:hover .question-picture-target-delete,
.question-picture-target-shell.is-selected .question-picture-target-delete,
.question-picture-target-shell:hover .question-picture-target-color,
.question-picture-target-shell.is-selected .question-picture-target-color,
.question-picture-target-shell:hover .question-picture-target-resize,
.question-picture-target-shell.is-selected .question-picture-target-resize{
  display:flex;
}
.question-picture-target-delete{ left:-6px; }
.question-picture-target-color{ right:-6px; }
.question-picture-target-resize{
  position:absolute;
  right:-5px;
  bottom:-5px;
  width:14px;
  height:14px;
  display:none;
  border-radius:4px;
  background:#4cd964;
  border:1px solid rgba(255,255,255,.6);
  cursor:nwse-resize;
}
.question-picture-color-popover{
  position:absolute;
  top:-40px;
  right:8px;
  display:flex;
  gap:6px;
  padding:6px 8px;
  border-radius:12px;
  border:1px solid var(--line);
  background:rgba(10,14,22,.95);
  box-shadow:var(--shadow);
}
.question-picture-color-popover input[type="color"]{
  width:26px;
  height:26px;
  padding:0;
  border:0;
  background:transparent;
}
.question-picture-inspector{
  display:grid;
  gap:8px;
  margin-top:10px;
}
.question-gridfiller-size-input{
  width:64px;
  min-width:64px;
  text-align:center;
}
.question-gridfiller-stage{
  width:min(100%, 560px);
  margin:0 auto;
}
.question-gridfiller-grid{
  display:grid;
  gap:8px;
}
.question-gridfiller-cell{
  position:relative;
  min-height:64px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
  overflow:hidden;
  cursor:pointer;
}
.question-gridfiller-cell.ghost{
  border-style:dashed;
  border-color:rgba(255,255,255,.14);
  background:rgba(255,255,255,.015);
}
.question-gridfiller-cell.live{
  border-color:rgba(118,216,120,.55);
  background:rgba(118,216,120,.14);
}
.question-gridfiller-cell.fixed{
  border-color:rgba(106,169,255,.58);
  background:rgba(106,169,255,.14);
}
.question-gridfiller-ghost{
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(255,255,255,.04), rgba(255,255,255,.04)) center/1px 100% no-repeat,
    linear-gradient(90deg, rgba(255,255,255,.04), rgba(255,255,255,.04)) center/100% 1px no-repeat;
  opacity:.45;
}
.question-gridfiller-cell-input{
  position:absolute;
  inset:6px 10px 12px 6px;
  width:calc(100% - 16px);
  height:calc(100% - 18px);
  border:0;
  outline:none;
  background:transparent;
  color:var(--text);
  text-align:center;
  padding:0;
  font-weight:700;
}
.question-gridfiller-cell-corner{
  position:absolute;
  left:5px;
  bottom:4px;
  font-size:10px;
  font-weight:800;
  color:rgba(255,255,255,.78);
  pointer-events:none;
}
.question-venn-stage{
  position:relative;
  width:min(100%, 520px);
  min-height:180px;
  aspect-ratio: 25 / 16;
  margin:0 auto;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  overflow:hidden;
}
.question-venn-stage.preview{
  width:min(100%, 620px);
  min-height:220px;
}
.question-venn-svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.question-venn-svg circle{
  fill:rgba(255,255,255,.04);
  stroke:rgba(255,255,255,.22);
  stroke-width:1.4;
}
.question-venn-zone-pill,
.question-preview-venn-zone{
  position:absolute;
  transform:translate(-50%,-50%);
  min-width:88px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.09);
  color:var(--text);
  text-align:center;
}
.question-venn-zone-pill.left,
.question-preview-venn-zone.left{ left:27%; top:50%; }
.question-venn-zone-pill.center,
.question-preview-venn-zone.center{ left:50%; top:50%; }
.question-venn-zone-pill.right,
.question-preview-venn-zone.right{ left:73%; top:50%; }
.question-venn-zone-title-row{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px;
  margin-top:10px;
}
.question-venn-item-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:8px;
  padding:8px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
}
.question-preview-modal{
  position:fixed;
  inset:0;
  z-index:1650;
  background:rgba(0,0,0,.62);
  display:flex;
  align-items:center;
  justify-content:center;
}
.question-preview-card{
  width:min(980px,94vw);
  max-height:min(86vh,920px);
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:16px;
  border-radius:18px;
  background:#111;
  border:1px solid rgba(255,255,255,.08);
}
.question-preview-card.resource{
  width:min(980px,94vw);
}
.question-preview-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.question-preview-title{
  font-size:20px;
  font-weight:800;
  color:var(--panel-header-text);
}
.question-preview-subtitle{
  font-size:12px;
  color:var(--muted);
}
.question-preview-body{
  overflow:auto;
}
.question-preview-body.resource{
  display:grid;
  place-items:center;
  padding:6px 0 0;
}
.question-preview-resource-image{
  max-width:min(90vw, 900px);
  max-height:76vh;
  border-radius:12px;
  display:block;
}
.question-preview-resource-video{
  width:min(90vw, 900px);
  max-height:76vh;
  border-radius:12px;
  display:block;
  background:#000;
}
.question-preview-shell{
  display:grid;
  gap:14px;
}
.question-preview-prompt{
  font-size:15px;
  line-height:1.45;
  color:var(--text);
}
.question-preview-choice-list,
.question-preview-bank,
.question-preview-group-items,
.question-preview-venn-drawer-items{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.question-preview-choice{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:var(--text);
  border-radius:999px;
  padding:14px 18px;
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.question-preview-choice.selected,
.question-preview-bank-item.selected,
.question-preview-venn-zone.active{
  border-color:rgba(106,169,255,.55);
  background:rgba(106,169,255,.12);
}
.question-preview-delimited{
  display:grid;
  gap:12px;
}
.question-preview-inline-prompt{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.question-preview-blank{
  min-width:110px;
  min-height:48px;
  border-radius:12px;
  border:1px dashed rgba(255,255,255,.24);
  background:rgba(255,255,255,.04);
  color:var(--text);
  padding:12px 16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  position:relative;
  z-index:2;
}
.question-preview-bank-item{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:var(--text);
  border-radius:14px;
  padding:12px 14px;
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:grab;
}
.question-preview-bank-item.dragging{ cursor:grabbing; opacity:.7; }
.question-preview-bank-item-body{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:76px;
}
.question-preview-image{
  max-width:156px;
  max-height:112px;
  border-radius:8px;
  display:block;
}
.question-preview-audio{
  width:134px;
  max-width:100%;
  height:24px;
}
.question-preview-video{
  width:216px;
  max-width:100%;
  max-height:132px;
  border-radius:8px;
  display:block;
  background:#000;
}
.question-preview-matching{
  display:grid;
  gap:8px;
}
.question-preview-matching-stage{
  position:relative;
  display:block;
}
.question-preview-matching-lines{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:0;
}
.question-preview-matching-rows{
  position:relative;
  z-index:1;
  display:grid;
  gap:6px;
}
.question-preview-matching-row{
  display:grid;
  grid-template-columns:minmax(0, calc(50% - 42px)) minmax(0, calc(50% - 42px));
  gap:84px;
  align-items:center;
}
.question-preview-matching-col{
  display:grid;
  gap:6px;
  position:relative;
  z-index:1;
  min-width:0;
}
.question-preview-match-node{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  text-align:left;
  justify-self:start;
  gap:10px;
  padding:10px 8px;
  border-radius:14px;
  color:var(--text);
  min-height:46px;
  max-width:100%;
  min-width:0;
  cursor:pointer;
  transition:opacity .14s ease;
}
.question-preview-match-node.left{
  justify-self:end;
}
.question-preview-match-node.right{
  justify-self:start;
}
.question-preview-match-node.selected .question-preview-match-connector{
  box-shadow:0 0 0 2px rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.34);
}
.question-preview-match-node.connected .question-preview-match-connector{
  border-color:rgba(255,255,255,.28);
}
.question-preview-match-side{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  border-radius:8px;
  background:rgba(255,255,255,.04);
  padding:8px 10px;
  width:auto;
  max-width:100%;
}
.question-preview-match-media-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  max-width:100%;
  min-width:0;
}
.question-preview-match-connector{
  width:24px;
  height:24px;
  min-width:24px;
  border-radius:999px;
  border:3px solid rgba(255,255,255,.56);
  background:rgba(255,255,255,.08);
  padding:0;
  cursor:crosshair;
  position:relative;
  z-index:2;
}
.question-preview-match-connector:hover{
  border-color:rgba(255,255,255,.82);
  background:rgba(255,255,255,.16);
}
.question-preview-match-zoom{
  min-width:24px;
  height:24px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.05);
  color:var(--text);
  padding:0;
  font-size:14px;
  font-family:inherit;
  line-height:1;
}
.question-preview-match-zoom:hover{
  background:rgba(255,255,255,.09);
}
.question-preview-matching-line{
  fill:none;
  stroke:var(--minor1, rgba(255,255,255,.78));
  stroke-width:3;
  stroke-linecap:round;
}
.question-preview-matching-line.active{
  stroke-dasharray:9 7;
  opacity:.9;
}
.question-picture-stage.preview{
  width:min(100%, calc(72vh * var(--picture-ratio, 1.6)));
  max-width:100%;
  min-height:0;
  aspect-ratio:var(--picture-aspect, 16 / 10);
  margin:0 auto;
}
.question-picture-stage.preview .question-picture-canvas-image{
  width:100%;
  height:100%;
  min-height:0;
  max-width:none;
  max-height:none;
  object-fit:contain;
}
.question-picture-preview-pill,
.question-picture-preview-drop{
  position:absolute;
  transform:translate(-50%,-50%);
}
.question-picture-preview-pill .question-picture-target-pill,
.question-picture-preview-drop{
  font-size:clamp(10px, 1.15vmin, 16px);
  line-height:1.1;
}
.question-picture-preview-pill .question-picture-checkbox{
  width:min(52%, 18px);
  height:min(52%, 18px);
  min-width:10px;
  min-height:10px;
  border-width:clamp(1px, .22vmin, 2px);
}
.question-picture-preview-drop{
  border:1px dashed rgba(255,255,255,.28);
  border-radius:18px;
  padding:clamp(3px, .7vmin, 8px) clamp(5px, 1vmin, 12px);
  min-width:0;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--text);
}
.question-preview-grouping{
  display:grid;
  gap:12px;
}
.question-preview-group-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
}
.question-preview-group-zone,
.question-preview-venn-drawer{
  display:grid;
  gap:8px;
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}
.question-preview-group-title,
.question-preview-venn-drawer-title{
  font-weight:700;
  color:var(--panel-header-text);
}
.question-preview-placed-item{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  cursor:pointer;
}
.question-preview-venn{
  display:grid;
  gap:12px;
}
.question-preview-venn-zone{
  display:grid;
  gap:4px;
  min-width:108px;
  align-content:start;
}
.question-preview-venn-zone-title{
  font-weight:700;
}
.question-preview-venn-zone-count{
  font-size:11px;
  color:var(--muted);
}
.question-preview-venn-zone-items{
  display:flex;
  flex-direction:column;
  gap:4px;
  justify-content:flex-start;
  align-items:center;
  min-height:42px;
}
.question-preview-venn-zone-item{
  max-width:100%;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.08);
  color:var(--text);
  font-size:11px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.question-preview-venn-zone-item.empty{
  opacity:.72;
  font-style:italic;
}
.question-preview-gridfiller{
  display:grid;
  gap:12px;
}
.question-preview-gridfiller-grid{
  display:grid;
  gap:8px;
  width:min(100%, 560px);
}
.question-preview-gridfiller-cell{
  min-height:58px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
  color:var(--text);
  padding:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.question-preview-gridfiller-cell.ghost{
  visibility:hidden;
  pointer-events:none;
}
.question-preview-gridfiller-cell.fixed{
  background:rgba(106,169,255,.14);
  border-color:rgba(106,169,255,.46);
  font-weight:700;
}
.question-preview-gridfiller-cell.live{
  border-style:dashed;
  border-color:rgba(255,255,255,.26);
}
.question-preview-gridfiller-cell.input{
  width:100%;
  background:rgba(255,255,255,.03);
  border-style:dashed;
  border-color:rgba(255,255,255,.26);
}
.question-order-stage{
  position:relative;
  min-height:190px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 16% 18%, rgba(135,205,255,.08), transparent 26%),
    rgba(255,255,255,.03);
  overflow:hidden;
}
.question-order-stage.preview{
  min-height:210px;
}
.question-order-arrow-layer{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.question-order-slot-layer{
  position:absolute;
  inset:0;
}
.question-order-editor-shell,
.question-preview-order-slot{
  position:absolute;
  transform:translate(-50%,-50%);
}
.question-order-editor-shell{
  z-index:2;
}
.question-order-editor-pill,
.question-preview-order-slot{
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 10px;
  text-align:center;
}
.question-order-editor-pill{
  width:100%;
  height:100%;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.08);
  color:var(--text);
  font-size:11px;
  outline:none;
  padding:0 7px;
}
.question-preview-order{
  display:grid;
  gap:12px;
}
.question-preview-order-slot{
  border:1px dashed rgba(255,255,255,.28);
  background:rgba(10,14,22,.58);
  box-shadow:0 10px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.06);
  color:var(--text);
  min-width:72px;
  min-height:42px;
  padding:8px 12px;
  line-height:1.15;
  overflow-wrap:anywhere;
  white-space:normal;
}
.question-order-pill-add,
.question-order-pill-delete{
  position:absolute;
  z-index:3;
  width:15px;
  height:15px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(10,14,22,.92);
  color:var(--panel-header-text);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  font-size:10px;
  line-height:1;
}
.question-order-pill-delete{
  left:2px;
  top:50%;
  transform:translateY(-50%);
}
.question-order-pill-delete.right{
  left:auto;
  right:2px;
}
.question-order-pill-add.right{
  right:-7px;
  top:50%;
  transform:translateY(-50%);
}
.question-order-pill-add.left{
  left:-7px;
  top:50%;
  transform:translateY(-50%);
}
.question-order-pill-add.down{
  left:50%;
  bottom:-7px;
  transform:translateX(-50%);
}
.question-mode-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.question-mode-row-inline{
  flex:0 1 auto;
  align-items:flex-end;
  justify-content:flex-start;
  flex-wrap:nowrap;
}
.question-scoring-row{
  display:grid;
  grid-template-columns:auto auto;
  align-items:end;
  justify-content:flex-start;
  gap:8px;
}
.question-points-inline{
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.question-points-inline-label{
  font-size:11px;
  color:var(--muted);
}
.question-points-inline-input{
  width:64px;
  min-width:64px;
  padding:6px 8px !important;
  text-align:center;
}
.question-mode-row-inline .btn{
  padding:6px 8px !important;
  font-size:11px;
  white-space:nowrap;
}
.question-mode-btn.active{
  border-color: rgba(106,169,255,.55);
  background: rgba(106,169,255,.12);
}
.question-tag-selector{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.question-tag-option{
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  color:var(--muted);
  padding:5px 8px;
  border-radius:999px;
  cursor:pointer;
  font-size:11px;
  line-height:1.2;
}
.question-tag-option.active{
  border-color: rgba(106,169,255,.5);
  background: rgba(106,169,255,.12);
  color:var(--text);
}
.question-rule-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:6px;
}
.question-rule-grid .question-inline-row{
  gap:6px;
  font-size:12px;
}
.question-small-note{
  font-size:12px;
  color:var(--muted);
}
#tab-question-bank .field{
  gap:4px;
}
#tab-question-bank .field label{
  font-size:11px;
}
#tab-question-bank .field input,
#tab-question-bank .field select,
#tab-question-bank .field textarea{
  padding:8px 9px;
  border-radius:10px;
}
#tab-question-bank .field textarea{
  min-height:74px;
}
#tab-question-bank .btn{
  padding:7px 9px;
  border-radius:10px;
}

.grade-slot-assignment-count{
  position:relative;
  display:inline-block;
  margin-top:6px;
  padding:0;
  border:none;
  background:transparent;
  color:rgba(255,255,255,.68);
  font-size:11px;
  line-height:1.1;
  white-space:nowrap;
  z-index:1;
  cursor:default;
}
.grade-slot-assignment-count > span,
.grade-slot-assignment-count{
  text-decoration:underline;
  text-decoration-style:dotted;
  text-underline-offset:2px;
}
.grade-slot-assignment-count::after{
  content:"";
  position:absolute;
  left:-24px;
  right:-24px;
  top:100%;
  height:28px;
  pointer-events:none;
}
.grade-slot-assignment-popover{
  position:absolute;
  top:calc(100% + 2px);
  left:auto;
  right:-12px;
  display:none;
  min-width:240px;
  max-width:320px;
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:#111;
  box-shadow:0 18px 40px rgba(0,0,0,.38);
  z-index:2147483000;
  pointer-events:auto;
}
.grade-slot-assignment-popover::before{
  content:"";
  position:absolute;
  inset:-18px -18px -18px -18px;
  pointer-events:none;
}
.grade-slot-assignment-count:hover .grade-slot-assignment-popover,
.grade-slot-assignment-count:focus-within .grade-slot-assignment-popover{
  display:block;
}
.grade-slot-assignment-popover-title{
  margin-bottom:8px;
  color:rgba(255,255,255,.72);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.grade-slot-assignment-popover-list{
  display:grid;
  gap:6px;
}
.grade-slot-assignment-link{
  display:flex;
  align-items:flex-start;
  gap:8px;
  width:100%;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
  background:rgba(255,255,255,.04);
  color:rgba(255,255,255,.92);
  text-align:left;
  cursor:pointer;
}
.grade-slot-assignment-link:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.18);
}
.grade-slot-assignment-link-index{
  color:rgba(255,255,255,.52);
  flex:0 0 auto;
}
.grade-slot-assignment-link-name{
  min-width:0;
  overflow-wrap:anywhere;
}

.node-results-panel{
  display:grid;
  gap:12px;
}
.node-results-muted{
  color:rgba(255,255,255,.68);
  font-size:13px;
}
.node-results-card{
  display:grid;
  gap:8px;
  padding:12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(255,255,255,.045);
}
.node-results-card-title{
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.node-results-card-main{
  color:white;
  font-weight:800;
}
.node-results-toggle{
  display:flex;
  gap:8px;
  align-items:center;
}
.node-results-toggle-active{
  border-color:rgba(245,158,11,.45)!important;
  background:rgba(245,158,11,.18)!important;
  color:white!important;
}
.node-results-score-row{
  display:flex;
  align-items:center;
  gap:8px;
}
.node-results-retry-btn{
  width:26px;
  height:26px;
  font-size:15px;
  flex:0 0 auto;
}
.node-results-submitted-wrap{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.node-results-late-note{
  color:#ffcf9d;
  font-size:12px;
  white-space:nowrap;
}
.node-results-excuse-btn{
  padding:4px 8px;
  min-height:24px;
  font-size:12px;
}
.node-results-excuse-btn.active{
  border-color:rgba(126,211,134,.65)!important;
  background:rgba(126,211,134,.18)!important;
  color:#dcffdf!important;
}
.node-results-table-wrap{
  max-height:320px;
  overflow:auto;
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
}
.node-results-table{
  width:100%;
  border-collapse:collapse;
}
.node-results-table th,
.node-results-table td{
  padding:10px;
  border-bottom:1px solid rgba(255,255,255,.08);
  color:white;
  text-align:left;
  vertical-align:top;
}
.node-results-table th{
  position:sticky;
  top:0;
  z-index:1;
  background:#1b2723;
  border-bottom-color:rgba(255,255,255,.14);
}
.node-results-tag-list{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.node-results-tag-chip{
  display:inline-flex;
  align-items:center;
  gap:7px;
  max-width:100%;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.86);
  font-size:12px;
  line-height:1.2;
}
.node-results-tag-chip span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.node-results-tag-chip b{
  flex:0 0 auto;
  color:#facc7a;
  font-weight:800;
}
.node-additional-requirements{
  display:grid;
  gap:8px;
  min-height:0;
}
.node-additional-requirements-intro,
.node-additional-requirements-note,
.node-additional-requirements-empty{
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}
.node-additional-requirements-note{
  color:var(--minor2, var(--muted));
}
.node-due-policy-card{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(255,255,255,.045);
}
.node-due-policy-title{
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.node-due-policy-grid{
  display:grid;
  grid-template-columns:minmax(180px,260px) minmax(130px,180px);
  gap:10px;
  align-items:end;
}
.node-due-policy-field{
  display:grid;
  gap:5px;
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:700;
}
.node-due-policy-field input{
  width:100%;
  box-sizing:border-box;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.22);
  color:white;
  padding:8px 10px;
}
.node-due-date-row{
  display:flex;
  gap:8px;
  align-items:center;
}
.node-due-today-btn{
  min-height:34px;
  padding:6px 10px;
  flex:0 0 auto;
  font-size:12px;
}
.node-additional-requirements-empty{
  padding:10px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  background:rgba(255,255,255,.035);
}
.node-additional-requirements-table{
  display:grid;
  grid-template-columns:minmax(180px,1fr) auto 70px;
  align-items:center;
  gap:4px 8px;
  max-height:min(58vh, 520px);
  overflow:auto;
  padding:8px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(255,255,255,.035);
}
.node-additional-requirements-head{
  position:sticky;
  top:-8px;
  z-index:1;
  padding:4px 2px 7px;
  background:#111;
  color:var(--panel-header-text);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.node-additional-requirements-tag{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text);
  font-size:12px;
}
.node-additional-requirements-comparators{
  display:inline-flex;
  gap:2px;
  padding:2px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  background:rgba(0,0,0,.18);
}
.node-additional-requirement-symbol{
  width:22px;
  height:22px;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
}
.node-additional-requirement-symbol:hover{
  color:var(--text);
  background:rgba(255,255,255,.08);
}
.node-additional-requirement-symbol.active{
  color:#111;
  background:#facc7a;
}
.node-additional-requirements-threshold{
  width:62px;
  min-width:0;
  padding:5px 6px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(0,0,0,.24);
  color:var(--text);
  font-size:12px;
}

@media (max-width: 980px){
  .question-bank-meta{grid-template-columns:1fr}
  .question-filing-inputs,
  .question-filing-row{grid-template-columns:1fr}
  .question-scoring-row{
    grid-template-columns:1fr;
    align-items:stretch;
  }
  .question-mode-row-inline{
    flex-wrap:wrap;
  }
  .question-option-row,
  .question-answer-row,
  .question-label-row,
  .question-pair-row,
  .question-item-row{grid-template-columns:1fr}
}

/* Responsive guardrails: keep dense creator UI from colliding on smaller screens. */
:root{
  --fluid-panel-pad:clamp(8px, 1.1vw, 14px);
  --fluid-card-pad:clamp(8px, 1vw, 12px);
  --fluid-gap:clamp(6px, .85vw, 12px);
  --fluid-control-font:clamp(11px, .82vw, 13px);
}

button,
input,
select,
textarea{
  max-width:100%;
}

.brand,
.tabs,
.topbar-actions,
.panel-header,
.quest-toolbar,
.share-block-control,
.assignment-bank-toolbar,
.assignment-editor-header,
.assignment-worksheet-item-head,
.assignment-video-node-head,
.question-editor-header,
.question-tag-modal-header,
.question-preview-header,
.student-quest-header,
.student-video-assignment-frame-header,
.student-video-assignment-prompt-actions,
.node-results-toggle{
  min-width:0;
}

.btn,
.tab,
.input,
.field input,
.field select,
.field textarea,
.select select{
  font-size:var(--fluid-control-font);
}

.input{
  width:min(320px, 100%);
  min-width:0;
}

.field,
.field input,
.field select,
.field textarea,
.select,
.select select,
.brand-text,
.class-selector-topbar > div,
.assignment-bank-title,
.assignment-editor-header .card-title,
.assignment-worksheet-item-title,
.assignment-video-node-meta,
.question-editor-title,
.question-tag-modal-title,
.question-preview-title,
.student-quest-title{
  min-width:0;
}

.brand-title,
.brand-sub,
.assignment-bank-title,
.assignment-worksheet-item-title,
.assignment-video-node-meta,
.question-editor-title,
.question-tag-modal-title,
.question-preview-title,
.student-quest-title,
.student-grade-name,
.student-grade-meta{
  overflow-wrap:anywhere;
}

.layout,
.two-col,
.assets,
.students-manage-layout,
.class-selector-content,
.question-editor-card,
.question-preview-card,
.question-tag-modal-card,
.share-settings-card{
  padding:var(--fluid-panel-pad);
}

.panel-header,
.card,
.assignment-editor-card,
.question-editor-card,
.question-preview-card,
.question-tag-modal-card,
.share-settings-card{
  gap:var(--fluid-gap);
}

.card{
  margin:var(--fluid-card-pad);
  padding:var(--fluid-card-pad);
}

.topbar{
  gap:var(--fluid-gap);
}

.tabs,
.topbar-actions{
  flex-wrap:wrap;
}

.tabs{
  row-gap:6px;
}

.tab,
.btn{
  white-space:nowrap;
}

.brand-color-pickers{
  max-width:100%;
}

.panel-header{
  flex-wrap:wrap;
}

.panel-header-quest{
  flex-wrap:wrap;
}

.quest-toolbar{
  flex-wrap:wrap;
  row-gap:6px;
}

.quest-toolbar .divider{
  display:none;
}

.quest-toolbar .select{
  min-width:0;
}

.share-block-inline,
.share-block-control{
  max-width:100%;
}

.share-block-dropdown summary{
  min-width:0;
  max-width:220px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.question-video-progress-wrap,
.assignment-video-rewind-row,
.question-match-source-row,
.question-group-item-source .question-match-source-row{
  min-width:0;
}

.question-video-progress-range{
  min-width:90px;
}

@media (max-width: 1320px){
  .topbar-teacher{
    flex-wrap:wrap;
  }

  .teacher-brand-stack{
    flex:1 1 240px;
  }

  .brand-color-pickers{
    flex-wrap:wrap;
  }

  .topbar-teacher .tabs,
  .topbar-teacher .topbar-actions{
    flex:1 1 auto;
  }

  #tab-assignments .two-col{
    grid-template-columns:minmax(330px, 410px) minmax(0, 1fr) !important;
  }

  #tab-question-bank .two-col,
  #tab-question-bank .two-col.question-bank-wide{
    grid-template-columns:minmax(280px, 380px) minmax(0, 1fr) !important;
  }
}

@media (max-width: 1120px){
  .two-col,
  #tab-assignments .two-col,
  #tab-question-bank .two-col,
  #tab-question-bank .two-col.question-bank-wide,
  .assets{
    grid-template-columns:1fr !important;
  }

  #tab-assignments .two-col{
    align-items:stretch !important;
  }

  .assignment-left-stack,
  #tab-assignments .assignment-left-stack{
    max-height:none;
  }

  .asset-preview .preview-box{
    min-height:220px;
  }

  .students-manage-layout{
    grid-template-columns:minmax(260px, .9fr) minmax(0, 1.1fr);
  }

  .student-mastery-summary{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px){
  .topbar{
    align-items:flex-start;
  }

  .brand{
    flex-wrap:wrap;
  }

  .teacher-brand-stack,
  .tabs,
  .topbar-actions,
  .class-selector-topbar,
  .student-quest-header,
  .student-video-assignment-frame-header,
  .student-mastery-hero{
    width:100%;
  }

  .class-selector-topbar{
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .class-selector-list{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .students-manage-layout,
  .student-avatar-stats{
    grid-template-columns:1fr;
  }

  .question-bank-meta,
  .question-filing-inputs,
  .question-filing-row,
  .question-scoring-row,
  .question-option-row,
  .question-answer-row,
  .question-label-row,
  .question-pair-row,
  .question-item-row,
  .question-group-item-layout,
  .question-group-item-inline,
  .question-venn-zone-title-row{
    grid-template-columns:1fr !important;
  }

  .question-group-item-side,
  .assignment-worksheet-item-actions,
  .assignment-video-node-actions{
    justify-content:flex-start;
    flex-wrap:wrap;
  }

  .question-match-source-row,
  .question-group-item-source .question-match-source-row,
  .question-video-progress-wrap,
  .assignment-video-rewind-row{
    flex-wrap:wrap;
  }

  .question-match-value-input,
  .question-group-item-source .question-match-value-input{
    flex-basis:100%;
    max-width:none;
  }

  .node-asset-picker-trigger,
  .node-asset-picker-option{
    grid-template-columns:72px minmax(0, 1fr) auto;
  }

  .node-asset-picker-option{
    grid-template-columns:72px minmax(0, 1fr);
  }

  .node-asset-picker-strip{
    width:72px;
  }

  .question-editor-card,
  .question-preview-card,
  .question-tag-modal-card{
    width:calc(100vw - 18px);
    max-height:calc(100vh - 18px);
    border-radius:14px;
  }
}

@media (max-width: 720px){
  .topbar{
    padding:10px;
  }

  .logo{
    width:34px;
    height:34px;
    border-radius:10px;
  }

  .brand-title{
    font-size:15px;
  }

  .brand-sub{
    font-size:11px;
  }

  .tabs,
  .topbar-actions,
  .launch-actions,
  .class-selector-top-actions,
  .assignment-bank-switcher,
  .question-bank-actions,
  .node-results-toggle{
    gap:6px;
  }

  .tab,
  .btn{
    padding:7px 8px;
    border-radius:10px;
  }

  .class-selector-list{
    grid-template-columns:1fr;
  }

  .class-selector-content,
  .class-selector-topbar,
  .layout,
  .two-col,
  .assets,
  .students-manage-layout{
    padding:10px;
  }

  .panel-header{
    padding:9px 10px;
  }

  .assignment-bank-toolbar,
  .assignment-editor-header,
  .question-tag-dropbox-header,
  .question-editor-header,
  .question-tag-modal-header,
  .question-preview-header,
  .student-grade-item,
  .student-mastery-row-head{
    align-items:stretch;
    flex-direction:column;
  }

  .assignment-bank-toolbar .input,
  .assignment-bank-toolbar .btn,
  .assignment-editor-header .btn,
  .question-tag-dropbox-header .btn,
  .student-grade-side{
    width:100%;
  }

  .student-grade-item{
    gap:8px;
  }

  .student-grade-score,
  .student-grade-score.pending-qualification{
    min-width:0;
    text-align:left;
  }

  .question-preview-resource-image,
  .question-preview-resource-video{
    max-width:100%;
  }

  .grade-slot-assignment-popover,
  .question-tag-dropbox-detail{
    max-width:min(88vw, 360px);
    min-width:min(280px, 88vw);
  }
}

@media (max-width: 520px){
  .tabs,
  .topbar-actions,
  .quest-toolbar,
  .brand-color-pickers{
    width:100%;
  }

  .tabs .tab,
  .topbar-actions .btn{
    flex:1 1 auto;
    text-align:center;
  }

  .quest-toolbar .btn,
  .quest-toolbar .select,
  .share-block-inline,
  .share-block-control,
  .share-block-dropdown,
  .share-block-dropdown summary{
    width:100%;
  }

  .quest-toolbar .select{
    justify-content:space-between;
  }

  .quest-toolbar .select select,
  .share-block-dropdown summary{
    flex:1 1 auto;
  }

  .node-asset-picker-trigger,
  .node-asset-picker-option{
    grid-template-columns:1fr;
  }

  .node-asset-picker-strip{
    width:100%;
  }

  .student-mastery-summary{
    grid-template-columns:1fr;
  }
}

@media (max-height: 760px){
  .topbar{
    padding-top:8px;
    padding-bottom:8px;
  }

  .panel-header{
    padding-top:8px;
    padding-bottom:8px;
  }

  .question-editor-card,
  .question-preview-card,
  .question-tag-modal-card,
  .share-settings-card{
    max-height:calc(100vh - 16px);
  }
}

/* Measured Quest toolbar fitting. JS sets --quest-toolbar-fit-scale from real available width. */
.panel-header-quest.quest-fit-measured{
  --quest-toolbar-fit-scale:1;
  flex-wrap:nowrap !important;
  overflow:visible !important;
}

.panel-header-quest.quest-fit-measured .panel-title{
  display:block !important;
  font-size:inherit;
  flex:0 0 auto;
}

.panel-header-quest.quest-fit-measured.quest-fit-hide-title .panel-title{
  display:none !important;
}

.panel-header-quest.quest-fit-measured .quest-toolbar{
  flex:0 0 auto;
  flex-wrap:nowrap !important;
  width:max-content;
  max-width:none;
  overflow:visible !important;
  gap:6px;
  transform:scale(var(--quest-toolbar-fit-scale));
  transform-origin:left center;
  will-change:transform;
}

.panel-header-quest.quest-fit-measured .quest-toolbar > *,
.panel-header-quest.quest-fit-measured .quest-toolbar .btn,
.panel-header-quest.quest-fit-measured .quest-toolbar .select,
.panel-header-quest.quest-fit-measured .share-block-inline,
.panel-header-quest.quest-fit-measured .share-block-control,
.panel-header-quest.quest-fit-measured .share-block-dropdown,
.panel-header-quest.quest-fit-measured .share-block-dropdown summary{
  width:auto !important;
  flex:0 0 auto !important;
  min-width:0;
}

.panel-header-quest.quest-fit-measured .quest-toolbar .divider{
  display:inline-block !important;
}

.panel-header-quest.quest-fit-measured .quest-toolbar .select span,
.panel-header-quest.quest-fit-measured .share-block-label{
  display:inline !important;
  font-size:11px !important;
}

.panel-header-quest.quest-fit-measured .quest-toolbar .btn,
.panel-header-quest.quest-fit-measured .share-settings-btn{
  padding:5px 8px !important;
  font-size:12px !important;
  border-radius:10px;
}

.panel-header-quest.quest-fit-measured #btnRenameMap,
.panel-header-quest.quest-fit-measured #btnAddMap,
.panel-header-quest.quest-fit-measured #btnClearBg,
.panel-header-quest.quest-fit-measured #btnAddNode,
.panel-header-quest.quest-fit-measured #btnStudentFov,
.panel-header-quest.quest-fit-measured #btnFit,
.panel-header-quest.quest-fit-measured #btnMovePath{
  font-size:12px !important;
}

.panel-header-quest.quest-fit-measured #btnRenameMap::after,
.panel-header-quest.quest-fit-measured #btnAddMap::after,
.panel-header-quest.quest-fit-measured #btnClearBg::after,
.panel-header-quest.quest-fit-measured #btnAddNode::after,
.panel-header-quest.quest-fit-measured #btnStudentFov::after,
.panel-header-quest.quest-fit-measured #btnFit::after,
.panel-header-quest.quest-fit-measured #btnMovePath::after,
.panel-header-quest.quest-fit-measured .share-settings-btn::after{
  content:none !important;
}

.panel-header-quest.quest-fit-measured .quest-toolbar .select{
  gap:5px;
  white-space:nowrap;
}

.panel-header-quest.quest-fit-measured .quest-toolbar .select select,
.panel-header-quest.quest-fit-measured .share-block-dropdown summary{
  width:auto;
  min-width:0;
  max-width:150px;
  padding:5px 8px;
  font-size:12px;
  border-radius:10px;
}

.panel-header-quest.quest-fit-measured .share-block-dropdown summary{
  max-width:130px;
}

.panel-header-quest.quest-fit-measured .quest-toolbar input[type="range"]{
  width:60px !important;
}

.panel-header-quest.quest-fit-measured .share-block-control{
  flex-wrap:nowrap !important;
  gap:6px;
  padding:7px 8px;
  border-radius:12px;
}
.panel-header-quest.quest-fit-measured .share-block-control.is-compact{
  gap:4px;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}

.class-tag-report-panel{
  padding:16px;
}

.tag-report-card,
.student-tag-report-card{
  display:grid;
  gap:14px;
}

.tag-report-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.tag-report-default-need,
.tag-report-mini-label{
  display:grid;
  gap:4px;
  color:var(--panel-header-text-2, var(--muted));
  font-size:12px;
}

.tag-report-default-need input,
.tag-report-mini-label input,
.tag-report-mini-label select{
  min-width:0;
  border:1px solid var(--line);
  border-radius:10px;
  padding:7px 9px;
  background:rgba(255,255,255,.06);
  color:var(--text);
}

.tag-report-default-need input{
  width:90px;
}

.tag-report-reshuffle-btn{
  align-self:end;
  padding:7px 10px;
  font-size:12px;
}

.tag-report-mini-label input{
  width:74px;
}

.tag-report-mini-label select{
  width:140px;
}

.tag-report-mini-label select.manual-badge-selected{
  border-color:rgba(76, 211, 142, .75);
  box-shadow:0 0 0 2px rgba(76, 211, 142, .18);
  color:var(--panel-header-text);
}

.tag-report-table{
  display:grid;
  gap:9px;
}

.tag-report-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(255,255,255,.045);
}

.tag-report-row.inactive{
  opacity:.5;
  filter:grayscale(.75);
}

.tag-report-row.earned{
  border-color:rgba(76, 211, 142, .45);
  box-shadow:0 0 0 1px rgba(76, 211, 142, .18) inset;
}

.tag-report-main{
  display:grid;
  gap:7px;
  min-width:0;
}

.tag-report-name{
  color:var(--panel-header-text);
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.tag-report-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:9px;
  color:var(--panel-header-text-2, var(--muted));
  font-size:12px;
}

.tag-report-percent{
  color:var(--minor-font-1, var(--accent));
  font-weight:800;
}

.tag-report-count{
  color:var(--minor-font-2, var(--muted));
}

.tag-report-gauge{
  height:12px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.1);
}

.tag-report-gauge-fill{
  height:100%;
  border-radius:inherit;
  background:#8b95a7;
  transition:width .18s ease;
}

.tag-report-gauge.red .tag-report-gauge-fill{
  background:linear-gradient(90deg, #bd3f38, #ff756b);
}

.tag-report-gauge.yellow .tag-report-gauge-fill{
  background:linear-gradient(90deg, #b8861f, #ffd166);
}

.tag-report-gauge.green .tag-report-gauge-fill{
  background:linear-gradient(90deg, #2c9f65, #63e6a3);
}

.tag-report-badge-cell{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:9px;
  min-width:210px;
}

.tag-report-badge-thumb{
  width:44px;
  height:44px;
  display:block;
  overflow:visible;
}

.asset-badge-thumb-svg{
  width:100%;
  height:100%;
  display:block;
  overflow:visible;
}

.badge-frame-outer{
  fill:none;
  stroke:rgba(255,255,255,.92);
  stroke-width:4;
  stroke-linejoin:round;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.5));
}

.badge-frame-inner{
  fill:none;
  stroke:rgba(5,8,14,.9);
  stroke-width:2.2;
  stroke-linejoin:round;
}

.badge-frame-bg{
  stroke:none;
}

.tag-report-badge-empty,
.tag-report-earned-label{
  color:var(--panel-header-text-2, var(--muted));
  font-size:12px;
}

.student-tag-report-btn{
  padding:6px 9px;
  font-size:12px;
}

.student-tag-report-overlay{
  position:relative;
  min-height:100%;
}

.student-tag-report-card{
  position:absolute;
  inset:0;
  overflow:auto;
  padding:14px;
  border-radius:18px;
  background:rgba(10,12,18,.96);
  border:1px solid rgba(255,255,255,.12);
}

.student-earned-badges{
  margin-top:14px;
  padding:14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.04);
}

#student-tab-avatar .student-earned-badges{
  margin-top:0;
}

.student-earned-badges-title{
  margin-bottom:10px;
  color:var(--panel-header-text);
  font-weight:800;
}

.student-earned-badge-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(110px, 1fr));
  gap:10px;
}

.student-earned-badge{
  display:grid;
  justify-items:center;
  gap:7px;
  padding:10px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  color:var(--panel-header-text-2, var(--muted));
  text-align:center;
  font-size:12px;
  background:rgba(255,255,255,.035);
}

.tag-badge-modal{
  position:fixed;
  inset:0;
  z-index:1500;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(0,0,0,.58);
}

.tag-badge-modal-card{
  width:min(920px, 96vw);
  max-height:86vh;
  overflow:auto;
  display:grid;
  gap:14px;
  padding:18px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.14);
  background:#111722;
  box-shadow:0 24px 60px rgba(0,0,0,.42);
}

.badge-asset-editor{
  width:100%;
  display:grid;
  gap:12px;
  padding:10px;
}

.badge-editor-title{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  color:var(--panel-header-text);
  font-size:13px;
}

.badge-editor-title span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  font-size:12px;
}

.badge-frame-stage{
  width:min(320px, 100%);
  aspect-ratio:1;
  justify-self:center;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:22px;
  background:
    radial-gradient(circle at 35% 20%, rgba(255,255,255,.08), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.05), rgba(0,0,0,.22));
  cursor:grab;
  touch-action:none;
  user-select:none;
}

.badge-frame-stage:active{
  cursor:grabbing;
}

.badge-frame-preview-svg{
  width:82%;
  height:82%;
  display:block;
  overflow:visible;
}

.badge-frame-hint{
  text-align:center;
}

.badge-color-controls{
  display:grid;
  grid-template-columns:1fr;
  gap:6px;
}

.badge-color-controls.collapsed{
  display:none;
}

.badge-colors-toggle{
  justify-self:start;
  min-height:28px;
  padding:5px 10px;
  border-radius:10px;
  font-size:12px;
}

.badge-color-control{
  display:grid;
  grid-template-columns:74px 30px 30px minmax(56px, 78px);
  align-items:center;
  gap:6px;
  padding:5px 7px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  background:rgba(255,255,255,.035);
  color:var(--muted);
  font-size:11px;
}

.badge-color-control input[type="color"]{
  width:28px;
  height:26px;
  padding:2px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  background:rgba(0,0,0,.22);
  cursor:pointer;
}

.badge-color-control .theme-code{
  width:100%;
  min-width:0;
  height:26px;
  padding:4px 6px;
  border-radius:8px;
  font-size:11px;
}

.badge-eyedropper-btn{
  width:28px;
  height:26px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  background:rgba(255,255,255,.07);
  color:var(--text);
  cursor:pointer;
  padding:0;
}

.badge-eyedropper-btn:hover{
  border-color:rgba(255,255,255,.34);
  background:rgba(255,255,255,.13);
}

.badge-eyedropper-btn:disabled{
  opacity:.45;
  cursor:wait;
}

.badge-eyedropper-btn svg{
  width:17px;
  height:17px;
  fill:currentColor;
}

.badge-eyedropper-active .badge-frame-stage,
.badge-eyedropper-active .badge-color-controls{
  opacity:.45;
}

.badge-shape-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(92px, 1fr));
  gap:8px;
}

.badge-shape-option{
  display:grid;
  justify-items:center;
  gap:5px;
  min-width:0;
  padding:8px 6px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  cursor:pointer;
}

.badge-shape-option:hover{
  border-color:rgba(106,169,255,.45);
  background:rgba(106,169,255,.11);
}

.badge-shape-option.active{
  border-color:rgba(245,158,11,.55);
  background:rgba(245,158,11,.13);
}

.badge-shape-option svg{
  width:44px;
  height:44px;
  overflow:visible;
}

.badge-shape-option path{
  fill:rgba(255,255,255,.06);
  stroke:currentColor;
  stroke-width:5;
  stroke-linejoin:round;
}

.badge-shape-option span{
  font-size:11px;
  color:var(--muted);
}

.badge-frame-controls{
  flex-wrap:wrap;
}

.feature-coming-soon{
  position:relative;
  min-height:260px;
  width:100%;
  display:grid;
  place-items:center;
  padding:28px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  overflow:hidden;
  background:
    radial-gradient(circle at 20% 10%, rgba(110,231,255,.20), transparent 34%),
    radial-gradient(circle at 78% 30%, rgba(245,158,11,.18), transparent 38%),
    rgba(5,9,16,.76);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}

.feature-coming-soon::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(255,255,255,.08), transparent 34%, rgba(255,255,255,.05));
  pointer-events:none;
}

.feature-coming-soon-card{
  position:relative;
  z-index:1;
  max-width:560px;
  text-align:center;
  padding:24px 28px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:20px;
  background:rgba(10,14,24,.78);
  box-shadow:0 22px 70px rgba(0,0,0,.35);
}

.feature-coming-soon-kicker{
  margin-bottom:6px;
  color:var(--minor-font-2, rgba(255,255,255,.68));
  font-size:12px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.feature-coming-soon-title{
  color:var(--header-font-color, #f5d48b);
  font-family:var(--header-font, inherit);
  font-size:clamp(34px, 5vw, 74px);
  font-weight:900;
  line-height:1;
  text-shadow:0 4px 22px rgba(0,0,0,.35);
}

.feature-coming-soon-note{
  margin-top:12px;
  color:var(--minor-font-1, rgba(255,255,255,.78));
  font-size:14px;
  line-height:1.45;
}

.asset-grid > .feature-coming-soon{
  grid-column:1 / -1;
  min-height:360px;
}

.student-avatar-coming-soon-shell{
  min-height:420px;
  padding:0;
}

.student-avatar-coming-soon-shell .feature-coming-soon{
  min-height:100%;
  border-radius:inherit;
}

@media (max-width: 760px){
  .dynamo-stage-content{
    grid-template-columns:1fr;
  }

  .tag-report-row{
    grid-template-columns:1fr;
  }

  .tag-report-badge-cell{
    justify-content:flex-start;
    min-width:0;
  }

}