@font-face{font-family:Scratchmeow;src:url('fonts/Scratchmeow5-Regular.ttf')}@font-face{font-family:Inter;src:url('fonts/Inter-Regular.otf')}@font-face{font-family:Inter;src:url('fonts/Inter-Bold.otf');font-weight:700}@font-face{font-family:Lato;src:url('fonts/Lato-Regular.ttf')}@font-face{font-family:Lato;src:url('fonts/Lato-Bold.ttf');font-weight:700}@font-face{font-family:Comfortaa;src:url('fonts/Comfortaa-Regular.ttf')}@font-face{font-family:Comfortaa;src:url('fonts/Comfortaa-Bold.ttf');font-weight:700}@font-face{font-family:Orbitron;src:url('fonts/Orbitron-Bold.ttf');font-weight:700}@font-face{font-family:'Lobster Two';src:url('fonts/LobsterTwo-Regular.otf')}@font-face{font-family:'Lobster Two';src:url('fonts/LobsterTwo-Bold.otf');font-weight:700}@font-face{font-family:'Comic Neue';src:url('fonts/ComicNeue-Regular.otf')}@font-face{font-family:'Comic Neue';src:url('fonts/ComicNeue-Bold.otf');font-weight:700}@font-face{font-family:'Lexend Deca';src:url('fonts/LexendDeca-Regular.ttf')}@font-face{font-family:Modak;src:url('fonts/Modak.ttf')}*{box-sizing:border-box}body{margin:0;background:#0e0a14;color:#fff;font-family:Inter,Segoe UI,Arial,sans-serif}.page{max-width:1600px;margin:auto;padding:34px}.hero{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:24px;border-bottom:1px solid #4d3a64;padding-bottom:22px}.hero h1{font-size:44px;margin:4px 0}.hero p{color:#cdbce0}.eyebrow{font-size:12px;letter-spacing:.16em;color:#b06cff!important}.privacy{border:1px solid #5a4770;border-radius:14px;padding:14px 18px;text-align:right;color:#ddcfee}.step,.editor details,.previewPanel{background:#1a1422;border:1px solid #433454;border-radius:16px}.step{padding:22px;margin-bottom:24px}.checkgrid{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr));gap:10px;margin:18px 0}.formatPick{display:flex;gap:16px;flex-wrap:wrap;color:#d7c9e6}.formatPick label{display:flex;align-items:center;gap:8px;background:#272033;padding:10px 14px;border-radius:10px}.checkcard{display:flex;gap:9px;align-items:center;background:#272033;padding:13px;border-radius:10px}.workspace{display:grid;grid-template-columns:minmax(380px,480px) 1fr;gap:24px;align-items:start}.editor{display:flex;flex-direction:column;gap:10px}.editor details{overflow:hidden}.editor summary{cursor:pointer;padding:16px 18px;font-weight:800}.inside{padding:0 18px 18px}.inside label{display:block;margin:11px 0;font-size:13px;color:#d9cbe7}.inside select,.inside input,.inside button,button{width:100%;margin-top:6px;border:1px solid #5b496d;background:#2a2235;color:#fff;border-radius:10px;padding:11px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.check{display:flex!important;gap:8px;align-items:flex-start}.check input{width:auto;margin-top:2px}.buttonrow{display:grid;grid-template-columns:1fr 1fr;gap:8px}.note,.licenseBox,.status,.previewHelp{font-size:12px;color:#cfc0de;line-height:1.45}.licenseBox,.status{padding:10px;background:#120e18;border-radius:9px}.previewPanel{padding:16px;position:sticky;top:16px}.previewTop{display:flex;justify-content:space-between;padding:4px 2px 12px}.stage{position:relative;aspect-ratio:16/9;width:100%;overflow:hidden;background:var(--bg,#15121a);border:1px solid #4a3b59;--bg:#17131f;--primary:#9b55ef;--secondary:#52e8ff;--text:#fff;--font:Arial,sans-serif;--preview-scale:1}.stage.format-v{aspect-ratio:9/16;max-height:75vh;margin-inline:auto}.stage::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px #ffffff10}.obj{position:absolute;user-select:none;touch-action:none}.obj.selected{outline:2px dashed #fff8}.box{border:4px solid var(--primary);background:#111b;min-width:100px;min-height:70px}.box.tech{clip-path:polygon(4% 0,96% 0,100% 8%,100% 92%,96% 100%,4% 100%,0 92%,0 8%)}.box.cute{border-radius:24px}.box.event{min-height:42px}.txt{white-space:pre-wrap;line-height:1.05;min-width:30px;min-height:20px}.motion{display:inline-block}.float{animation:float 5s ease-in-out infinite}.drift{animation:drift 8s ease-in-out infinite}.pulse{animation:pulse 3s ease-in-out infinite}.spin{animation:spin 12s linear infinite}.bounce{animation:bounce 2.8s ease-in-out infinite}@keyframes float{50%{transform:translateY(-18px)}}@keyframes drift{50%{transform:translate(34px,-18px)}}@keyframes pulse{50%{transform:scale(1.08)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes bounce{50%{transform:translateY(-22px)}}.resize{position:absolute;width:16px;height:16px;right:-8px;bottom:-8px;border-radius:50%;background:#fff;border:3px solid #7b3fc4;cursor:nwse-resize}.deco{font-size:48px}.media-object{position:absolute;z-index:0}.media-object img,.media-object video{width:100%;height:100%;object-fit:cover}.media-object.pan img,.media-object.pan video{animation:pan 14s ease-in-out infinite alternate}.media-object.zoom img,.media-object.zoom video{animation:zoom 12s ease-in-out infinite alternate}.media-object.mirrorX{transform:scaleX(-1)}.media-object.mirrorY{transform:scaleY(-1)}.media-object.tilt3d img,.media-object.tilt3d video{animation:tilt 10s ease-in-out infinite alternate}.controlCard{background:#231c2d;border-radius:10px;padding:10px;margin:8px 0}.controlCard .row{display:grid;grid-template-columns:1fr 1fr;gap:7px}.controlCard textarea{min-height:78px;resize:vertical}.miniButtons{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.danger{border-color:#8c4056!important;background:#351826!important}.checkline{display:flex!important;align-items:center;justify-content:space-between;gap:10px}.checkline input{width:auto;margin-top:0}.saved div{padding:8px 0;border-bottom:1px solid #3c2e49;display:flex;align-items:center;justify-content:space-between;gap:10px}.how ol{padding-left:20px}.how li{margin:8px 0}@media(max-width:1050px){.workspace{grid-template-columns:1fr}.previewPanel{position:static}.checkgrid{grid-template-columns:1fr 1fr}}@media(max-width:650px){.page{padding:14px}.hero{display:block}.checkgrid,.grid2{grid-template-columns:1fr}.buttonrow{grid-template-columns:1fr}.hero h1{font-size:34px}.formatPick{flex-direction:column}}
.editor details:not([open]) .inside{display:none}input[type="color"]{height:42px;padding:4px!important;cursor:pointer}.version{margin:0;color:#b78cff;font-size:12px}.tiny{width:auto!important;padding:5px 10px!important;margin:0!important}
.previewGrid{display:grid;grid-template-columns:1fr;gap:16px;align-items:start}.previewGrid.both{grid-template-columns:minmax(0,16fr) minmax(0,9fr);gap:14px;align-items:start}.previewCard{border:2px solid transparent;border-radius:12px;padding:9px;background:#120e18;min-width:0;cursor:pointer}.previewCard.active{border-color:#b56cff;box-shadow:0 0 0 2px #6c35a944}.previewCard[hidden]{display:none}.formatHead{display:flex;justify-content:space-between;gap:10px;padding:0 2px 8px;color:#d9cbe7;font-size:12px}.previewCard .stage{width:100%}.previewCard .stage.format-v{max-height:none}.previewGrid.both #stageV{max-height:66vh;margin:auto}@media(max-width:1050px){.previewGrid.both{grid-template-columns:minmax(0,16fr) minmax(0,9fr);gap:10px}.previewGrid.both #stageV{max-height:none;width:100%}}

/* v24 live dual-preview behavior */
.previewGrid.both .previewCard{display:block!important}.previewGrid.both #cardH{grid-column:1}.previewGrid.both #cardV{grid-column:2}.previewGrid.both .stage{min-width:0}.workspace.bothMode .previewPanel{position:static}.previewCard.active .formatHead{color:#fff}.previewCard.active .formatHead strong::after{content:" — EDITING";color:#b56cff;font-size:.9em}.previewCard:not(.active){opacity:.88}.previewCard:not(.active):hover{opacity:1}

/* v25 compact full-site preview workspace */
.page{max-width:1900px;padding:24px 28px 38px}
.workspace{grid-template-columns:minmax(340px,420px) minmax(0,1fr);gap:18px}
.previewPanel{padding:14px;min-width:0}
.previewGrid{width:100%;align-items:start}
.previewGrid.both{grid-template-columns:minmax(500px,1fr) minmax(230px,300px);gap:14px;align-items:start}
.previewCard{padding:8px;min-width:0}
.previewCard .stage{margin-inline:auto}
.previewGrid.both #stageH{width:100%;max-height:500px}
.previewGrid.both #stageV{width:auto;height:min(500px,62vh);max-height:500px;aspect-ratio:9/16}
.previewGrid:not(.both) .previewCard:not([hidden]){max-width:1100px;margin-inline:auto}
.previewGrid:not(.both) #stageH{width:100%;max-height:620px}
.previewGrid:not(.both) #stageV{width:auto;height:min(620px,72vh);max-height:620px;aspect-ratio:9/16}
.workspace.bothMode .previewPanel{position:sticky;top:12px}
@media(max-width:1250px){
 .workspace{grid-template-columns:340px minmax(0,1fr)}
 .previewGrid.both{grid-template-columns:minmax(420px,1fr) minmax(205px,255px);gap:10px}
 .previewGrid.both #stageV{height:min(450px,58vh)}
}
@media(max-width:980px){
 .workspace{grid-template-columns:1fr}
 .previewPanel{position:static!important}
 .previewGrid.both{grid-template-columns:minmax(0,1fr) minmax(180px,240px)}
 .previewGrid.both #stageV{height:min(420px,55vh)}
}
@media(max-width:720px){
 .previewGrid.both{grid-template-columns:1fr}
 .previewGrid.both #cardH,.previewGrid.both #cardV{grid-column:1}
 .previewGrid.both #stageV{height:min(520px,68vh)}
}


/* v26 corrected preview sizing — replaces the broken thumbnail rules */
.workspace{grid-template-columns:360px minmax(0,1fr);gap:18px;width:100%}
.previewPanel{width:100%;min-width:0;padding:14px;overflow:visible}
.previewGrid{display:grid;width:100%;min-width:0;gap:14px;align-items:start;justify-items:stretch}
.previewCard{box-sizing:border-box;width:100%;min-width:0;max-width:none!important;margin:0!important;justify-self:stretch}
.previewCard[hidden]{display:none!important}
.previewGrid:not(.both){grid-template-columns:minmax(0,1fr)}
.previewGrid:not(.both) .previewCard:not([hidden]){display:block;width:100%;max-width:none;margin:0}
.previewGrid:not(.both) #cardH{width:100%}
.previewGrid:not(.both) #stageH{display:block;width:100%;height:auto;max-height:none;aspect-ratio:16/9}
.previewGrid:not(.both) #cardV{width:min(430px,100%);justify-self:center}
.previewGrid:not(.both) #stageV{display:block;width:100%;height:auto;max-height:none;aspect-ratio:9/16}
.previewGrid.both{grid-template-columns:minmax(0,1fr) 320px;gap:14px;width:100%;align-items:start}
.previewGrid.both #cardH{grid-column:1;width:100%;min-width:0}
.previewGrid.both #cardV{grid-column:2;width:320px;max-width:100%;justify-self:end}
.previewGrid.both #stageH{display:block;width:100%;height:auto;max-height:none;aspect-ratio:16/9}
.previewGrid.both #stageV{display:block;width:100%;height:auto;max-height:none;aspect-ratio:9/16}
.workspace.bothMode .previewPanel{position:sticky;top:12px}
@media(max-width:1350px){
 .workspace{grid-template-columns:330px minmax(0,1fr)}
 .previewGrid.both{grid-template-columns:minmax(0,1fr) 270px}
 .previewGrid.both #cardV{width:270px}
}
@media(max-width:1050px){
 .workspace{grid-template-columns:1fr}
 .previewPanel{position:static!important}
 .previewGrid.both{grid-template-columns:minmax(0,1fr) 250px}
 .previewGrid.both #cardV{width:250px}
}
@media(max-width:760px){
 .previewGrid.both{grid-template-columns:1fr}
 .previewGrid.both #cardH,.previewGrid.both #cardV{grid-column:1;width:100%;justify-self:stretch}
 .previewGrid.both #cardV{width:min(420px,100%);justify-self:center}
}

.selectedCard{outline:2px solid var(--primary);box-shadow:0 0 0 1px rgba(255,255,255,.05),0 0 16px rgba(150,90,255,.25)}
.flash{animation:flashCard .9s ease}
@keyframes flashCard{0%{transform:scale(1)}30%{transform:scale(1.01);box-shadow:0 0 0 1px rgba(255,255,255,.05),0 0 20px rgba(150,90,255,.45)}100%{transform:scale(1)}}

.canvas-object{touch-action:none;user-select:none;-webkit-user-select:none;cursor:move}.canvas-object .resize{touch-action:none;cursor:nwse-resize}.text-position,.text-position *{pointer-events:auto}

.previewActions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.tinyAction{width:auto!important;padding:9px 12px!important;margin:0!important;font-weight:700;background:#2c2340;border:1px solid #7a58a8;border-radius:10px;cursor:pointer}.tinyAction:hover{background:#3a2b54}.canvas-object.selected{outline:2px solid rgba(255,255,255,.3);outline-offset:2px}.itemDelete{position:absolute;top:4px;right:4px;width:22px;height:22px;padding:0!important;margin:0!important;border-radius:6px;border:1px solid rgba(255,255,255,.65);background:rgba(18,14,24,.9);color:#fff;font:700 16px/20px Arial,Helvetica,sans-serif;display:grid;place-items:center;cursor:pointer;z-index:40;box-shadow:none;opacity:.9}.itemDelete:hover{background:#8b2744;border-color:#fff;transform:none;opacity:1}.canvas-object .itemDelete{opacity:.9}.previewHelp{margin-top:10px}@media(max-width:760px){.previewTop{gap:10px;align-items:flex-start}.previewActions{justify-content:flex-start}}

.canvas-object.text-position,.canvas-object.deco-position,.canvas-object.frame-object{overflow:visible}

/* v38: appearance controls are synced between horizontal and vertical previews; stage background uses the selected background colour. */

.media-object{overflow:hidden;border:1px dashed rgba(255,255,255,.14)}.media-object.selected{outline:2px solid rgba(255,255,255,.3);outline-offset:2px}.media-object img,.media-object video{display:block;width:100%;height:100%}.waveDefs{position:absolute;width:0;height:0;overflow:hidden}

/* v41 stable editor controls */
.editor details[open]{scroll-margin-top:18px}
.editor summary{position:relative;user-select:none}
.editor select{appearance:auto;min-height:42px}
.controlCard input[type="color"]{height:38px;padding:3px!important}
.controlCard select:focus,.controlCard input:focus,.controlCard textarea:focus{outline:2px solid #b56cff;outline-offset:1px}
.controlCard{contain:layout style}


/* v43 — C4TM30W website palette alignment */
:root{
 --site-bg:#0d0b15;
 --site-bg-deep:#08060e;
 --site-panel:#120a1e;
 --site-panel-2:#1a1028;
 --site-panel-3:#24143a;
 --site-border:#312d48;
 --site-border-strong:#483857;
 --site-accent:#955df4;
 --site-accent-2:#7a43e3;
 --site-accent-bright:#b56cff;
 --site-text:#eeedf2;
 --site-muted:#aa9cd8;
 --site-danger:#a13a61;
}
body{background:var(--site-bg);color:var(--site-text)}
.hero{border-bottom-color:var(--site-border)}
.hero p,.note,.licenseBox,.status,.previewHelp{color:var(--site-muted)}
.eyebrow,.version{color:var(--site-accent-bright)!important}
.privacy{border-color:var(--site-border-strong);color:var(--site-text);background:var(--site-panel)}
.step,.editor details,.previewPanel{background:var(--site-panel);border-color:var(--site-border)}
.formatPick label,.checkcard{background:var(--site-panel-2);border:1px solid var(--site-border)}
.inside label,.formatHead{color:var(--site-text)}
.inside select,.inside input,.inside button,button{border-color:var(--site-border-strong);background:var(--site-panel-2);color:var(--site-text)}
.inside select:focus,.inside input:focus,.inside textarea:focus,button:focus{outline:2px solid var(--site-accent);outline-offset:1px}
button:hover{border-color:var(--site-accent);background:var(--site-panel-3)}
#startBuild,#saveScene,#generatePack,.tinyAction{background:linear-gradient(135deg,var(--site-accent),var(--site-accent-2));border-color:var(--site-accent-bright);color:#fff;box-shadow:0 0 18px rgba(149,93,244,.18)}
#startBuild:hover,#saveScene:hover,#generatePack:hover,.tinyAction:hover{background:linear-gradient(135deg,var(--site-accent-bright),var(--site-accent));box-shadow:0 0 22px rgba(149,93,244,.30)}
.licenseBox,.status{background:var(--site-bg-deep);border:1px solid var(--site-border)}
.previewCard{background:var(--site-bg-deep);border-color:transparent}
.previewCard.active{border-color:var(--site-accent);box-shadow:0 0 0 2px rgba(122,67,227,.32)}
.previewCard.active .formatHead strong::after{color:var(--site-accent-bright)}
.controlCard{background:var(--site-panel-2);border:1px solid var(--site-border)}
.selectedCard{outline-color:var(--site-accent);box-shadow:0 0 0 1px rgba(255,255,255,.04),0 0 16px rgba(149,93,244,.28)}
.resize{border-color:var(--site-accent-2)}
.itemDelete{background:var(--site-bg-deep);border-color:var(--site-border-strong)}
.itemDelete:hover{background:var(--site-danger);border-color:#fff}
.danger{border-color:var(--site-danger)!important;background:#2b1320!important}
.saved div{border-bottom-color:var(--site-border)}
.stage{--bg:#0d0b15;--primary:#955df4;--secondary:#7a43e3;--text:#eeedf2;border-color:var(--site-border-strong)}

.howTop ol{margin:14px 0 0;padding-left:24px}.howTop li{margin:9px 0;line-height:1.45}.saveActions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.saveActions button:last-child{background:linear-gradient(135deg,#955df4,#7a43e3);border-color:#aa79ff;font-weight:800}@media(max-width:650px){.saveActions{grid-template-columns:1fr}}

/* v45 compact top guide + collapsible scene selection */
.quickGuide{background:#120a1e;border:1px solid #302442;border-radius:14px;padding:12px 16px;margin-bottom:12px;color:#eeedf2}.quickGuide>div{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:13px}.quickGuide span{color:#955df4}.quickGuide small{display:block;margin-top:6px;color:#aa9cd8;font-size:11px}.outputPicker{padding:0!important;overflow:hidden}.outputPicker>summary{cursor:pointer;list-style:none;padding:16px 18px;font-size:20px;font-weight:800}.outputPicker>summary::-webkit-details-marker{display:none}.outputPicker>summary::before{content:"▸";display:inline-block;margin-right:9px;color:#955df4;transition:transform .15s ease}.outputPicker[open]>summary::before{transform:rotate(90deg)}.outputPicker .stepInside{padding:0 18px 18px}.outputPicker:not([open]) .stepInside{display:none}.outputPicker .checkgrid{margin:14px 0}.outputPicker .formatPick{margin-top:10px}.outputPicker #startBuild{margin-top:2px}@media(max-width:700px){.quickGuide>div{gap:6px}.quickGuide span{display:none}}

/* v46 human-readable top instructions */
.quickGuide h2{margin:0 0 10px;font-size:20px;line-height:1.2;color:var(--site-text)}
.quickGuide .quickSteps{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;line-height:1.45}
.quickGuide .quickSteps>span:nth-child(even){color:var(--site-accent)}
.quickGuide .quickSteps b{color:var(--site-accent-bright)}
@media(max-width:700px){.quickGuide .quickSteps{display:grid;grid-template-columns:1fr;gap:5px}.quickGuide .quickSteps>span:nth-child(even){display:none}}

/* v47: human layout — scene selection belongs in the left editor column */
.editor>.outputPicker{margin:0;background:var(--site-panel);border:1px solid var(--site-border);border-radius:16px;overflow:hidden}
.editor>.outputPicker>summary{padding:16px 18px;font-size:16px;line-height:1.25}
.editor>.outputPicker .stepInside{padding:0 16px 16px}
.editor>.outputPicker .stepInside>p{margin:0 0 10px;color:var(--site-muted);font-size:12px;line-height:1.4}
.editor>.outputPicker .formatPick{display:grid;grid-template-columns:1fr;gap:7px;margin:8px 0}
.editor>.outputPicker .formatPick label{padding:9px 10px;margin:0}
.editor>.outputPicker .checkgrid{display:grid;grid-template-columns:1fr;gap:7px;margin:10px 0}
.editor>.outputPicker .checkcard{padding:9px 10px}
.editor>.outputPicker #startBuild{margin-top:4px}
.quickGuide{padding:16px 18px}
.quickGuide h2{font-size:22px;margin-bottom:12px}
.quickGuide .quickSteps{font-size:14px;line-height:1.55;gap:9px}
.quickGuide small{font-size:12px;line-height:1.45;margin-top:8px}
@media(max-width:1050px){.editor>.outputPicker .formatPick{grid-template-columns:repeat(3,minmax(0,1fr))}.editor>.outputPicker .checkgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.editor>.outputPicker .formatPick,.editor>.outputPicker .checkgrid{grid-template-columns:1fr}.quickGuide h2{font-size:20px}.quickGuide .quickSteps{font-size:13px}}

/* v48 — C4TM30W creator branding and original header font */
h1,h2,.editor summary,.outputPicker summary,.quickGuide h2,.siteFooter strong,.creatorCard strong{font-family:Scratchmeow,Inter,Segoe UI,Arial,sans-serif;letter-spacing:.025em;font-weight:400}
/* site/interface headers only: always uppercase in Scratchmeow */
h1,h2,.editor summary,.outputPicker summary,.quickGuide h2,.siteFooter strong,.creatorCard strong,.previewTop strong,.formatHead strong,.hero .eyebrow,.version{text-transform:uppercase}
.hero h1{font-size:52px;line-height:.95}.editor summary,.outputPicker summary{font-size:19px}.quickGuide h2{font-size:27px;margin:0 0 12px}
.creatorCard{min-width:280px;border:1px solid var(--site-border,#3a2c52);border-radius:14px;padding:14px 18px;background:linear-gradient(145deg,#120d1d,#1a1028);display:flex;flex-direction:column;align-items:flex-end;gap:4px;color:#eeedf2;box-shadow:0 0 20px rgba(149,93,244,.12)}
.creatorCard strong{font-size:23px;color:#fff}.creatorCard span{font-size:13px;color:#c7b8ec}.creatorCard small{margin-top:4px;color:#887da8}
.siteFooter{margin-top:24px;border:1px solid var(--site-border,#3a2c52);border-radius:16px;background:#100b19;padding:18px 20px;display:flex;justify-content:space-between;gap:20px;align-items:center;color:#aa9cd8}
.siteFooter>div:first-child{display:flex;flex-direction:column;gap:4px}.siteFooter strong{font-size:24px;color:#fff}.siteFooter span{font-size:12px}.footerLinks{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.footerLinks a{color:#d8c8ff;text-decoration:none;border:1px solid #493267;border-radius:9px;padding:7px 10px;background:#171021;font-size:12px}.footerLinks a:hover{border-color:#955df4;color:#fff;background:#221433}
@media(max-width:800px){.creatorCard{align-items:flex-start;min-width:0;margin-top:14px}.siteFooter{align-items:flex-start;flex-direction:column}.footerLinks{justify-content:flex-start}.hero h1{font-size:44px}}

/* v50 media interaction safety */
.media-object{z-index:3;touch-action:none;cursor:move;overflow:hidden}
.media-object img,.media-object video{pointer-events:none;user-select:none;-webkit-user-drag:none}
.media-object .itemDelete,.media-object .resize{pointer-events:auto}

/* v53 visible alignment */
.masterAlign{margin-top:14px;padding:12px;border:1px solid #4a315f;border-radius:14px;background:#181020}.masterAlign>strong{display:block;margin-bottom:5px}.alignRow{display:grid;grid-template-columns:90px repeat(3,minmax(0,1fr));gap:7px;align-items:center;margin-top:8px}.alignRow span{font-weight:700;color:#d7cce4}.alignRow button{width:100%}@media(max-width:650px){.alignRow{grid-template-columns:1fr}.alignRow span{margin-top:4px}}

/* v54 guide-line alignment controls */
.masterAlign .guideAlign{display:grid;grid-template-columns:90px repeat(7,minmax(92px,1fr));gap:7px;align-items:center}.masterAlign .guideAlign span{font-weight:700}.masterAlign .guideAlign button{min-height:38px;padding:7px 9px;font-size:12px}@media(max-width:1200px){.masterAlign .guideAlign{grid-template-columns:1fr 1fr}.masterAlign .guideAlign span{grid-column:1/-1}}

/* v55 — compact guide controls + align selected item to another item */
.masterAlign{overflow:hidden}
.alignSection{margin-top:12px;padding-top:10px;border-top:1px solid #3e2c51}
.alignSection>b{display:block;margin-bottom:8px;color:#efe7f8}
.alignCompact{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.alignCompact button{width:100%;min-width:0;margin:0;padding:8px 7px;font-size:11px;white-space:normal;line-height:1.2}
.objectAlign label{margin:0 0 9px!important}
.objectAlign select{width:100%;margin-top:5px}
.objectButtons{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:560px){.alignCompact,.objectButtons{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v56 reset controls */
.resetActions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.resetActions button{min-width:0}.resetActions .danger{border-color:#8c4056;background:#351826}@media(max-width:620px){.resetActions{grid-template-columns:1fr}}

/* v323: matching disclosure arrows and concise visual guide */
.outputPicker>summary::before{font-family:Arial,sans-serif;font-size:16px;line-height:1;vertical-align:.04em;color:#fff;margin-right:10px;transform-origin:center}
.outputPicker[open]>summary::before{transform:rotate(90deg)}
.quickGuide .guideLines{display:grid;gap:5px;font-size:12px;line-height:1.38}.quickGuide .guideLines p{margin:0;color:#ddd3e8}.quickGuide .guideLines b{color:#fff}.quickGuide small{margin-top:9px}

/* v324: when Both is selected, always keep horizontal and vertical visible together on desktop/tablet. */
@media (min-width:761px){
  .workspace.bothMode{grid-template-columns:minmax(300px,360px) minmax(0,1fr)!important}
  .previewGrid.both{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(180px,280px)!important;gap:12px!important}
  .previewGrid.both #cardH,.previewGrid.both #cardV{display:block!important;grid-row:1!important;min-width:0!important}
  .previewGrid.both #cardH{grid-column:1!important;width:100%!important}
  .previewGrid.both #cardV{grid-column:2!important;width:100%!important;max-width:280px!important;justify-self:end!important}
  .previewGrid.both #stageH,.previewGrid.both #stageV{display:block!important;width:100%!important;height:auto!important;max-height:none!important}
}

/* v328: canvas resize handles stay clickable; text/decor symbols do not steal pointer input */
.canvas-object>.text-motion{pointer-events:none}.canvas-object>.resize{pointer-events:auto!important;z-index:40}.canvas-object>.itemDelete{pointer-events:auto!important;z-index:41}.deco-position{min-width:24px;min-height:24px}

/* Reliable, finger-friendly sliders on desktop and mobile. */
input[type="range"]{min-height:44px;touch-action:pan-y;cursor:pointer;-webkit-tap-highlight-color:transparent}
input[type="range"]::-webkit-slider-runnable-track{height:8px;border-radius:999px;background:#382747}
input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:28px;height:28px;margin-top:-10px;border-radius:50%;border:3px solid #fff;background:#9b55ef;box-shadow:0 0 0 2px #6e2eb8}
input[type="range"]::-moz-range-track{height:8px;border-radius:999px;background:#382747}
input[type="range"]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;border:3px solid #fff;background:#9b55ef;box-shadow:0 0 0 2px #6e2eb8}
@media(max-width:680px){input[type="range"]{min-height:52px}.controlPair{align-items:center}.canvas-object .resize{width:26px;height:26px;right:-13px;bottom:-13px;z-index:999}}


/* v345 — all maker headings use C4TM30W Scratchmeow5 in uppercase */
h1,h2,h3,h4,h5,h6,
.headerBand h1,.hero h1,.quickGuide h2,
.panel > h2,.panel > h3,.panel h2,.panel h3,
.sectionTitle,.section-title,.editorTitle,.editor-title,
.previewTitle,.preview-title,.modeTitle,.mode-title,
details > summary,.accordionTitle,.accordion-title,
.eyebrow,.version,.badge,.pill,
.modeChoiceTitle,.modeChoiceTitle strong,
.livePreviewTitle,.studioTitle{
  font-family:'Scratchmeow5',Inter,'Segoe UI',Arial,sans-serif !important;
  font-weight:400 !important;
  text-transform:uppercase !important;
  letter-spacing:.01em;
}