/*
 * Bee Logic Section Builder — Permanent Dark Studio Theme V2.3
 * Visual-only enhancement. Does NOT affect section HTML, iframe previews,
 * AI/API behavior, project persistence, or Library content.
 * By TakCan Inc. | Good Dragons® original brand mark.
 */
:root {
  color-scheme:dark;
  --bg:#090c12;
  --paper:#121821;
  --ink:#f0f3f6;
  --muted:#a5aebb;
  --line:#2a3341;
  --gold:#f5c400;
  --black:#0a0e14;
  --shadow:0 20px 48px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.025);
  --bl-panel:#131922;
  --bl-panel-2:#191f2a;
  --bl-border:#303947;
  --bl-quiet:#9da8b7;
  --bl-strong:#f3f5f9;
  --bl-glow:rgba(245,196,0,.16);
}
html,body{background:#090c12;color:var(--bl-strong)}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
button,input,select,textarea{color:inherit}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid #ffe269;outline-offset:3px}
.app{background:linear-gradient(125deg,#0a0e14 0%,#11151c 100%)}
/* Primary navigation / branding */
.sidebar{background:linear-gradient(158deg,#12171f 0%,#0c1017 56%,#0a0d13 100%);border-right:1px solid #323333;padding:27px 16px;box-shadow:10px 0 32px rgba(0,0,0,.12)}
.brand{padding:0 6px 32px;gap:12px}
.brand-mark{background:linear-gradient(140deg,#ffe15a,#f3bf07 72%,#bd8c00);color:#111417;border-radius:12px;box-shadow:0 0 22px rgba(245,196,0,.18),inset 0 1px 0 rgba(255,255,255,.5);border:1px solid rgba(255,234,132,.5)}
.brand b{font-size:17px;letter-spacing:-.48px;color:#f5f7fb}
.brand small{color:#9da6b2;font-size:10px}
.side-label{color:#7f8a98;letter-spacing:1.8px}
.nav-btn{color:#aeb7c5;border-color:transparent;transition:background .16s,color .16s,border-color .16s,box-shadow .16s}
.nav-btn.selected{background:linear-gradient(100deg,rgba(245,196,0,.17),rgba(245,196,0,.035));color:#fff7d6;border:1px solid rgba(245,196,0,.26);box-shadow:inset 3px 0 0 #e9b906,0 6px 18px #00000023}
.nav-btn:hover:not(.selected){background:#1d2530;color:#fff;border-color:#343e4b}
.nav-icon{color:#f5c400}
.count{background:#252d38;border:1px solid #354051;color:#d3dbe4}
.tiny-plus{color:#e3edf6;border-color:#3d4654;background:#1b222b}
.tiny-plus:hover{border-color:#e2b300;color:#ffe46e}
.project-nav button{color:#afb8c7}
.project-nav button.active,.project-nav button:hover{background:#222b37;color:#ffe084}
.sidebar-tip{background:radial-gradient(circle at 100% 0%,rgba(245,196,0,.12),transparent 65%),linear-gradient(155deg,#202731,#151b24);border:1px solid rgba(245,196,0,.16);box-shadow:0 10px 30px rgba(0,0,0,.16);border-radius:12px;padding:17px}
.sidebar-tip b{color:#f5f6fa;font-size:11px}
.sidebar-tip p{color:#adb6c2}
.user-line{color:#b2bdc9;padding:18px 7px 0}
.status-dot.on{background:#5bdfaa;box-shadow:0 0 0 4px rgba(70,201,145,.1)}
.studio-side-signature{display:flex;align-items:center;gap:11px;margin:16px 5px 3px;padding:14px 7px 0;border-top:1px solid #303846}
.studio-company-mark{display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;padding:3px;border:1px solid rgba(245,196,0,.35);border-radius:12px;background:#fff;box-shadow:0 0 21px rgba(245,196,0,.11)}
.studio-company-mark img{width:100%;height:100%;object-fit:contain;display:block;border-radius:7px}
.studio-side-signature .studio-signature-text{min-width:0;display:flex;flex-direction:column;gap:3px}
.studio-side-signature strong{font-size:10px;font-weight:850;color:#e2e6ea}
.studio-side-signature small{font-size:9px;letter-spacing:.16px;color:#b3bbc4}
/* Workspace canvas */
.content{display:flex;flex-direction:column;min-height:100vh;min-width:0;position:relative;isolation:isolate;
  background:radial-gradient(ellipse 560px 360px at 96% 7%,rgba(245,196,0,.07),transparent 79%),radial-gradient(ellipse 670px 500px at 11% 75%,rgba(44,82,119,.1),transparent 80%),#0c1017}
.topbar{position:relative;z-index:2;background:rgba(14,19,27,.95);border-bottom:1px solid #2a3340;box-shadow:0 6px 30px rgba(0,0,0,.16);padding:0 29px}
.topbar:after{position:absolute;content:"";height:1px;bottom:-1px;left:3%;width:28%;background:linear-gradient(90deg,rgba(245,196,0,.65),transparent);pointer-events:none}
.crumb{color:#a8b2c0}
.crumb b{color:#f5f6f8}
.slash{color:#5d6774}
.tag{background:rgba(245,196,0,.07);color:#e7cf78;border:1px solid rgba(245,196,0,.23);border-radius:7px;letter-spacing:1.2px;padding:9px 12px}
#projectView,#libraryView{padding:35px 28px 48px}
.page-head h1{font-size:29px;color:#f4f6f9;letter-spacing:-.95px}
.kicker{color:#ebc852}
.sub{color:#a7b0bc}
h1,h2,h3{color:var(--bl-strong)}
.mini-kicker{color:#93a0b0;letter-spacing:1.45px}
.page-actions{flex-wrap:wrap}
/* Consistent elevated controls */
.button{border-radius:9px;min-height:37px;transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease}
.button:disabled{opacity:.45}
.button.primary{background:linear-gradient(110deg,#ffe16a,#f5c400 65%,#ecad00);color:#191b1d;border-color:#ffd950;font-weight:850;box-shadow:0 4px 19px rgba(245,196,0,.11),inset 0 1px 0 rgba(255,255,255,.4)}
.button.primary:hover{background:linear-gradient(110deg,#fff096,#ffd944,#f2bf08);box-shadow:0 5px 24px rgba(245,196,0,.25)}
.button.dark{background:linear-gradient(160deg,#252e39,#171d27);border-color:#3a4554;color:#eaf0f6}
.button.dark:hover{border-color:#657080;background:#2b3441}
.button.outline{background:#1a222e;border-color:#394557;color:#e6ebf2}
.button.outline:hover{border-color:#b49a4d;background:#2b3036;color:#fff}
.button.ghost-danger{color:#f0a3a5}
.button.ghost-danger:hover{background:rgba(220,79,89,.11)}
.icon-button{border:1px solid #3a4656;background:#212a36;color:#e8edf3;border-radius:8px}
.icon-button:hover{border-color:#c8a441;color:#ffe080}
/* Three work zones */
.three-pane{gap:15px}
.sections-pane,.editor-pane,.output-pane,.editor-empty{position:relative;isolation:isolate;border:1px solid #303a49;border-radius:15px;background:linear-gradient(155deg,#1a212c 0%,#111821 56%,#11161f 100%);box-shadow:0 18px 50px #00000038,inset 0 1px 0 #ffffff0a;min-width:0}
.sections-pane:before,.editor-pane:before,.output-pane:before{content:"";position:absolute;top:-1px;left:9%;right:9%;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(245,196,0,.36),transparent)}
.sections-pane{background:linear-gradient(155deg,#1b222e,#101721 82%)}
.pane-top h2{color:#f3f6fa;font-size:15px}
.pane-top h2 span{color:#e5cb67}
.section-top,.output-top{border-bottom:1px solid #2c3645}
.round-add{color:#111;background:linear-gradient(135deg,#ffe46f,#f5bf00);box-shadow:0 0 17px rgba(245,196,0,.16);font-weight:850}
.section-item{background:transparent;border-color:transparent;color:#e0e6ee}
.section-item:hover{background:#242c37}
.section-item.active{background:linear-gradient(110deg,rgba(245,196,0,.15),rgba(245,196,0,.035));border:1px solid rgba(245,196,0,.31);box-shadow:inset 3px 0 #f5c400}
.section-number{color:#94a0af}
.section-item.active .section-number{color:#f3d363}
.section-item small{color:#a2aebb}
.item-check{color:#72d7a4}
.dashed-button{background:#171f2a;color:#dbe1e8;border:1px dashed #576271}
.dashed-button:hover{background:#222b38;border-color:#f5c400}
.text-link{color:#f3d777}
.text-link:hover{color:#fff0ab}
.info-tile{background:linear-gradient(135deg,#232833,#161f2a);border-color:#394253}
.info-tile b{color:#e9edf2}
.info-tile p{color:#aeb6c3}
/* Editor toolbar */
.pill{background:rgba(245,196,0,.08);border-color:rgba(245,196,0,.3);color:#f7d76a;font-weight:850}
.pill.approved{background:rgba(83,186,127,.1);border-color:#287454;color:#9ff4c0}
.section-reorder button{background:#202938;border:1px solid #3b4757;color:#e9edf5;border-radius:7px}
.section-reorder button:hover{background:#2d3643;border-color:#f5c400}
.section-quickbar{border-bottom:1px solid #2c3645;gap:7px;padding:13px 16px}
.section-quickbar button{background:linear-gradient(160deg,#252d38,#1b222d);border:1px solid #374251;color:#dce4ed;border-radius:9px;min-height:58px;box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 4px 14px rgba(0,0,0,.09);transition:border-color .18s,box-shadow .18s,background .18s,transform .18s}
.section-quickbar button span{color:#b1bdc9;font-size:9.3px}
.section-quickbar button:hover{transform:translateY(-2px);border-color:#c4a34f;background:linear-gradient(160deg,#363735,#262a30);box-shadow:0 0 21px rgba(245,196,0,.12)}
.editor-scroll{padding:20px}
.field>span{color:#dbe2ec;font-weight:780;font-size:10px}
.field input,.field select,.field textarea,.search-field input,.detail-actions select,
.library-controls select{color:#edf2f7;background:#0f151e;border:1px solid #394657;border-radius:9px;caret-color:#f5c400}
.field input:focus,.field select:focus,.field textarea:focus,.search-field:focus-within{border-color:#d5ad37;box-shadow:0 0 0 3px rgba(245,196,0,.09)}
.field input:disabled{background:#1b2530;color:#9ca9b9;border-color:#323e4c}
.field textarea::placeholder,.field input::placeholder,.search-field input::placeholder{color:#78879a}
select option{background:#17202b;color:#edf2f8}
.prompt-field em{color:#f3ca44;background:rgba(245,196,0,.08);border:1px solid rgba(245,196,0,.18);border-radius:5px;padding:3px 7px}
.voice-line,.attached-head{color:#b4c0ca}
.voice-button{background:#262e3b;color:#f6e1a5;border:1px solid #4b493c;border-radius:8px}
.voice-button:hover{background:#333b46;border-color:#cfa631}
#speechLanguage{background:#151d27;color:#dce5ef;border:1px solid #384454;border-radius:7px}
#speechInfo{color:#8f9cac}
.attached-head{color:#bdc6d1}
.attached-head>span:first-child{color:#c7d1dd}
.asset-chip{background:#242e3a;border-color:#485362;color:#e7edf3}
.asset-chip .embed-repair{background:#e8bd28;color:#181b1f}
.muted-hint{color:#9aa7b5}
.seo-block{border-top:1px solid #303b4b}
.seo-block summary{color:#c4ced9}
.seo-block summary:hover{color:#ffe083}
.editor-actions{background:rgba(9,14,21,.26);border-top:1px solid #303949;padding:13px 16px}
/* Output: dark chrome, original section appearance untouched inside iframe */
.code-size{color:#9da8b5}
.output-tools{padding:12px 15px}
.segmented{background:#10161e;border:1px solid #374151;border-radius:9px}
.segmented button{color:#a3afbd;border-radius:7px}
.segmented button.selected{color:#ffd964;background:#2b3442;box-shadow:inset 0 0 0 1px #4b5260,0 4px 12px #0005}
.preview-shell{background:radial-gradient(circle at 90% 10%,rgba(245,196,0,.035),transparent 36%),#0d121b;border:1px solid #364151;border-radius:10px;min-height:510px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.02)}
.preview-shell iframe{background:white}
.preview-placeholder{color:#e4ebf3}
.preview-icon{color:#ffd96d;background:#252d37;border:1px solid #485066;box-shadow:0 0 29px rgba(245,196,0,.075)}
.preview-placeholder strong{color:#f2f6fa}
.preview-placeholder p{color:#a1adba}
.preview-shell textarea{background:#080e16;color:#e4ebf6;font-size:11px}
.output-foot span{color:#a9b4c2}
.output-note{background:rgba(245,196,0,.08);border-color:#715d22;color:#e2c875}
.editor-empty{color:#bec8d4}
.editor-empty div{color:#e5be43}
.editor-empty p{color:#a6b2c1}
/* Library */
.library-controls>span{color:#aeb6c1}
.search-field{background:#151d27;border:1px solid #394657;color:#a4afbd;border-radius:9px}
.search-field input{background:transparent;border:0}
.library-card{background:linear-gradient(155deg,#1d2631,#121923);color:#e8eff7;border:1px solid #313d4a;border-radius:13px;box-shadow:0 13px 36px rgba(0,0,0,.22);transition:transform .18s,border-color .18s,box-shadow .18s}
.library-card:hover{border-color:#d4b655;box-shadow:0 16px 42px rgba(0,0,0,.35),0 0 25px rgba(245,196,0,.10)}
.card-cover{background:radial-gradient(circle at 83% 13%,rgba(245,196,0,.19),transparent 52%),repeating-linear-gradient(90deg,rgba(255,255,255,.045) 0 1px,transparent 1px 28px),#202833;border-bottom:1px solid #34404d}
.card-cover .cover-symbol{color:#f1cb45}
.card-cover .cover-mark{color:#ffe28c;background:rgba(245,196,0,.07);border-color:rgba(245,196,0,.23)}
.card-info h3{color:#f2f5f8}
.card-info p{color:#aeb8c5}
.card-footer{border-top:1px solid #35404d;color:#b0bac6}
.approved-indicator{color:#82e0ae}
.library-detail{background:linear-gradient(150deg,#19212b,#101720);border:1px solid #354050;box-shadow:0 12px 35px #0005}
.library-preview{border-color:#3b4757;background:#fff}
.library-preview iframe{background:#fff}
/* Empty project, dialogs, auth */
.empty-view h1{color:#f6f8fa}
.empty-view>p:not(.kicker){color:#bbc4cf}
.empty-mark{background:radial-gradient(circle,rgba(245,196,0,.25),rgba(245,196,0,.09));color:#ffe176;border:1px solid rgba(245,196,0,.28);box-shadow:0 0 36px rgba(245,196,0,.12)}
dialog{color:#eaf0f5}
.modal,.login-card{background:linear-gradient(150deg,#202935,#111821);color:#edf2f7;border:1px solid #3e4757;box-shadow:0 30px 100px #000b}
.modal::backdrop,.full-preview::backdrop{background:#030609ce;backdrop-filter:blur(7px)}
.modal-head h2,.login-card h2{color:#f8fafb}
.form-help,.login-card>p:not(.kicker){color:#abb7c4}
.full-preview{background:#111820;border:1px solid #333f4d;color:#f3f5fa}
.full-preview-bar{background:#18212c;border-bottom:1px solid #374252}
.full-preview-bar b{color:#eaf0f5}
.full-preview-bar span{color:#a9b4bf}
.full-preview iframe{background:white}
.toast{background:#172f2a;color:#ebfff3;border:1px solid #397e60;box-shadow:0 12px 36px rgba(0,0,0,.45)}
.toast.error{background:#52242a;border-color:#9a444c}
.login-overlay{background:#06090fe8;backdrop-filter:blur(9px)}
.error-text{color:#ff999e}
/* Persistent corporate attribution */
.studio-company-footer{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:13px;padding:16px 30px 20px;border-top:1px solid #293341;color:#acb6c4;background:rgba(8,12,17,.33)}
.studio-company-footer strong{color:#f0d879;font-size:10px;font-weight:850;letter-spacing:.25px}
.studio-company-footer span{font-size:10px}
.studio-footer-right{display:flex;align-items:center;gap:7px;white-space:nowrap}
.studio-footer-right .company-dot{height:5px;width:5px;border-radius:100%;background:#f4c500;box-shadow:0 0 10px rgba(245,196,0,.5)}
@media(max-width:1260px){#projectView,#libraryView{padding:26px 17px}.topbar{padding:0 20px}.section-quickbar{gap:6px}}
@media(max-width:780px){.sidebar{padding:12px 16px;min-height:0;height:auto;border-right:0;border-bottom:1px solid #343e4d}.brand{padding:0}.content{min-height:calc(100vh - 62px)}.topbar{height:64px;padding:0 13px}#projectView,#libraryView{padding:22px 11px 34px}.three-pane{gap:11px}.studio-side-signature{display:none}.studio-company-footer{padding:14px;flex-wrap:wrap}.section-quickbar{gap:6px}.page-head h1{font-size:24px}}
@media(max-width:480px){.section-quickbar button{min-height:56px}.section-quickbar button span{font-size:9px}.studio-company-footer{gap:8px}.studio-footer-right{white-space:normal}}
@media(prefers-reduced-motion:reduce){.section-quickbar button,.library-card,.button{transition:none!important}}