
#cuteth .cute-sw{margin-left:auto;flex:none;width:40px;height:22px;border-radius:999px;background:rgba(255,255,255,.14);position:relative;transition:background .25s}
#cuteth .cute-sw i{position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.4);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
#cuteth[aria-pressed=true] .cute-sw{background:linear-gradient(135deg,#ff8fc7,#b79cff)}
#cuteth[aria-pressed=true] .cute-sw i{transform:translateX(18px)}

body.cute,body.cute[data-pg]{--bg:#2a2040;--panel:#382c5a;--line:#6f5ca6;--acc:#ff8fc7;--ink:#fff7fc;--mute:#d6c8f2;--hand:#ffd95a;color-scheme:dark;
 background:radial-gradient(900px 520px at 12% -8%,rgba(255,143,199,.30),transparent 62%),radial-gradient(800px 520px at 92% 6%,rgba(160,140,255,.32),transparent 62%),radial-gradient(700px 500px at 50% 110%,rgba(143,232,208,.16),transparent 60%),#2a2040}
body.cute::before{content:"";position:fixed;left:0;right:0;top:0;height:6px;z-index:2147482000;pointer-events:none;background:linear-gradient(90deg,#ff8fc7,#ffd95a,#8fe8d0,#8fc8ff,#b79cff,#ff8fc7)}

/* แถบบน + แถบแท็บ */
body.cute .topbar,body.cute[data-pg] .topbar{background:rgba(42,32,64,.95);border-bottom:2px dashed rgba(255,143,199,.5)}
body.cute .subbar,body.cute[data-pg] .subbar{background:rgba(42,32,64,.95)}
body.cute .topbar .logo,body.cute[data-pg] .topbar .logo{color:#ff8fc7;text-shadow:0 2px 0 #7a4fb5,0 0 18px rgba(255,143,199,.5)}
body.cute[data-pg] .topbar a:hover{color:#ffd95a;background:rgba(255,143,199,.14);border-radius:999px}
body.cute[data-pg] .tabs{border-bottom-color:rgba(255,143,199,.35)}
body.cute[data-pg] .tabs a{border-radius:14px 14px 0 0}
body.cute[data-pg] .tabs a.on{color:#fff;border-bottom-color:#ff8fc7}
body.cute[data-pg] .tabs.ind a.on{border-bottom-color:transparent}
body.cute .tabs .tabind{background:linear-gradient(90deg,#ff8fc7,#b79cff);box-shadow:0 0 16px rgba(255,143,199,.8)}

/* การ์ด / แผง */
body.cute[data-pg] .panel,body.cute.hasbg[data-pg] .panel,body.cute .panel{background:rgba(56,44,90,.92);border:2px dashed rgba(255,143,199,.45);border-radius:22px;box-shadow:0 10px 28px rgba(18,8,40,.5)}
body.cute[data-pg] .sr,body.cute[data-pg] .lc,body.cute[data-pg] .cbc,body.cute[data-pg] .cbsec,body.cute[data-pg] .card,body.cute[data-pg] .panel .card,
body.cute.hasbg[data-pg] .sr,body.cute.hasbg[data-pg] .lc,body.cute.hasbg[data-pg] .cbc,body.cute.hasbg[data-pg] .cbsec{background:#43356b;border:1px solid rgba(255,143,199,.3);border-radius:16px}
body.cute[data-pg] .sr:hover{background:#4c3d78}
body.cute[data-pg] .sr.sub{background:rgba(255,143,199,.1)}
body.cute[data-pg=spl] .sc2{background:#3d2f62;border:0;border-left:5px solid #ff8fc7;border-radius:18px}
body.cute[data-pg=spl] .sc2.sub{border-left-color:#8fc8ff}
body.cute[data-pg=spl] .slug,body.cute[data-pg=spl] .spbar{background:#33284f;border-radius:14px}
body.cute[data-pg=spl] .spbar{border-left-color:#ff8fc7}
body.cute[data-pg] .panel>summary,body.cute[data-pg] .panel>h2,body.cute[data-pg] .card h3,body.cute[data-pg] .cbsec h3{color:#fff}
body.cute .panel>h2,body.cute .panel>summary,body.cute .sx h2{color:#ffb8dc}
body.cute .sx{background:rgba(56,44,90,.92);border-color:rgba(255,143,199,.4);border-radius:22px}

/* ช่องกรอก */
body.cute[data-pg] .sr input,body.cute[data-pg] .sr textarea,body.cute[data-pg] .lc input,body.cute[data-pg] .lc textarea,
body.cute[data-pg] .cbsec input,body.cute[data-pg] .cbsec textarea,body.cute[data-pg] .cbsec select,
body.cute[data-pg] .panel textarea,body.cute[data-pg] .panel select,body.cute[data-pg] .panel input[type=number],body.cute[data-pg] .card textarea,
body.cute[data-pg=spl] .sc2 input,body.cute[data-pg=spl] .sc2 select,body.cute[data-pg=spl] .sc2 textarea,
body.cute[data-pg] #outline textarea,body.cute[data-pg] #outline>input,
body.cute #cbw .cbsec input,body.cute #cbw .cbsec textarea{background:#2f2450;color:#fff;border:1px solid rgba(255,143,199,.22);border-radius:12px}
body.cute[data-pg] .panel textarea:focus,body.cute[data-pg] .panel select:focus,body.cute[data-pg] .panel input:focus,
body.cute[data-pg=spl] .sc2 input:focus,body.cute[data-pg=spl] .sc2 select:focus,body.cute[data-pg=spl] .sc2 textarea:focus,
body.cute[data-pg] #outline textarea:focus,body.cute[data-pg] #outline>input:focus{outline:2px solid #ff8fc7;outline-offset:0}
body.cute[data-pg] #script{background:#2f2450;border:1px solid rgba(255,143,199,.25);border-radius:16px}
body.cute[data-pg] #script:focus{outline:2px solid #ff8fc7}
body.cute[data-pg] .sh{background:#4a3a78;border-left:4px solid #ff8fc7;border-radius:8px}
body.cute[data-pg] #pname:hover,body.cute[data-pg] #pname:focus{border-color:#ff8fc7}

/* ปุ่ม (ทรงแคปซูล) */
body.cute[data-pg] .top button,body.cute[data-pg] .gp button,body.cute[data-pg] #outline button,
body.cute[data-pg] .panel button:not(.on):not([class*=st-]),body.cute[data-pg] .card button:not(.on){background:rgba(255,143,199,.2);color:#fff;border-radius:999px}
body.cute[data-pg] .top button:hover,body.cute[data-pg] .gp button:hover,body.cute[data-pg] #outline button:hover,
body.cute[data-pg] .panel button:not(.on):not([class*=st-]):hover,body.cute[data-pg] .card button:not(.on):hover{background:rgba(255,143,199,.38)}
body.cute[data-pg] button.pri,body.cute[data-pg] .gp button.pri,body.cute[data-pg] .panel button.pri,body.cute[data-pg] .card button.pri,
body.cute[data-pg=spl] #p-spl button.pri,body.cute[data-pg=spl] #spfab{background:linear-gradient(135deg,#ff8fc7,#b79cff);color:#2a1a4a;font-weight:700;border-radius:999px}
body.cute[data-pg] button.pri:hover,body.cute[data-pg] .gp button.pri:hover,body.cute[data-pg] .panel button.pri:hover,body.cute[data-pg] .card button.pri:hover,
body.cute[data-pg=spl] #p-spl button.pri:hover,body.cute[data-pg=spl] #spfab:hover{background:linear-gradient(135deg,#ffa6d3,#c7b0ff)}
body.cute[data-pg] .pill,body.cute[data-pg] select.pill{background:rgba(255,143,199,.2);color:#fff;border-radius:999px}
body.cute[data-pg] .pill:hover{background:rgba(255,143,199,.36)}
body.cute[data-pg] #xdoc{background:#fff;color:#4a2a7a}
body.cute .epb,body.cute[data-pg=spl] .epb{background:#ff8fc7;color:#2a1a4a}
body.cute .panel>summary .scn{background:rgba(255,143,199,.2);border-color:rgba(255,143,199,.6)}
body.cute .t.sel{fill:#ff8fc7}

/* เมนูเครื่องมือ */
body.cute #tmenu .gpop.tmp{background:linear-gradient(180deg,#4a3a78,#2f2450);border-color:rgba(255,143,199,.45)}
body.cute #tmenu .gpop.tmp::before{background:radial-gradient(120% 100% at 85% 0,rgba(255,143,199,.25),transparent 70%)}
body.cute #tmenu .tmi:hover .tmic,body.cute #tmenu .tmi:focus-visible .tmic{background:linear-gradient(145deg,#ff8fc7,#b79cff);color:#fff;box-shadow:0 6px 16px rgba(255,143,199,.5)}
body.cute #tmenu .tmi:hover{border-color:rgba(255,143,199,.4)}
body.cute #tmenu[open]>summary.tmsum{box-shadow:0 0 0 1px rgba(255,143,199,.5) inset,0 4px 14px rgba(0,0,0,.35)}
