/* NiteFade Design Studio 4.0–4.9 — universal editing, beginner-friendly beta */
.v4-selection-status{padding:12px 13px;border:1px solid #e5d9f9;border-radius:12px;background:linear-gradient(120deg,#f5f1ff,#fff);font-size:11px;line-height:1.55;color:#685487;font-weight:700;margin:16px 0}
.v4-composite-toolbar{display:flex;gap:8px;margin:10px 0 14px}
.v4-composite-toolbar button{flex:1;border:1px solid #e8e0f3;border-radius:9px;background:#fff;color:#6348a5;padding:9px;font-size:11px;font-weight:750;cursor:pointer}
.v4-composite-toolbar button:hover{background:#f0eaff}
.v4-composite-section{border:1px solid #ece6f2;border-radius:13px;margin:8px 0;background:#fff;overflow:hidden}
.v4-composite-section>summary{padding:12px 14px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;list-style:none;color:#40334f;font-size:12px;font-weight:800;background:#faf9fc;gap:8px}
.v4-composite-section>summary::-webkit-details-marker{display:none}
.v4-composite-section>summary:after{content:"⌄";color:#8a62e6;transition:transform .18s}
.v4-composite-section[open]>summary:after{transform:rotate(180deg)}
.v4-composite-section>summary:focus-visible{outline:2px solid #aa8ef4;outline-offset:-2px}
.v4-composite-body{padding:10px 13px 12px}
.v4-composite-body>.composite-grid:first-child{margin-top:0}
#panel-composite button:disabled,#panel-composite input:disabled,#panel-composite select:disabled{opacity:.36;cursor:not-allowed;filter:grayscale(.45);pointer-events:none}
#panel-composite .v4-composite-toolbar button:disabled{opacity:1}
.v4-preview-status{font-size:10px;color:#7d6c93;background:#f7f3ff;border-radius:8px;padding:9px 10px;line-height:1.5}
.v4-preview-status.active{color:#7544d7;background:#efe7ff}
.v4-tiny-hint{font-size:10px;color:#94899f;line-height:1.6;margin:7px 0 11px}
.v4-template-browser{margin:12px 0 16px}
#v4-template-search{display:block;width:100%;border:1px solid #e6dff0;background:#fff;padding:11px;border-radius:10px;color:#413350;font-size:12px;outline:none}
#v4-template-search:focus{border-color:#9c7ef1;box-shadow:0 0 0 3px #bda9ef33}
.v4-categories{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0}
.v4-categories button{font-size:10px;font-weight:760;padding:8px 9px;color:#685779;background:#fff;border:1px solid #e8e0f3;border-radius:9px;cursor:pointer}
.v4-categories button.active{background:#efe8ff;border-color:#c9b4f6;color:#6b45d4}
.v4-template-count{color:#91859e;font-size:10px;margin:7px 0}
.template-preview[hidden],.v4-layout-card[hidden]{display:none!important}
.template-preview.v4-rpg{background:linear-gradient(145deg,#152939,#438a76);color:#e6fbcb}
.template-preview.v4-manga{background:linear-gradient(145deg,#f8ebec,#e67e8d);color:#5b244c}
.template-preview.v4-music{background:linear-gradient(145deg,#22194c,#9a48bc);color:#f1e1ff}
.template-preview.v4-event{background:linear-gradient(145deg,#e96b39,#f7b752);color:#572833}
.template-preview.v4-stream{background:linear-gradient(145deg,#081e3e,#4464bd);color:#d6fffb}
.template-preview.v4-wallpaper{background:linear-gradient(145deg,#151b33,#6a91ba);color:#fff}
.v4-composite-template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:10px 0}
.v4-layout-card{height:112px;border:1px solid #eae4f1;border-radius:12px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;padding:13px;cursor:pointer;text-align:left;overflow:hidden;transition:transform .16s,box-shadow .16s}
.v4-layout-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px #3827541c}
.v4-layout-card strong{font-family:Impact,'Arial Black',Arial,sans-serif;font-size:19px;line-height:1.06;letter-spacing:.02em}
.v4-layout-card span{font-size:10px;font-weight:750;opacity:.85}
.v4-layout-card.creator{background:linear-gradient(130deg,#14132b,#7035c8);color:#fff}
.v4-layout-card.giveaway{background:linear-gradient(130deg,#4c174b,#ef488a);color:#fff}
.v4-layout-card.versus{background:linear-gradient(130deg,#082c3d,#008d9b);color:#fff}
.v4-layout-card.newsflash{background:linear-gradient(130deg,#45192a,#d03b4c);color:#fff}
.v4-help-dialog{width:min(710px,calc(100vw - 24px));max-height:88dvh;overflow:auto}
.v4-guide-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0}
.v4-guide-steps>div{padding:14px;border-radius:11px;background:#faf8ff;border:1px solid #e9e3f2}
.v4-guide-steps strong{font-size:12px;color:#553a86}
.v4-guide-steps p{font-size:11px;line-height:1.55;color:#81748f;margin:8px 0 0}
.v4-feedback-panel{padding:16px;border-radius:12px;border:1px solid #e5d9f4;background:#fff}
.v4-feedback-panel>strong{font-size:13px}
.v4-feedback-panel p,.v4-feedback-panel small{display:block;font-size:11px;color:#80768d;line-height:1.6}
.v4-feedback-panel label{display:block;font-size:11px;font-weight:800;margin:13px 0 7px}
.v4-feedback-panel textarea{box-sizing:border-box;display:block;width:100%;min-height:85px;resize:vertical;border-radius:9px;border:1px solid #d9cfea;padding:10px;font:inherit;font-size:12px}
.v4-feedback-panel button{margin:12px 0 6px}
@media(max-width:650px){.v4-guide-steps{grid-template-columns:1fr}.v4-layout-card{height:98px}.v4-layout-card strong{font-size:17px}}

/* Welcome surface is HTML only and never part of PNG, PDF, SVG or project exports. */
.v4-empty-canvas{position:absolute;inset:0;z-index:7;display:grid;place-items:center;pointer-events:none}
.v4-empty-canvas[hidden]{display:none!important}
.v4-empty-content{pointer-events:auto;background:rgba(255,255,255,.94);border:1px solid #e8e1f5;border-radius:20px;box-shadow:0 14px 45px #42346518;padding:30px 35px;display:flex;align-items:center;flex-direction:column;gap:10px;text-align:center;width:min(560px,calc(100% - 70px));box-sizing:border-box}
.v4-empty-symbol{width:45px;height:45px;display:grid;place-items:center;background:#f0e7ff;border-radius:14px;color:#7955eb;font-size:27px}
.v4-empty-content strong{color:#36254e;font-size:23px;font-weight:850}
.v4-empty-content p{color:#827991;font-size:13px;line-height:1.6;max-width:450px;margin:0}
.v4-empty-actions{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-top:10px}
.v4-empty-actions button{padding:11px 14px;border-radius:10px;border:1px solid #e6dbf6;background:#f8f5ff;color:#6848c9;font-size:12px;font-weight:760;cursor:pointer}
.v4-empty-actions button:first-child{color:white;background:#7953e8;border-color:#7953e8}
.v4-empty-actions button:hover{filter:brightness(.96)}