.h360-page{background:#101318;color:#f6f8fb;font:16px/1.5 system-ui,sans-serif;margin:0}.h360-page main{max-width:760px;margin:30px auto;padding:18px}.h360-generator,.h360-player{font:inherit;box-sizing:border-box;max-width:740px;padding:22px;background:#18202a;color:#f7f9fb;border:1px solid #35404d;border-radius:18px}.h360-generator label{display:block;margin:12px 0}.h360-generator input,.h360-generator select{display:block;box-sizing:border-box;max-width:100%;width:100%;padding:10px;border-radius:8px;border:1px solid #778594;background:#fff;color:#101318}.h360-generator video{width:100%;border-radius:10px}.h360-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.h360-generator button,.h360-actions button,.h360-actions a{font:inherit;background:#d9e9ff;color:#111b2a;border:0;border-radius:9px;padding:10px 13px;cursor:pointer;text-decoration:none;display:inline-block}.h360-generator button:disabled{opacity:.5}.h360-stage{max-width:450px;margin:auto;touch-action:none;cursor:grab;user-select:none;outline-offset:5px}.h360-stage canvas{width:100%;height:auto;display:block;border-radius:12px;background:#111}.h360-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.h360-note{font-size:13px;opacity:.8}.h360-player:focus-within{outline-color:#86b7ff}@media(max-width:500px){.h360-fields{grid-template-columns:1fr}.h360-generator,.h360-player{padding:12px}}

/* Human 360 player: single-frame cinematic presentation */
.h360-player{max-width:740px;margin-inline:auto;overflow:hidden}
.h360-stage{width:min(100%,420px);position:relative;aspect-ratio:var(--h360-aspect, 9 / 16);display:grid;place-items:center;overflow:hidden;border-radius:16px;background:#090e16;box-shadow:0 16px 45px #0006;cursor:grab}
.h360-stage:active{cursor:grabbing}
.h360-stage canvas{width:100%;height:100%;object-fit:contain;border-radius:0}
.h360-orbit-controls{margin:16px auto 4px;max-width:450px}
.h360-orbit-controls label{display:flex;justify-content:space-between;gap:12px;font-size:14px}
.h360-orbit-controls input{width:100%;accent-color:#a5cfff;cursor:pointer}
.h360-actions{justify-content:center}.h360-actions button,.h360-actions a{font-size:14px}
.h360-player:fullscreen{display:flex;flex-direction:column;justify-content:center;background:#101318;padding:18px;max-width:none}
.h360-player:fullscreen .h360-stage{max-height:75vh;width:auto;height:75vh}
@media(max-width:500px){.h360-stage{max-width:100%}.h360-actions button,.h360-actions a{flex:1 1 auto;text-align:center}}