@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;600;700&family=Instrument+Serif&display=swap";:root{color:#eeeae0;font-synthesis:none;background:#0b0e10;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,select,textarea{font:inherit;color:#f2efe8;background:#171c20;border:1px solid #343b40;border-radius:8px}button{cursor:pointer;padding:9px 13px}button:hover{border-color:#75818a}.primary{color:#160d08;background:#df7d45;border-color:#df7d45;font-weight:700}header{background:#111518;border-bottom:1px solid #282e32;justify-content:space-between;align-items:center;height:82px;padding:0 26px;display:flex}h1,h2{margin:0;font-family:Instrument Serif,serif;font-weight:400}h1{font-size:31px}h2{font-size:24px}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:#879098;font-size:10px;font-weight:700}.actions{align-items:center;gap:8px;display:flex}.status{color:#8f989e;margin-right:8px;font-size:11px}.workspace{grid-template-columns:minmax(380px,42%) 1fr;min-height:calc(100vh - 82px);display:grid}.panel{background:#121619;border-right:1px solid #282e32;max-height:calc(100vh - 82px);padding:23px;overflow:auto}.panel>h2{margin:22px 0 10px}.panel>label,.control-grid label,.colors label{color:#b3babd;gap:6px;margin-bottom:13px;font-size:12px;font-weight:600;display:grid}.panel input:not([type=file]):not([type=range]):not([type=color]),.panel select,.panel textarea{outline:none;width:100%;padding:10px 11px}.panel textarea{resize:vertical}.panel small,.muted{color:#788187;font-size:10px;line-height:1.45}.tabs{grid-template-columns:repeat(3,1fr);gap:6px;margin:22px 0;display:grid}.tabs button{text-transform:capitalize}.tabs .active{color:#160d08;background:#df7d45;border-color:#df7d45;font-weight:700}.control-grid,.colors{grid-template-columns:1fr 1fr;gap:10px;display:grid}.control-grid input{accent-color:#df7d45;width:100%}.colors input{width:100%;height:38px}.stage{background:radial-gradient(circle at 55% 5%,#382117 0,#0000 30%),#0b0e10;max-height:calc(100vh - 82px);padding:28px;overflow:auto}.stage-head{justify-content:space-between;align-items:end;margin-bottom:17px;display:flex}.stage-head h2{margin-top:3px;font-size:29px}.toggle{color:#a4aaad;font-size:11px}.toggle input{accent-color:#df7d45;margin-right:7px}.cover{background:#191e22;border:1px solid #353c41;border-radius:12px;padding:18px;box-shadow:0 28px 70px #0008}.cover svg{background:#111;width:100%;height:auto;display:block}.stage>p{text-align:center;color:#757e83;font-size:10px}.modal-backdrop{z-index:20;background:#050708de;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{background:#151a1e;border:1px solid #3d464c;border-radius:15px;width:min(760px,100%);max-height:90vh;padding:25px;overflow:auto;box-shadow:0 30px 90px #000}.modal-title,.modal-actions{justify-content:space-between;align-items:center;gap:10px;display:flex}.modal-title h2{font-size:30px}.movie-search{grid-template-columns:1fr auto;gap:8px;margin:20px 0;display:grid}.movie-search input{padding:11px}.results{grid-template-columns:repeat(3,1fr);gap:8px;max-height:370px;display:grid;overflow:auto}.result{text-align:left;grid-template-columns:52px 1fr;align-items:center;gap:9px;padding:7px;display:grid}.result.selected{background:#282018;border-color:#df7d45}.result img,.placeholder{object-fit:cover;background:#242b30;border-radius:4px;width:52px;height:76px}.placeholder{color:#788187;place-items:center;font-size:9px;display:grid}.result strong,.result small{display:block}.result small{color:#879097;margin-top:5px}.modal-actions{justify-content:flex-end;margin-top:18px}.modal-actions small{color:#7f888e;margin-right:auto}.error{color:#ffd9dd;background:#55252a;border-radius:8px;padding:10px;font-size:12px}.section-row{border-top:1px solid #30373c;border-bottom:1px solid #30373c;justify-content:space-between;align-items:center;gap:12px;margin:18px 0;padding:14px 0;display:flex}.section-row>div{gap:3px;display:grid}.section-row strong{font-size:12px}.inline-actions{grid-auto-flow:column;gap:6px!important;display:flex!important}.rating-fields{grid-template-columns:1fr 1fr;gap:10px;display:grid}.rating-fields label{color:#b3babd;gap:6px;margin-bottom:13px;font-size:12px;font-weight:600;display:grid}.slot-input{grid-template-columns:1fr auto;align-items:end;gap:8px;margin-bottom:13px;display:grid}.slot-input label{color:#b3babd;gap:6px;font-size:12px;font-weight:600;display:grid}.slot-input button{margin-bottom:1px}.slot-actions{gap:6px;display:flex}.placement{border:1px solid #30373c;border-radius:8px;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 15px;padding:10px;display:grid}.placement legend{color:#8d969b;padding:0 5px;font-size:10px}.placement legend button{margin-left:5px;padding:2px 6px;font-size:9px}.placement label{color:#929ba0;gap:4px;font-size:10px;display:grid}.placement input{accent-color:#df7d45;width:100%}.section-toggles{border:1px solid #30373c;border-radius:8px;grid-template-columns:1fr 1fr;gap:8px;margin:15px 0;padding:12px;display:grid}.section-toggles legend{color:#8d969b;padding:0 5px;font-size:10px}.section-toggles label{color:#a8b0b4;font-size:11px}.section-toggles input{accent-color:#df7d45}.warning{color:#ffd4b9;background:#542d1f;border-radius:7px;margin:-5px 0 15px;padding:9px 10px;font-size:11px;line-height:1.4}.project-list{gap:8px;display:grid}.project-row{grid-template-columns:1fr auto;gap:8px;display:grid}.project-open{text-align:left;gap:4px;display:grid}.project-open small{color:#879097}.danger{background:#382126;border-color:#77454b}.cloud-modal{width:min(650px,100%)}.library-toolbar{align-items:center;gap:12px;margin:18px 0;display:flex}.library-toolbar span{color:#8e979d;font-size:11px}.logo-grid{grid-template-columns:repeat(4,1fr);gap:9px;min-height:170px;max-height:45vh;display:grid;overflow:auto}.library-logo{background:#101417;border:1px solid #3b4348;border-radius:7px;min-width:0;position:relative}.library-logo.selected{border-color:#df7d45;box-shadow:inset 0 0 0 2px #df7d45}.library-logo>button:first-child{background:0 0;border:0;gap:6px;width:100%;font-size:10px;display:grid;overflow:hidden}.logo-image{background:repeating-conic-gradient(#293036 0 25%,#1b2024 0 50%) 50%/12px 12px;place-items:center;height:75px;display:grid}.logo-image img{max-width:92%;max-height:62px}.logo-delete{background:#15191de8;border-radius:50%;width:24px;height:24px;padding:0;position:absolute;top:4px;right:4px}.logo-modal{width:min(780px,100%)}.preview-controls{justify-items:end;gap:9px;display:grid}.view-tabs{flex-wrap:wrap;justify-content:flex-end;gap:5px;display:flex}.view-tabs button{text-transform:capitalize;padding:6px 9px;font-size:10px}.view-tabs button.active{color:#160d08;background:#df7d45;border-color:#df7d45}.case-presentation{perspective:1200px;place-items:center;min-height:min(68vh,700px);display:grid;position:relative}.case-object{height:min(64vh,660px);aspect-ratio:var(--panel-ratio);transform-style:preserve-3d;filter:drop-shadow(28px 24px 20px #0009);position:relative;transform:rotateY(-22deg)rotateX(1.5deg)}.case-face{backface-visibility:hidden;background:#111;position:absolute;overflow:hidden}.case-face svg,.single-case-face svg{width:100%;height:100%;display:block}.case-front{border:7px solid #151719;border-radius:5px;inset:0;transform:translateZ(5px)}.case-spine{width:calc(var(--spine-ratio) * 100%);transform-origin:100%;border:6px solid #151719;border-right:0;height:100%;top:0;right:100%;transform:rotateY(-72deg)}.case-blue .case-front,.case-blue .case-spine{border-color:#17669c}.case-vhs .case-front,.case-vhs .case-spine{border-width:10px;border-color:#252525;border-radius:9px}.single-case-face{height:min(66vh,680px);aspect-ratio:var(--panel-ratio);border:7px solid #17191b;border-radius:5px;overflow:hidden;box-shadow:0 28px 65px #000a}.case-presentation.spine .single-case-face{aspect-ratio:var(--spine-aspect);border-width:5px}.case-presentation.back .single-case-face{transform:rotateY(3deg)}.case-presentation.front .single-case-face{transform:rotateY(-3deg)}.case-presentation.case-blue .single-case-face{border-color:#17669c}.case-presentation.case-vhs .single-case-face{border-width:10px;border-color:#252525;border-radius:9px}.case-shadow{z-index:-1;filter:blur(16px);background:#0009;border-radius:50%;width:min(45vw,430px);height:35px;position:absolute;bottom:5%}.export-source{width:10px;height:10px;position:fixed;top:0;left:-10000px;overflow:hidden}.case-presentation.interactive{perspective:1400px}.case-viewport{perspective:1400px;touch-action:none;cursor:grab;place-items:center;display:grid;position:absolute;inset:48px 0 28px}.case-viewport:active{cursor:grabbing}.interactive .case-object{--case-depth:18px;height:min(57vh,590px);aspect-ratio:var(--panel-ratio);transform-style:preserve-3d;filter:drop-shadow(28px 24px 20px #0009);will-change:transform;position:relative;transform:scale(1)rotateY(-24deg)rotateX(-5deg)}.case-blue .case-object{--case-depth:16px;--shell:#17669c;--shell-dark:#0d4167}.case-black .case-object{--case-depth:20px;--shell:#17191b;--shell-dark:#08090a}.case-vhs .case-object{--case-depth:42px;--shell:#282828;--shell-dark:#0b0b0b}.interactive .case-face,.case-shell{backface-visibility:hidden;position:absolute}.interactive .case-face{border:7px solid var(--shell,#17191b);background:#111;border-radius:5px;overflow:hidden}.interactive .case-spine{width:var(--case-depth);border-width:5px 3px;border-right:3px solid var(--shell);transform-origin:0;height:100%;transform:translateZ(calc(var(--case-depth) / 2)) rotateY(-90deg);top:0;left:0;right:auto}.case-opening{width:var(--case-depth);transform-origin:100%;height:100%;transform:translateZ(calc(var(--case-depth) / 2)) rotateY(90deg);background:linear-gradient(90deg,var(--shell-dark),var(--shell),var(--shell-dark));border-radius:3px;top:0;right:0}.case-opening span{background:#fff2;height:2px;position:absolute;left:20%;right:20%;box-shadow:0 1px #0008}.case-opening span:first-child{top:9%}.case-opening span:nth-child(2){top:50%}.case-opening span:nth-child(3){bottom:9%}.case-top,.case-bottom{width:100%;height:var(--case-depth);background:linear-gradient(var(--shell),var(--shell-dark));left:0}.case-top{transform-origin:top;transform:translateZ(calc(var(--case-depth) / 2)) rotateX(90deg);top:0}.case-bottom{transform-origin:bottom;transform:translateZ(calc(var(--case-depth) / 2)) rotateX(-90deg);bottom:0}.case-gloss{z-index:2;pointer-events:none;transform:translateZ(calc(var(--case-depth) / 2 + 1px));background:linear-gradient(112deg,#fff2 0%,#fff0 25% 70%,#fff1 100%);border-radius:2px;position:absolute;inset:7px}.interactive.case-vhs .case-face{border-width:10px;border-color:var(--shell);border-radius:9px}.case-vhs .case-gloss{background:linear-gradient(105deg,#fff2,#fff0 32%,#fff1 78%,#fff0);border-radius:5px;inset:10px}.case-toolbar{z-index:4;gap:6px;display:flex;position:absolute;top:8px;right:8px}.case-toolbar button{padding:6px 9px;font-size:10px}.case-toolbar button.active{color:#160d08;background:#df7d45;border-color:#df7d45}.case-hint{z-index:3;font-size:10px;position:absolute;color:#91999e!important;margin:0!important;bottom:5px!important}.interactive .case-object{--case-depth:36px;transform:scale(1)rotateY(28deg)rotateX(-5deg)}.interactive .case-spine{width:calc(var(--spine-ratio) * 100%);transform-origin:100%;transform:translateZ(calc(var(--case-depth) / 2)) rotateY(-90deg);backface-visibility:visible;left:auto;right:100%}.case-blue .case-object{--case-depth:34px}.case-black .case-object{--case-depth:38px}.case-vhs .case-object{--case-depth:88px}.interactive .case-face,.interactive .case-face>*{backface-visibility:hidden}.interactive .case-front{transform:translateZ(calc(var(--case-depth) / 2));inset:0}.interactive .case-back{transform:rotateY(180deg) translateZ(calc(var(--case-depth) / 2));inset:0}.interactive .case-spine{width:var(--case-depth);transform-origin:50%;height:100%;transform:translateX(-50%) rotateY(-90deg) translateZ(var(--case-half-width));backface-visibility:hidden;top:0;left:50%;right:auto}.interactive .case-opening{width:var(--case-depth);transform-origin:50%;height:100%;transform:translateX(-50%) rotateY(90deg) translateZ(var(--case-half-width));top:0;left:50%;right:auto}.interactive .case-top,.interactive .case-bottom{width:100%;height:var(--case-depth);transform-origin:50%;top:50%;bottom:auto;left:0}@media (width<=800px){header{align-items:flex-start;gap:12px;height:auto;min-height:82px;padding:16px}.actions{flex-wrap:wrap;justify-content:flex-end}.status{text-align:right;width:100%}.workspace{grid-template-columns:1fr}.panel,.stage{border:0;max-height:none}.stage{min-height:60vh}.results{grid-template-columns:1fr 1fr}.logo-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=520px){.actions{justify-content:flex-start}.status{text-align:left}.results,.control-grid{grid-template-columns:1fr}.stage{padding:16px}.stage-head{display:block}.toggle{margin-top:10px;display:block}.logo-grid{grid-template-columns:repeat(2,1fr)}}.interactive .case-object{filter:none}.interactive .case-back,.interactive .case-back>*,.interactive .case-spine,.interactive .case-spine>*,.interactive .case-opening{backface-visibility:visible}.interactive.case-blue .case-object{--case-depth:52px}.interactive.case-black .case-object{--case-depth:58px}.interactive.case-vhs .case-object{--case-depth:112px}.interactive .case-front{width:100%;height:100%;transform:translate(-50%, -50%) translateZ(calc(var(--case-depth) / 2));inset:50% auto auto 50%}.interactive .case-back{width:100%;height:100%;transform:translate(-50%, -50%) rotateY(180deg) translateZ(calc(var(--case-depth) / 2));inset:50% auto auto 50%}.interactive .case-spine{width:var(--case-depth);transform-origin:50%;height:100%;transform:translate(-50%, -50%) rotateY(-90deg) translateZ(var(--case-half-width));inset:0 auto auto 50%}.interactive .case-opening{width:var(--case-depth);transform-origin:50%;height:100%;transform:translate(-50%, -50%) rotateY(90deg) translateZ(var(--case-half-width));inset:0 auto auto 50%}.interactive .case-top,.interactive .case-bottom{width:100%;height:var(--case-depth);transform-origin:50%;inset:50% auto auto 0}.interactive .case-top{transform:translate(-50%, -50%) rotateX(90deg) translateZ(var(--case-half-height))}.interactive .case-bottom{transform:translate(-50%, -50%) rotateX(-90deg) translateZ(var(--case-half-height))}.interactive .case-face,.interactive.case-vhs .case-face{border:0;border-radius:0}.interactive .case-spine{border:0}.interactive .case-gloss,.interactive.case-vhs .case-gloss{border-radius:0;inset:0}