:root{--y:#f2c300;--d:#101216;--p:#1d222b;--c:#f7f4ea}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Arial;background:radial-gradient(circle at top left,#f2c30033,transparent 360px),linear-gradient(135deg,#0d0f13,#282d36);color:white}button,input,select{font:inherit}button{border:0;border-radius:14px;padding:10px 15px;background:var(--y);color:#111;font-weight:900;cursor:pointer}button.secondary{background:#303642;color:white}button.danger{background:#b3261e;color:white}input,select{width:100%;padding:12px;border-radius:14px;border:1px solid #ddd}.login{min-height:100vh;display:grid;place-items:center}.card{background:white;color:#111;border-radius:26px;padding:24px;box-shadow:0 25px 70px #0008}.login .card{width:min(460px,94vw)}.brand{font-size:28px;font-weight:950}.brand span{color:var(--y)}.muted{color:#667}.shell{display:grid;grid-template-columns:270px 1fr;min-height:100vh}.side{background:#0d0f13;padding:26px;border-right:1px solid #ffffff14}.main{padding:30px}.nav{width:100%;margin:7px 0;text-align:left}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.badge{background:#111;color:var(--y);padding:5px 10px;border-radius:999px;font-size:12px;font-weight:900}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px;border-bottom:1px solid #eee;text-align:left}.editor{display:grid;grid-template-columns:220px 1fr 280px;gap:18px}.thumb{background:#252b35;padding:12px;border-radius:16px;margin:8px 0;cursor:pointer}.slide{background:var(--c);color:#111;aspect-ratio:16/9;border-radius:22px;position:relative;overflow:hidden;box-shadow:0 22px 70px #0008}.block{position:absolute;padding:8px;border:2px dashed transparent}.block:hover,.block.sel{border-color:var(--y)}.block img,.block video{width:100%;height:100%;object-fit:cover;border-radius:12px}.tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.viewer{height:100vh;background:#050505;display:grid;place-items:center}.viewer .slide{width:min(96vw,150vh)}.vnav{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);display:flex;gap:10px}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.resize-handle{
  position:absolute;
  right:-7px;
  bottom:-7px;
  width:18px;
  height:18px;
  background:#f2c300;
  border:2px solid #111;
  border-radius:50%;
  cursor:nwse-resize;
  z-index:20;
}

.block{
  cursor:move;
  user-select:none;
}

.block .content{
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
}

.block video.content{
  pointer-events:auto;
}

.textcontent{
  width:100%;
  height:100%;
  overflow:hidden;
  white-space:pre-wrap;
}

.block{
  cursor:move !important;
  user-select:none;
  touch-action:none;
  z-index:5;
}

.block.sel{
  outline:3px solid #f2c300;
  border-color:#f2c300 !important;
}

.block img,
.block video{
  width:100%;
  height:100%;
  object-fit:cover;
  pointer-events:none;
}

.resize{
  position:absolute;
  right:-9px;
  bottom:-9px;
  width:22px;
  height:22px;
  background:#f2c300;
  border:3px solid #111;
  border-radius:50%;
  cursor:nwse-resize;
  z-index:999;
}

.textcontent{
  width:100%;
  height:100%;
  overflow:hidden;
  white-space:pre-wrap;
}

#stageWrap{
  width:100%;
  max-width:1100px;
  aspect-ratio:16/9;
  background:#f7f4ea;
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 22px 70px #0008;
}

.konvaHint{
  background:#ffffff12;
  border:1px solid #ffffff20;
  border-radius:16px;
  padding:12px;
  margin-top:12px;
  color:#cfd3dd;
  font-size:14px;
}

.layerBtns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:10px;
}

.layerBtns button{
  width:100%;
}

.videoPlaceholder{
  background:#111;
  color:#f2c300;
}

.viewer .block video,
.viewer video{
  pointer-events:auto !important;
  z-index:9999;
  position:relative;
}

.viewer .block{
  pointer-events:auto !important;
}

.viewer .resize{
  display:none !important;
}

.viewer iframe{
  pointer-events:auto !important;
}

.viewer a{
  pointer-events:auto !important;
  text-decoration:none;
}

.viewer .block a{
  pointer-events:auto !important;
}