:root{--blue:#0072bc;--ink:#142f44;--paper:#faf9f5}*{box-sizing:border-box}html,body,#pano{width:100%;height:100%;margin:0}body{font:15px Arial,sans-serif;color:var(--ink);background:#142f44}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:0;border-radius:12px;padding:13px 18px;background:var(--paper);color:var(--ink);box-shadow:0 4px 24px #001b3530;font-weight:700}button:hover{background:#e2f1fa}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #009ff0;outline-offset:3px}[hidden]{display:none!important}.brand{position:absolute;top:24px;right:24px;background:var(--paper);padding:20px 26px;border-radius:18px;box-shadow:0 8px 32px #001b3540;border-top:4px solid var(--blue)}.brand strong{display:block;color:var(--blue);font-size:30px;letter-spacing:-1px}.brand span{display:block;letter-spacing:3px;font-size:11px;margin-top:7px}.powered{position:absolute;top:24px;left:24px;padding:12px 16px;background:var(--paper);border-radius:14px}.powered img{width:115px;display:block}.powered small{display:block;font-size:10px;margin-bottom:6px;letter-spacing:1px}.actions{position:absolute;bottom:26px;left:24px;display:flex;gap:9px;flex-wrap:wrap}.actions .primary{background:var(--blue);color:white}.tools{position:absolute;right:24px;bottom:26px;display:flex;gap:8px}.status{position:absolute;bottom:86px;left:24px;background:#142f44db;color:white;border-radius:20px;padding:8px 14px;font-size:12px;pointer-events:none}.panel{position:absolute;left:24px;bottom:94px;width:min(420px,calc(100% - 48px));max-height:calc(100% - 210px);background:var(--paper);border-radius:18px;box-shadow:0 16px 64px #00182b60;overflow:auto;padding:22px}.panel header{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel h2{font-size:21px;margin:0}.close{padding:7px 12px;font-size:23px;box-shadow:none}.panel p{line-height:1.6;color:#496276}.panel input,.panel select{padding:13px;border:1px solid #cbd7df;border-radius:10px;background:white;width:100%;margin:8px 0}.result{display:block;text-align:left;width:100%;margin:7px 0;box-shadow:none;border:1px solid #e0e5e8;background:white;line-height:1.4}.result small{display:block;font-weight:400;color:#597285}.strip{position:absolute;left:24px;right:24px;bottom:94px;background:var(--paper);padding:14px;border-radius:18px;box-shadow:0 10px 45px #00182b50}.strip header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.thumbs{display:flex;gap:10px;overflow:auto;padding:3px}.thumbs button{flex:0 0 115px;padding:0;overflow:hidden;border:3px solid transparent;box-shadow:none;background:white}.thumbs button.active{border-color:var(--blue)}.thumbs img{width:109px;height:68px;object-fit:cover;display:block}.thumbs span{display:block;font-size:11px;padding:8px}.toast{position:absolute;top:140px;left:50%;transform:translateX(-50%);background:var(--paper);padding:14px 20px;border-radius:12px;box-shadow:0 5px 20px #0004;max-width:85%;z-index:30}.preview-label{position:absolute;top:130px;left:24px;background:#fff;padding:8px;border-radius:8px;font-size:12px}@media(max-width:640px){.brand{top:12px;right:12px;padding:12px 15px}.brand strong{font-size:23px}.brand span{font-size:8px;letter-spacing:2px}.powered{top:12px;left:12px;padding:10px}.powered img{width:80px}.actions{left:12px;right:12px;bottom:max(14px,env(safe-area-inset-bottom));gap:6px}.actions button{padding:13px 12px;font-size:12px;flex:1}.tools{right:12px;bottom:76px;gap:5px}.tools button{padding:10px 13px}.status{left:12px;bottom:79px;max-width:52%;font-size:11px}.panel{left:12px;width:calc(100% - 24px);bottom:127px;max-height:calc(100% - 245px);padding:16px}.strip{left:12px;right:12px;bottom:127px}.toast{top:115px}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s}}
