.halloween-monster{background:#7746a7!important;color:#fff!important;border-color:#663c91!important}.halloween-deco{background:#e89339!important;color:#302014!important;border-color:#c97423!important}
body:not(.inside-home) .student-actions .halloween-monster,body:not(.inside-home) .student-actions .halloween-deco,body:not(.inside-home) .student-actions button:not([id]){height:29px;min-height:29px;font-size:10px;padding:6px;display:flex;align-items:center;justify-content:flex-start;gap:5px;margin:0}
.halloween-settings{border-top:1px solid #a790ba;border-bottom:1px solid #a790ba;margin:16px 0;padding:10px 0}.halloween-settings h3{font-size:14px;margin:0 0 8px}.halloween-settings p{font-size:12px;line-height:1.5}.halloween-settings button{width:100%}
.halloween-modal{font:14px system-ui,sans-serif;color:#2c3430;border:2px solid #af8ac6;border-radius:18px;background:#fffaf1;max-width:min(760px,96vw);max-height:90dvh;overflow:auto;padding:24px;box-shadow:0 12px 55px #29163866}.halloween-modal::backdrop{background:#29163888}.halloween-modal h2{font-size:24px;margin:0 0 14px}.halloween-modal p{font-size:13px;line-height:1.55}.halloween-modal button{font:inherit;padding:9px 12px;border-radius:8px;border:1px solid #cdb9d7;background:#f8f0fd;color:#302b38;cursor:pointer}.halloween-modal button:disabled{opacity:.5;cursor:wait}.halloween-modal>button{margin:6px}.halloween-modal label{display:grid;gap:6px;margin:12px 0;font-size:13px}.halloween-modal input{max-width:100%;padding:9px;border:1px solid #bcc8b5;border-radius:8px}.halloween-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.halloween-error{color:#a23527;min-height:20px}.halloween-editor{width:760px}.halloween-editor .pixel-main{min-width:0;flex:1}.halloween-editor .pixel-workspace{display:flex;gap:14px;align-items:center}.halloween-editor .pixel-painting{min-width:0}.halloween-editor .pixel-grid{width:100%;height:auto;max-width:100%;touch-action:none;image-rendering:pixelated}.halloween-editor .pixel-preview-box{flex:0 0 90px}.halloween-editor .pixel-preview{max-width:80px}.halloween-editor .pixel-tools{flex:0 0 100px}.pixel-tools .pixel-erase-same{display:flex;align-items:flex-start;gap:5px;font-size:10px;line-height:1.35;margin:3px 0}.pixel-tools .pixel-erase-same input{flex:none;width:16px;height:16px;margin:0;padding:0}.pixel-tools [aria-pressed=true]{outline:2px solid #8c5dac;outline-offset:-2px}
@media(max-width:560px){.halloween-modal{padding:16px}.halloween-modal h2{font-size:21px}.halloween-editor .pixel-tools{flex-basis:76px}.halloween-editor .pixel-preview-box{flex-basis:58px}.halloween-editor .pixel-preview{max-width:52px}.halloween-editor .pixel-workspace{gap:8px}.halloween-editor .pixel-preview-title{font-size:10px}.halloween-editor .pixel-ground{font-size:10px}.halloween-editor .pixel-tools button{width:100%;font-size:10px;padding:7px 4px}}

.pixel-tools .pixel-erase-same.is-disabled{opacity:.45}.pixel-tools .pixel-erase-same input:disabled{cursor:not-allowed}

.halloween-settings .halloween-monster,.halloween-settings .halloween-deco{margin-top:7px}

.monster-manager-row{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #dbcde3}.monster-manager-row canvas{width:48px;height:64px;image-rendering:pixelated;flex:none}.monster-manager-row>div{flex:1;min-width:0;overflow-wrap:anywhere}.monster-manager-row p{margin:3px 0}.monster-manager-row .monster-delete{background:#a83d41;color:white;border-color:#a83d41;flex:none}

.pixel-ground{border:2px solid #cf8c16!important;border-radius:7px;background:#fff1c9!important;color:#654511!important;padding:8px!important;text-align:center;font-size:11px!important;font-weight:600;line-height:1.45;margin:7px 0 0!important}

.pixel-editor .pixel-isometric{background:#edf3ee;border-color:#83977e;border-radius:8px}.pixel-editor:has(.pixel-isometric) .pixel-preview{width:128px;max-width:100%;background:#edf3ee}.pixel-editor:has(.pixel-isometric) .pixel-preview-box{flex-basis:128px}@media(max-width:560px){.pixel-editor:has(.pixel-isometric) .pixel-workspace{flex-direction:column}.pixel-editor:has(.pixel-isometric) .pixel-preview-box{flex-basis:auto;display:flex;align-items:center;gap:8px}.pixel-editor:has(.pixel-isometric) .pixel-preview{width:100px}.pixel-editor:has(.pixel-isometric) .pixel-preview-title{max-width:110px}}

/* V64: the floor, not empty canvas padding, fills the painting area. */
#studio-modal:has(.pixel-isometric),.halloween-editor:has(.pixel-isometric){width:min(1160px,96vw);max-width:96vw}
.pixel-editor:has(.pixel-isometric) .pixel-workspace{align-items:flex-start;justify-content:flex-start;gap:20px}
.pixel-editor:has(.pixel-isometric) .pixel-painting{flex:1 1 0;min-width:0;width:100%}
.pixel-editor .pixel-isometric{display:block;width:100%;max-width:100%;height:auto;border:0;border-radius:0;background:transparent}
.pixel-height-toggle{display:block;margin:8px auto 0;font-size:12px;padding:7px 10px}
.pixel-editor:has(.pixel-isometric) .pixel-preview-box{flex:0 0 112px}
@media(max-width:700px){.pixel-editor:has(.pixel-isometric) .pixel-workspace{flex-direction:column;gap:14px}.pixel-editor:has(.pixel-isometric) .pixel-preview-box{flex-basis:auto;display:flex;align-items:center;gap:10px}.pixel-editor:has(.pixel-isometric) .pixel-preview{width:90px}.pixel-editor:has(.pixel-isometric) .pixel-preview-title{max-width:120px}}
/* V64: zoom changes only the view, never artwork pixels. */
.pixel-viewport{width:100%;overflow:auto;max-height:65vh;overscroll-behavior:contain;scrollbar-gutter:stable}
.pixel-viewport .pixel-grid{display:block;margin-inline:auto;height:auto;max-width:none}
.pixel-editor-zoom{display:grid;gap:5px;margin-top:12px;width:100%}
.pixel-editor-zoom label{font-size:11px;margin:0;display:grid;gap:5px}
.pixel-editor-zoom input[type=range]{width:100%;padding:0;height:22px;cursor:pointer}
.pixel-editor-zoom>div{display:flex;gap:3px;justify-content:center}
.pixel-editor-zoom button{padding:5px 8px!important;font-size:12px!important;min-width:28px}
.pixel-tools button:has(svg){display:flex;align-items:center;justify-content:center;gap:5px}
#studio-modal .dialog-actions,.halloween-editor .halloween-actions{justify-content:flex-end;flex-wrap:wrap}
@media(max-width:700px){.pixel-editor .pixel-preview-box:has(.pixel-editor-zoom){display:grid;grid-template-columns:1fr 90px;align-items:center;width:100%;text-align:left}.pixel-preview-box:has(.pixel-editor-zoom) .pixel-editor-zoom{grid-column:1/-1}.pixel-editor:has(.pixel-isometric) .pixel-preview-title{max-width:none}.pixel-editor-zoom input[type=range]{height:28px}}
#avatar-panel>#save-avatar{display:block;margin-left:auto}
/* V64: only the drawing viewport scrolls; all editing controls stay in the module. */
#studio-modal[open],.halloween-editor[open]{display:flex;flex-direction:column;height:min(940px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);overflow:hidden;padding:18px}
#studio-modal>h2,.halloween-editor>h2{flex:none;margin:0 0 6px}
#studio-modal>label,.halloween-editor>label{flex:none;margin:5px 0}
#studio-modal>.fields{flex:none;gap:10px}#studio-modal>.fields label{margin:4px 0}
#studio-modal>.note,.halloween-editor>p{flex:none;font-size:12px;line-height:1.35;margin:4px 0}
#object-studio,.halloween-editor>.pixel-object-editor{flex:1;min-height:0;margin:10px 0 0}
.pixel-object-editor{align-items:stretch}
.pixel-object-editor .pixel-main{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.pixel-object-editor .pixel-tools{min-height:0;overflow:auto;align-self:stretch}
.pixel-object-editor .pixel-workspace{flex:1;min-height:0;align-items:stretch!important}
.pixel-object-editor .pixel-painting{display:flex;flex:1;min-height:0;overflow:hidden}
.pixel-object-editor .pixel-viewport{height:100%;min-height:0;max-height:none;aspect-ratio:auto!important;scrollbar-gutter:stable}
.pixel-object-editor .pixel-preview-box{flex:0 0 160px!important;min-width:0;overflow:hidden}
.pixel-object-editor .pixel-preview{width:96px!important;max-height:140px;object-fit:contain}
.pixel-object-editor .pixel-dock{order:2;flex:none;display:flex;gap:10px;align-items:center;margin-top:8px}
.pixel-object-editor .pixel-dock .pixel-ground{flex:1;margin:0!important;font-size:10px!important;padding:5px!important}
.pixel-object-editor .pixel-height-toggle{flex:none;margin:0;padding:7px 9px;max-width:170px}
.pixel-object-editor .pixel-frames{order:3;flex:none;margin-top:7px;gap:5px}
.pixel-object-editor .pixel-frames button{padding:6px 8px}
.pixel-object-editor .pixel-main>.note{order:4;flex:none;font-size:10px;line-height:1.3;margin:5px 0 0}
.pixel-save-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin:38px 0 0!important;padding-top:0}
.pixel-save-actions button{width:100%;font-size:12px;padding:9px}
#art-error,.halloween-editor>.halloween-error{flex:none;margin:4px 0;font-size:12px}
@media(max-width:700px){
 #studio-modal[open],.halloween-editor[open]{width:calc(100vw - 12px);max-width:calc(100vw - 12px);height:calc(100dvh - 12px);max-height:calc(100dvh - 12px);padding:10px}
 .pixel-object-editor .pixel-workspace{flex-direction:row!important;gap:8px!important}
 .pixel-object-editor .pixel-preview-box:has(.pixel-editor-zoom){display:block!important;flex-basis:104px!important;width:104px;text-align:center}
 .pixel-object-editor .pixel-preview-title{font-size:10px;max-width:none!important;margin-bottom:4px}
 .pixel-object-editor .pixel-preview{width:64px!important;max-height:80px}
 .pixel-object-editor .pixel-tools{flex-basis:66px!important}.pixel-object-editor .pixel-tools button{font-size:10px;padding:6px 3px}
 .pixel-object-editor .pixel-editor-zoom button{font-size:10px!important;padding:5px!important;min-width:24px}
 .pixel-object-editor .pixel-dock{gap:5px}.pixel-object-editor .pixel-height-toggle{font-size:10px;padding:6px;max-width:120px}
 .pixel-save-actions{margin-top:28px!important}.pixel-save-actions button{padding:7px;font-size:10px}
 .pixel-object-editor .pixel-frames button{font-size:10px;padding:5px 7px}
}
@media(max-height:640px){.halloween-editor>p{font-size:10px;line-height:1.2;margin:2px 0}.pixel-object-editor .pixel-preview{max-height:70px}.pixel-save-actions{margin-top:24px!important}.pixel-object-editor .pixel-main>.note{display:none}}
.pixel-object-editor .pixel-preview-box{display:flex;flex-direction:column;align-items:center;min-height:0}
.pixel-object-editor .pixel-preview-title,.pixel-object-editor .pixel-editor-zoom,.pixel-object-editor .pixel-save-actions{flex:none;width:100%}
.pixel-object-editor .pixel-preview{flex:0 1 auto;min-height:0;height:auto}
@media(max-width:700px){.pixel-object-editor .pixel-preview-box:has(.pixel-editor-zoom){display:flex!important;flex-direction:column!important}}
@media(max-height:640px){
 #studio-modal>label,.halloween-editor>label{display:flex;align-items:center;gap:8px;margin:3px 0}
 #studio-modal input,.halloween-editor>label input{padding:5px 8px;min-height:30px}
 #studio-modal>.fields label{display:flex;align-items:center;gap:5px;font-size:11px}
 #studio-modal>.fields select{padding:4px;min-height:28px}
 #studio-modal>h2,.halloween-editor>h2{font-size:18px}
}