@font-face{font-family:AmoyComic;src:url("./fonts/NotoSansCJKsc-Story.otf") format("opentype");font-display:swap}
.amoy-comic-overlay,.amoy-comic-overlay *{box-sizing:border-box}.amoy-comic-overlay button{font:inherit;cursor:pointer;touch-action:manipulation}
.amoy-comic-overlay{position:fixed;inset:0;z-index:2147483000;background:#080e12;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);font-family:AmoyComic,system-ui,sans-serif;color:#f3e9d0;overscroll-behavior:contain;touch-action:manipulation}
.amoy-comic-bar{display:flex;align-items:center;justify-content:space-between;padding:0 12px;gap:12px;min-height:46px;flex-shrink:0;border-bottom:1px solid #d0b57433}
.amoy-comic-title{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.amoy-comic-overlay button{background:#14272e;color:#ecd6a3;border:1px solid #556364;min-height:44px;min-width:54px;padding:6px 12px;font-size:14px;border-radius:3px}.amoy-comic-overlay button:focus-visible{outline:3px solid #e9b56b;outline-offset:2px}
.amoy-comic-stage{position:relative;flex:1;min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.amoy-comic-stage canvas{display:block;max-width:100%;max-height:100%;touch-action:none}.amoy-comic-loading{position:absolute;padding:20px;background:#12252b;color:#f2d9a6;max-width:90%;font-size:16px}
.amoy-comic-controls{min-height:52px;display:flex;gap:6px;align-items:center;justify-content:center;padding:4px 8px;flex-shrink:0}
.amoy-comic-progress{height:3px;background:#2b373b;flex-shrink:0}.amoy-comic-progress i{height:3px;display:block;background:#ddb976}
.amoy-comic-accessible{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:620px){.scene-grid{grid-template-columns:1fr}.preview-shell{padding:22px 14px}.amoy-comic-controls button{flex:1;padding:6px 3px;min-width:44px;font-size:12px}.amoy-comic-controls{gap:4px}}
@media(orientation:landscape) and (max-height:500px){.amoy-comic-bar{position:absolute;top:calc(8px + env(safe-area-inset-top));right:calc(8px + env(safe-area-inset-right));min-height:44px;width:76px;padding:0;border:0;z-index:2}.amoy-comic-title{display:none}.amoy-comic-bar button{width:76px;min-height:44px;padding:2px 8px}.amoy-comic-controls{position:absolute;top:calc(62px + env(safe-area-inset-top));bottom:calc(8px + env(safe-area-inset-bottom));right:calc(8px + env(safe-area-inset-right));width:76px;flex-direction:column;justify-content:center;gap:6px;padding:0;background:#081216;border-radius:5px;z-index:2}.amoy-comic-controls button{width:76px;flex:0 0 44px;min-height:44px;min-width:58px;font-size:12px}.amoy-comic-progress{height:3px;margin-right:92px}.amoy-comic-stage{margin-right:92px;padding:0}}

/* Host integration: native top layer, no inherited camp rem scaling. */
.amoy-comic-overlay{margin:0;border:0;width:100vw;height:100dvh;max-width:none;max-height:none;font-size:16px}
.amoy-comic-overlay::backdrop{background:#080e12}
.amoy-comic-overlay .amoy-comic-loading[hidden]{display:none}
.comic-fallback{padding:24px;background:#101820;color:#f3e9d0;max-width:90vw}.comic-fallback button{min-height:48px;padding:8px 20px}
@media(max-width:620px){.amoy-comic-controls button{font-size:14px}}
@media(orientation:landscape) and (max-height:500px){.amoy-comic-controls button{font-size:14px}.amoy-comic-controls{justify-content:flex-start;overflow-y:auto}}