.real-media .media-screen{position:relative;width:100%;aspect-ratio:16/10;background:#050907;overflow:hidden;border-radius:12px}
.generated-media .generated-panel{position:absolute;inset:0}.generated-media .generated-panel img,.generated-media .generated-panel video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:none!important}.generated-media .generated-panel video{opacity:0}.generated-media .generated-panel.has-video video{opacity:1}.generated-media .media-screen{aspect-ratio:4/3;background:#0b1712}.generated-media .media-error{background:#0b1712dd;padding:12px;inset:auto 12px 12px;font-size:11px}.generated-media .media-adjust label{grid-template-columns:80px minmax(0,1fr) 42px}.generated-media .media-kind{font-size:11px}
.media-screen video,.media-screen img{width:100%;height:100%;display:block;object-fit:contain}.media-screen img{object-fit:cover}.real-media [hidden]{display:none!important}
.generated-media .generated-panel:first-child img,.generated-media .generated-panel:first-child video{object-fit:cover}
.media-dial{display:none}
.media-stepper{display:none}
.generated-media[data-console="2"] .media-adjust .media-dial{display:none}
.generated-media[data-console="2"] .media-adjust input{position:absolute;width:1px!important;height:1px!important;clip-path:inset(50%)}
.generated-media[data-console="2"] .media-stepper{display:flex;grid-area:2/1;gap:5px;align-items:center}
.media-stepper button{width:30px;height:38px;border-radius:18px;border:1px solid #718b77;background:linear-gradient(#426750,#193829);color:#e5eada;font-size:22px;box-shadow:0 3px 5px #0004;cursor:pointer;padding:0}
.media-stepper button:active{transform:translateY(2px)}
.generated-media[data-console="2"] .media-buttons .media-play{padding:7px 18px;border-radius:24px}
.generated-media[data-console="2"] .media-buttons .media-play:before,.generated-media[data-console="2"] .media-buttons .media-play:after{display:none}
.generated-media:not([data-console="0"]) .media-adjust{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;background:linear-gradient(135deg,#193d32,#10271f);color:#e1e6d9;padding:20px 14px 12px}
.generated-media:not([data-console="0"]) .media-adjust label{position:relative;display:grid;grid-template-columns:1fr;grid-template-rows:20px 58px 20px;justify-items:center;gap:5px;text-align:center;font-size:10px}
.generated-media:not([data-console="0"]) .media-adjust input{grid-area:2/1;opacity:0;width:58px;height:58px;z-index:2;touch-action:none;cursor:ns-resize}
.generated-media:not([data-console="0"]) .media-adjust output{grid-area:3/1;text-align:center;color:#acc4b5}
.generated-media:not([data-console="0"]) .media-dial{display:block;grid-area:2/1;width:54px;height:54px;border-radius:50%;border:3px solid #718579;background:radial-gradient(circle at 35% 25%,#597366,#172e25 70%);box-shadow:0 4px 8px #0007,inset 0 0 0 3px #233d31;transform:rotate(var(--dial-angle));position:relative}
.media-dial:after{content:"";position:absolute;top:5px;left:22px;width:3px;height:12px;border-radius:3px;background:#dec58c}
.media-adjust input:focus-visible~.media-dial{outline:2px solid #e4c788;outline-offset:4px}
.generated-media:not([data-console="0"]) .media-buttons{grid-column:1/-1;justify-content:center}
.generated-media[data-console="2"] .media-dial{border-radius:12px;border-color:#8c9684;background:linear-gradient(120deg,#6e7969,#263a2e 55%,#15281e)}
.generated-media[data-console="2"] .media-play{position:relative;padding-left:43px;border-radius:6px}
.generated-media[data-console="2"] .media-play:before{content:"";position:absolute;left:12px;top:8px;width:20px;height:12px;border-radius:3px;background:#617368;box-shadow:inset 0 0 0 2px #071c13}
.generated-media[data-console="2"] .media-play:after{content:"";position:absolute;left:14px;top:6px;width:7px;height:17px;border-radius:2px;background:#d5dac9;transform:rotate(-20deg);transition:left .15s,transform .15s}
.generated-media[data-console="2"] .media-play[aria-pressed=true]:after{left:23px;transform:rotate(20deg)}
.media-adjust{padding:16px 4px 8px;display:grid;gap:10px}.media-adjust label{display:grid;grid-template-columns:80px minmax(0,1fr) 42px;align-items:center;gap:12px;font-size:11px}.media-adjust input{width:100%;min-width:0;accent-color:#d7b577;cursor:pointer}.media-adjust output{text-align:right;font-variant-numeric:tabular-nums}.media-buttons{display:flex;gap:8px;margin-top:5px}
.media-buttons button,.media-tabs button{border:1px solid #688275;background:transparent;color:inherit;border-radius:25px;padding:7px 14px;font:inherit;font-size:11px;cursor:pointer}.media-tabs{display:flex;gap:8px;margin-top:16px}.media-tabs button[aria-selected=true]{background:#dfbd79;color:#102d27;border-color:#dfbd79}.media-credit{font-size:10px;opacity:.75;margin-top:8px}.media-credit a{text-decoration:underline;text-underline-offset:3px}.media-error{position:absolute;inset:40% 12px;text-align:center;color:white}.media-buttons button:focus-visible,.media-tabs button:focus-visible{outline:2px solid #dfbd79;outline-offset:3px}
.real-media .media-adjust{padding:16px 18px 8px}.real-media .media-tabs{padding:0 18px}.real-media figcaption{padding:12px 18px 0}.real-media .media-credit{padding:0 18px 16px;line-height:1.6}.media-adjust label{grid-template-columns:72px minmax(0,1fr) 36px;gap:8px}
.real-media .media-tabs{padding-bottom:18px}.editor-shot{position:absolute;inset:0;overflow:hidden;display:grid;place-items:center}.editor-camera{position:relative;width:100%;aspect-ratio:1.5;transform-origin:78% 52%;transition:transform .1s linear}.editor-camera>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.editor-camera .editor-preview{position:absolute;left:71.2%;top:44.5%;width:14%;height:10.2%;object-fit:cover;transform:skewY(-3deg);border:1px solid #111}.editor-playhead{position:absolute;top:62%;height:6%;width:1px;background:#fb6969}.editor-zoom{display:grid;grid-template-columns:1fr 1fr 35px;gap:9px;padding:16px 18px 0;align-items:center;font-size:11px}.editor-zoom input{width:100%;min-width:0;accent-color:#d7b577}.cat-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#050907}.cat-sprite{height:100%;aspect-ratio:1;background-image:url('assets/media/burmese-walk-sheet.png');background-size:400% 300%;background-repeat:no-repeat}
