/* Embed Studio v266 — visual layer shared with the current Ketsu portals. */
.embed-page-body{
  --studio-side:252px;
  --studio-gold:#f7bf59;
  --studio-mint:#6ed7bd;
  --studio-ink:#071b20;
  --studio-panel:#102d32;
  min-height:100vh;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 78% 12%,#6ed7bd20,transparent 27%),
    radial-gradient(circle at 29% 71%,#f7bf5914,transparent 31%),
    linear-gradient(140deg,#06171c 0%,#092328 48%,#07191e 100%)!important;
}
.embed-page-body:before{
  opacity:.72;
  background-image:linear-gradient(#bdeee907 1px,transparent 1px),linear-gradient(90deg,#bdeee907 1px,transparent 1px)!important;
  background-size:48px 48px!important;
  animation:embed-grid-drift 24s linear infinite;
}
.embed-page-body:after{
  content:"";
  position:fixed;
  z-index:-1;
  inset:auto -11vw -30vh auto;
  width:55vw;
  height:55vw;
  border-radius:50%;
  background:radial-gradient(circle,#4fc9b117,transparent 66%);
  pointer-events:none;
  animation:embed-ambient 10s ease-in-out infinite alternate;
}

/* Left studio rail */
.embed-sidebar{
  width:var(--studio-side);
  padding:20px 15px 15px;
  border-right:1px solid #7bcfc02e;
  background:linear-gradient(180deg,#0d292ef7,#091f24f4)!important;
  box-shadow:18px 0 55px #020b0e75,inset -1px 0 #ffffff05;
}
.embed-sidebar:before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:190px;
  background:radial-gradient(circle at 38% 0,#65d9bd20,transparent 69%);
  pointer-events:none;
}
.embed-side-brand{position:relative;gap:11px;padding:2px 9px 22px}
.embed-side-brand img{width:44px;height:44px;filter:drop-shadow(0 0 13px #62d7bb55)}
.embed-side-brand strong{font-size:16px}.embed-side-brand small{color:#84aaa5;font-size:7px}
.embed-side-label{padding:14px 11px 9px;color:#6f9591;font-size:8px}
.embed-sidebar nav{position:relative;gap:6px}
.embed-sidebar nav a{
  position:relative;
  grid-template-columns:34px 1fr;
  gap:2px 10px;
  padding:10px 11px;
  overflow:hidden;
  border-radius:12px;
  transition:transform .2s ease,border-color .2s ease,background .2s ease,color .2s ease;
}
.embed-sidebar nav a:after{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:2px;
  background:var(--studio-gold);
  box-shadow:0 0 13px #f7bf59;
  opacity:0;
  transform:scaleY(.35);
  transition:.2s ease;
}
.embed-sidebar nav a>span{
  width:34px;height:34px;
  border-color:#5a817d5c;
  background:linear-gradient(145deg,#173a3f,#102c31);
  box-shadow:inset 0 1px #ffffff08;
}
.embed-sidebar nav b{font-size:13px}.embed-sidebar nav small{font-size:9px;color:#789995}
.embed-sidebar nav a:hover,.embed-sidebar nav a.is-active{
  border-color:#eaba5b4d;
  background:linear-gradient(90deg,#efb94f19,#59ccb809 80%);
  color:#fff7e8;
  transform:translateX(2px);
}
.embed-sidebar nav a:hover:after,.embed-sidebar nav a.is-active:after{opacity:1;transform:scaleY(.7)}
.embed-sidebar nav a.is-active>span{border-color:#eabc646e;box-shadow:0 0 18px #f7bd4f1f,inset 0 1px #ffffff12}
.embed-side-bottom{gap:12px;padding-top:15px;border-color:#53706d48}
.embed-side-bottom>span{font-size:8px;color:#6f918e}
.embed-side-bottom>a{
  position:relative;
  min-height:47px;
  overflow:hidden;
  border-color:#8790f274;
  background:linear-gradient(125deg,#5865f2cc,#4752c4a6);
  box-shadow:0 9px 24px #5865f22b,inset 0 1px #ffffff21;
  color:#fff;
  transition:transform .2s ease,box-shadow .2s ease;
}
.embed-side-bottom>a:after{content:"";position:absolute;inset:-80% auto -80% -35%;width:28%;background:#fff4;transform:rotate(18deg);animation:embed-sheen 5s ease-in-out infinite}
.embed-side-bottom>a:hover{transform:translateY(-2px);box-shadow:0 13px 31px #5865f247,inset 0 1px #ffffff2b}
.embed-side-bottom img{width:19px;height:19px;filter:drop-shadow(0 0 7px #fff6)}

/* Universal header and page frame */
.embed-page-body .topbar{left:var(--studio-side)!important;width:calc(100% - var(--studio-side))!important}
.embed-page{max-width:1540px!important;margin:0 22px 0 calc(var(--studio-side) + 22px)!important;padding:100px 0 70px!important}
.embed-intro{
  isolation:isolate;
  min-height:224px;
  margin-bottom:22px!important;
  padding:33px 38px;
  border:1px solid #76a8a337;
  border-radius:20px;
  background:
    linear-gradient(105deg,#143b40ee 0%,#0b292ede 56%,#122f34e8 100%),
    linear-gradient(135deg,#fff1,transparent);
  box-shadow:0 20px 52px #020d1055,inset 0 1px #ffffff0a;
}
.embed-intro:before{
  inset:-118px -22px auto auto;
  width:390px;height:390px;
  background:radial-gradient(circle,#69d7bd28,transparent 63%);
  animation:embed-ambient 7s ease-in-out infinite alternate;
}
.embed-intro:after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  opacity:.24;
  background-image:linear-gradient(135deg,transparent 0 48%,#ffffff08 48% 50%,transparent 50% 100%);
  background-size:28px 28px;
  mask-image:linear-gradient(90deg,transparent 32%,#000);
}
.embed-kicker{color:#8de0cb;font-size:9px;letter-spacing:.13em}
.embed-intro h1{max-width:760px;margin:10px 0!important;font-size:clamp(31px,3.8vw,51px)!important;line-height:1.1!important;text-shadow:0 8px 28px #0006}
.embed-intro h1 em{color:var(--studio-gold);text-shadow:0 0 27px #f7bf5925}
.embed-intro p{max-width:680px;color:#aec6c2;font-size:14px;line-height:1.6}
.embed-hero-pills{gap:7px;margin-top:17px}
.embed-hero-pills span{padding:7px 10px;border-color:#6386815c;background:#071c2175;color:#a9cbc6;font-size:9px}
.embed-intro-mark{
  right:38px;bottom:33px;
  width:98px!important;height:98px!important;
  border:1px solid #e9ba5a80!important;
  border-radius:25px!important;
  background:linear-gradient(145deg,#f7bf591d,#59cbb511)!important;
  box-shadow:0 0 0 7px #102f342e,0 17px 39px #0005,0 0 35px #f7bf5913!important;
  color:var(--studio-gold);
  animation:embed-mark-float 5s ease-in-out infinite;
}
.embed-intro-mark span{font-size:24px}.embed-intro-mark b{font-size:7px;letter-spacing:.16em}

/* Workspace */
.embed-layout{grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)!important;gap:20px!important}
.embed-tool-rail{grid-column:1/-1}
.embed-tool-shell{
  position:relative!important;top:auto!important;
  display:flex;
  align-items:center;
  gap:14px;
  min-height:76px;
  padding:12px 14px!important;
  border:1px solid #5374705c;
  border-radius:16px!important;
  background:linear-gradient(115deg,#102e33f5,#0c282df2)!important;
  box-shadow:0 13px 35px #020c0e46,inset 0 1px #ffffff08!important;
}
.embed-tool-eyebrow{flex:none;margin:0!important;padding:0 13px 0 2px;border-right:1px solid #58736f54;color:#7fa9a4!important;font-size:8px!important;writing-mode:vertical-rl;transform:rotate(180deg)}
.embed-tool-buttons{display:grid!important;grid-template-columns:repeat(3,minmax(145px,1fr));gap:9px!important;flex:1}
.embed-tool-buttons>button{
  display:grid!important;
  grid-template-columns:34px 1fr;
  align-items:center;
  justify-items:start!important;
  gap:9px!important;
  min-height:48px!important;
  padding:7px 10px!important;
  border-color:#476661!important;
  border-radius:11px!important;
  background:linear-gradient(145deg,#15363b,#102d32)!important;
}
.embed-tool-buttons>button span{grid-row:1;width:31px;height:31px!important;font-size:16px!important}.embed-tool-buttons>button strong{font-size:9px!important}
.embed-tool-buttons>button:hover,.embed-tool-buttons>button[aria-expanded=true]{border-color:#e7b75d9c!important;background:linear-gradient(135deg,#f7bf5922,#123238)!important;box-shadow:0 7px 20px #0004,0 0 22px #f7bf590e}
.embed-tool-panel{top:calc(100% + 9px)!important;left:0!important;width:min(470px,calc(100vw - var(--studio-side) - 70px))!important;border-color:#76938f8a!important;background:#102f34f8!important;backdrop-filter:blur(18px);box-shadow:0 24px 60px #010a0dc7!important}
.embed-column-head{margin:2px 2px 14px}.embed-column-head h2{font-size:22px}.embed-column-head span:first-child{font-size:8px;letter-spacing:.12em}
.embed-header-actions{display:flex;align-items:center;gap:7px}
.embed-jump-button,.embed-actions-menu>summary{border-color:#55716e!important;background:#102d32!important;box-shadow:inset 0 1px #ffffff08}
.embed-jump-button:hover,.embed-actions-menu>summary:hover{border-color:#dbae56!important;box-shadow:0 0 18px #f7bf5915}
.embed-connect{
  min-height:68px!important;
  margin-bottom:18px!important;
  border-color:#667f7d80!important;
  border-radius:14px!important;
  background:linear-gradient(105deg,#5865f21d,#113136 66%)!important;
  box-shadow:inset 3px 0 #7785ff,0 11px 30px #0003!important;
}
.embed-connect-avatar{box-shadow:0 0 20px #f7bf5921}
.embed-connect a{border:0!important;background:linear-gradient(135deg,#6875ff,#4e5bd8)!important;box-shadow:0 6px 17px #5865f23f!important;color:#fff!important}
.embed-format-label{margin:0 0 8px;color:#779c97;font:700 8px Silkscreen,monospace;letter-spacing:.12em}
.embed-mode-switch{gap:9px;margin-bottom:11px}
.embed-mode-switch button{
  position:relative;
  min-height:72px!important;
  overflow:hidden;
  border-color:#496762!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,#123237,#0e2b30)!important;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease!important;
}
.embed-mode-switch button:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 45%,#fff08,transparent 64%);transform:translateX(-120%);transition:transform .55s ease}
.embed-mode-switch button:hover:before{transform:translateX(120%)}
.embed-mode-switch button:hover{transform:translateY(-2px)}
.embed-mode-switch button[aria-selected=true]{border-color:#d9a94f!important;background:linear-gradient(135deg,#f7bf592a,#123238 68%)!important;box-shadow:inset 3px 0 var(--studio-gold),0 8px 25px #0003,0 0 24px #f7bf5910!important}
.embed-load-disclosure,.embed-text-tools{border-color:#476560!important;border-radius:12px!important;background:#102d32d9!important}
.embed-load-disclosure[open],.embed-text-tools[open]{border-color:#c99e4b69!important;box-shadow:0 8px 24px #0003}

/* Form cards */
.embed-editor-card,.embed-load-card{
  border-color:#47655f!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,#123238f2,#0e2a2ff2)!important;
  box-shadow:0 12px 31px #020d102f,inset 0 1px #ffffff07!important;
  backdrop-filter:blur(17px);
}
.embed-primary-card{position:relative;overflow:hidden;border-color:#b88b415c!important}
.embed-primary-card:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--studio-gold),var(--studio-mint),transparent);opacity:.8}
.embed-card-number{border-color:#efc474!important;background:linear-gradient(145deg,#ffdb83,#d99b42)!important;box-shadow:0 4px 12px #0004,0 0 18px #f7bf591b}
.embed-details{transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.embed-details:hover{border-color:#688780!important}.embed-details[open]{border-color:#c99d4c70!important;box-shadow:0 14px 36px #020d1040,0 0 24px #f7bf590b!important}
.embed-details>summary{transition:background .2s ease}.embed-details>summary:hover{background:#ffffff02}
.embed-page :is(input:not([type=color]):not([type=checkbox]),textarea,select){
  border-color:#43625d!important;
  background:#071f24d9!important;
  box-shadow:inset 0 1px 3px #0005;
}
.embed-page :is(input,textarea,select):focus{border-color:#e0ad51!important;box-shadow:0 0 0 3px #f7bf5918,0 0 20px #f7bf590d!important}
.embed-add-button{border-color:#68817d!important;background:#0b252a!important}.embed-add-button:hover{border-color:var(--studio-gold)!important;background:#f7bf590c!important}
.embed-field-item,.embed-v2-block{border-color:#42605c!important;background:#0b252ae8!important;box-shadow:inset 0 1px #ffffff05}
.embed-field-item:hover,.embed-v2-block:hover{border-color:#607e78!important}
.embed-actions-menu>div{border-color:#57736f!important;background:#102f34f7!important;backdrop-filter:blur(16px);box-shadow:0 18px 45px #0009!important}

/* Publish and Discord preview */
.embed-publish{
  position:relative;
  overflow:hidden;
  margin-top:18px!important;
  border-color:#a88040!important;
  background:linear-gradient(145deg,#4b382025,#123238 38%,#102d32)!important;
}
.embed-publish:after{content:"";position:absolute;right:-50px;top:-60px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,#f7bf5913,transparent 68%);pointer-events:none}
.embed-validate-button{border-color:#63807a!important;background:#0c282d!important}.embed-validate-button:hover{border-color:#e6b454!important;box-shadow:0 0 19px #f7bf5910}
.embed-publish-tabs{border-color:#4a6863!important;background:#082127!important}
.embed-publish-tabs button[aria-selected=true]{background:linear-gradient(135deg,#1c4445,#173b3f)!important;color:#ffd98e!important;box-shadow:0 3px 12px #0004,inset 0 1px #ffffff08!important}
.embed-main-button{position:relative;overflow:hidden;min-height:51px!important;border:0!important;border-radius:11px!important;background:linear-gradient(115deg,#ffd87d,#eda943)!important;box-shadow:0 8px 24px #d899352e,inset 0 1px #fff8!important;transition:transform .18s ease,box-shadow .18s ease!important}
.embed-main-button:before{content:"";position:absolute;inset:-70% auto -70% -24%;width:18%;background:#fff8;transform:rotate(18deg);transition:left .6s ease}
.embed-main-button:hover{transform:translateY(-2px)!important;box-shadow:0 12px 28px #d8993546,inset 0 1px #fff9!important}.embed-main-button:hover:before{left:120%}
.embed-preview-column{min-width:0}
.embed-preview-sticky{top:88px!important;padding:0 0 1px}
.embed-preview-sticky>.embed-column-head{padding:0 2px}
.embed-preview-sticky>.embed-column-head:after{content:"AO VIVO";margin-left:auto;padding:5px 8px;border:1px solid #64d5a94b;border-radius:999px;background:#54ca9d12;color:#75deb4;font:700 7px Silkscreen,monospace;box-shadow:0 0 18px #5dd4a721;animation:embed-live 2.1s ease-in-out infinite}
.embed-discord-window{
  position:relative;
  overflow:hidden;
  border-color:#5b5e68!important;
  border-radius:17px!important;
  box-shadow:0 23px 56px #0009,0 0 0 1px #ffffff05!important;
}
.embed-discord-window:before{content:"";position:absolute;z-index:2;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,#fff4,transparent);pointer-events:none}
.embed-discord-channel{min-height:51px;background:linear-gradient(#2d2f34,#292b30)!important}
.embed-discord-message{min-height:220px;padding:20px 17px 31px!important;background:radial-gradient(circle at 80% 0,#ffffff04,transparent 37%),#313338}
.embed-discord-avatar{box-shadow:0 0 0 2px #313338,0 0 0 3px #5865f2,0 5px 15px #0006}
.embed-discord-card{width:min(100%,540px);border-radius:5px 9px 9px 5px!important;box-shadow:0 9px 24px #0003}
.embed-preview-note{margin:11px 3px 0!important;color:#76938f!important}
.embed-load-body{border-top-color:#48635f!important;background:#0b272ce8!important}
.embed-saved-list button:hover{background:#f7bf590d!important;transform:translateX(2px)}

/* Themes, motion and responsive layout */
html[data-theme=light] .embed-page-body{background:linear-gradient(145deg,#e9f0eb,#f4f3e9)!important}
html[data-theme=light] .embed-sidebar{background:linear-gradient(180deg,#f8faf6f7,#ecf3eef7)!important;color:#14383b;box-shadow:16px 0 45px #30524f20}
html[data-theme=light] .embed-sidebar nav a{color:#456561}html[data-theme=light] .embed-sidebar nav a:hover,html[data-theme=light] .embed-sidebar nav a.is-active{color:#173b3f}
html[data-theme=light] .embed-tool-shell,html[data-theme=light] .embed-editor-card,html[data-theme=light] .embed-load-card{box-shadow:0 12px 30px #204a4520!important}
@keyframes embed-grid-drift{to{background-position:48px 48px}}
@keyframes embed-ambient{from{transform:translate3d(-2%,-2%,0) scale(.96)}to{transform:translate3d(2%,2%,0) scale(1.05)}}
@keyframes embed-mark-float{0%,100%{transform:translateY(0) rotate(2deg)}50%{transform:translateY(-7px) rotate(-1deg)}}
@keyframes embed-sheen{0%,62%{left:-35%}82%,100%{left:125%}}
@keyframes embed-live{0%,100%{box-shadow:0 0 12px #5dd4a715}50%{box-shadow:0 0 24px #5dd4a747}}
@media(max-width:1180px){
  .embed-page-body{--studio-side:224px}
  .embed-page{margin-left:calc(var(--studio-side) + 16px)!important;margin-right:16px!important}
  .embed-layout{grid-template-columns:1fr!important}
  .embed-preview-sticky{position:static!important}
  .embed-preview-column{max-width:780px}
  .embed-intro-mark{opacity:.45}
}
@media(max-width:820px){
  .embed-sidebar{display:none}
  .embed-page-body .topbar{left:0!important;width:100%!important}
  .embed-page{margin:0 14px!important;padding-top:92px!important}
  .embed-intro{min-height:0;padding:28px 24px}
  .embed-intro-mark{display:none!important}
  .embed-tool-eyebrow{display:none}
  .embed-tool-buttons{grid-template-columns:repeat(3,1fr)}
  .embed-tool-panel{width:100%!important}
}
@media(max-width:560px){
  .embed-page{margin:0 10px!important}
  .embed-intro{padding:24px 19px;border-radius:16px}
  .embed-intro h1{font-size:29px!important}.embed-intro p{font-size:12px}.embed-hero-pills{display:none}
  .embed-tool-shell{padding:9px!important}
  .embed-tool-buttons{gap:6px!important}
  .embed-tool-buttons>button{display:flex!important;justify-content:center!important;min-width:0!important;padding:6px!important}
  .embed-tool-buttons>button strong{font-size:7px!important}.embed-tool-buttons>button span{width:27px;height:27px!important}
  .embed-mode-switch{grid-template-columns:1fr}.embed-mode-switch button{min-height:61px!important}
  .embed-discord-message{padding:16px 10px 24px!important}
}
@media(prefers-reduced-motion:reduce){
  .embed-page-body:before,.embed-page-body:after,.embed-intro:before,.embed-intro-mark,.embed-side-bottom>a:after,.embed-preview-sticky>.embed-column-head:after{animation:none!important}
  .embed-page *{scroll-behavior:auto!important;transition:none!important}
}