:root{--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-top: env(safe-area-inset-top, 0px);--primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%)}*{-webkit-tap-highlight-color:transparent}body{background:url(/JP_building.jpeg) center/cover no-repeat fixed;font-family:Inter,system-ui,sans-serif;margin:0;padding:0;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.glass{background:#ffffff26;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.3);box-shadow:0 8px 32px #0000001a}.page{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.page.active{opacity:1;visibility:visible}.action-card{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2);border-radius:1.5rem;padding:1.5rem;color:#fff;display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;transition:all .3s ease;min-height:120px}.action-card:hover,.action-card:active{background:#ffffff2e;border-color:#fff6;transform:translateY(-2px);box-shadow:0 12px 24px #0003}@media (max-width: 768px){.action-card{padding:1.25rem;min-height:100px}}.context-bar{position:sticky;top:0;z-index:100;background:var(--primary-gradient);color:#fff;padding:.75rem 1rem;display:flex;align-items:center;justify-content:space-between;box-shadow:0 4px 20px #0000004d;min-height:60px}@media (min-width: 768px){.context-bar{padding:1rem 1.5rem;min-height:68px}}.breadcrumb{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:13px;font-weight:500;flex:1;min-width:0}@media (min-width: 768px){.breadcrumb{gap:.75rem;font-size:15px}}.breadcrumb-back{display:flex;align-items:center;gap:.4rem;padding:.4rem .75rem;background:#ffffff26;border:1px solid rgba(255,255,255,.25);border-radius:.5rem;color:#fff;cursor:pointer;transition:all .2s;white-space:nowrap}@media (min-width: 768px){.breadcrumb-back{gap:.5rem;padding:.5rem 1rem;border-radius:.75rem}}.breadcrumb-back:hover,.breadcrumb-back:active{background:#ffffff40;transform:translate(-2px)}.breadcrumb-items{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;min-width:0}@media (min-width: 768px){.breadcrumb-items{gap:.5rem}}.breadcrumb-item{padding:.4rem .75rem;background:#fff3;border-radius:.5rem;font-weight:600;white-space:nowrap}@media (min-width: 768px){.breadcrumb-item{padding:.5rem 1rem;border-radius:.75rem}}.breadcrumb-separator{opacity:.6;font-size:16px}@media (min-width: 768px){.breadcrumb-separator{font-size:18px}}.context-actions{display:flex;gap:.5rem;align-items:center}@media (min-width: 768px){.context-actions{gap:.75rem}}.cast-btn-top{display:flex;align-items:center;gap:.4rem;padding:.4rem .75rem;background:#fff3;border:2px solid rgba(255,255,255,.3);border-radius:.5rem;color:#fff;font-weight:600;font-size:13px;cursor:pointer;transition:all .2s;white-space:nowrap}@media (min-width: 768px){.cast-btn-top{gap:.5rem;padding:.5rem 1.25rem;border-radius:.75rem;font-size:14px}}.cast-btn-top:hover,.cast-btn-top:active{background:#ffffff4d;transform:scale(1.05)}.cast-btn-top.active{background:#ef4444cc;border-color:#ffffff80;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.8}}.icon-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#ffffff26;border:1px solid rgba(255,255,255,.25);border-radius:.5rem;color:#fff;cursor:pointer;transition:all .2s}@media (min-width: 768px){.icon-btn{width:44px;height:44px;border-radius:.75rem}}.icon-btn:hover,.icon-btn:active{background:#ffffff40}.viewer-layout{display:flex;height:calc(100vh - 60px);overflow:hidden}@media (min-width: 768px){.viewer-layout{height:calc(100vh - 68px)}}.floor-selector{width:140px;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-left:1px solid rgba(255,255,255,.1);padding:1rem .75rem;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem;-webkit-overflow-scrolling:touch}@media (min-width: 768px){.floor-selector{width:200px;padding:1.5rem 1rem;gap:1rem}}.floor-selector-title{font-size:12px;font-weight:700;color:#ffffffb3;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem}@media (min-width: 768px){.floor-selector-title{font-size:14px;margin-bottom:.5rem}}.floor-buttons{display:flex;flex-direction:column;gap:.4rem}@media (min-width: 768px){.floor-buttons{gap:.5rem}}.floor-btn{padding:.6rem .75rem;background:#ffffff1a;border:2px solid transparent;border-radius:.5rem;color:#fff;font-weight:600;font-size:12px;cursor:pointer;transition:all .2s;text-align:left}@media (min-width: 768px){.floor-btn{padding:.75rem 1rem;border-radius:.75rem;font-size:14px}}.floor-btn:hover,.floor-btn:active{background:#ffffff2e;transform:translate(-4px)}.floor-btn.active{background:#6366f1cc;border-color:#fff6;box-shadow:0 4px 12px #6366f166}.view-container{flex:1;position:relative;overflow:hidden;background:#0000004d}.view-wrapper{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center;padding:1rem;transform-origin:center center;transition:transform .3s ease}@media (min-width: 768px){.view-wrapper{padding:2rem}}.main-image{max-width:100%;max-height:100%;object-fit:contain;border-radius:.5rem;-webkit-user-select:none;user-select:none;pointer-events:none;display:block}@media (min-width: 768px){.main-image{border-radius:1rem}}.polygon-overlay{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;width:100%;height:100%;pointer-events:none}.polygon-overlay polygon{fill:#62d462cb;stroke:#00a700;stroke-width:2;cursor:pointer;pointer-events:auto;transition:all .2s}.polygon-overlay polygon:hover,.polygon-overlay polygon:active{fill:transparent;stroke-width:3}.direction-buttons{position:absolute;top:.5rem;right:.5rem;display:flex;gap:.4rem;flex-wrap:wrap;max-width:180px;z-index:10}@media (min-width: 768px){.direction-buttons{top:1rem;right:1rem;gap:.5rem;max-width:300px}}.dir-btn{padding:.5rem 1rem;background:#ffffffe6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:2px solid rgba(255,255,255,.5);border-radius:9999px;font-weight:800;font-size:12px;color:#1f2937;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #00000026}@media (min-width: 768px){.dir-btn{padding:.75rem 1.25rem;font-size:14px}}.dir-btn:hover,.dir-btn:active{background:#fff;transform:translateY(-2px);box-shadow:0 6px 16px #0003}.zoom-controls{position:absolute;bottom:.5rem;right:.5rem;display:flex;gap:.4rem;z-index:10}@media (min-width: 768px){.zoom-controls{bottom:1rem;right:1rem;gap:.5rem}}.zoom-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#ffffffd9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.5);border-radius:.5rem;font-weight:800;font-size:18px;cursor:pointer;transition:all .2s;color:#1f2937}@media (min-width: 768px){.zoom-btn{width:44px;height:44px;border-radius:.75rem;font-size:20px}}.zoom-btn:hover,.zoom-btn:active{background:#fff;transform:scale(1.1)}.controls-sidebar{position:fixed;top:0;right:-100vw;width:90vw;max-width:380px;height:100vh;background:#0f172af2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-left:1px solid rgba(255,255,255,.1);z-index:200;transition:right .3s ease;overflow-y:auto;-webkit-overflow-scrolling:touch}.controls-sidebar.active{right:0}.controls-content{padding:1.5rem 1rem}@media (min-width: 768px){.controls-content{padding:2rem 1.5rem}}.controls-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid rgba(255,255,255,.1)}@media (min-width: 768px){.controls-header{margin-bottom:2rem}}.close-btn-simple{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:.5rem;color:#fff;cursor:pointer;transition:all .2s}.close-btn-simple:hover,.close-btn-simple:active{background:#fff3}.controls-body{display:flex;flex-direction:column;gap:1.5rem}@media (min-width: 768px){.controls-body{gap:2rem}}.control-section{display:flex;flex-direction:column;gap:1rem}.section-title{font-size:13px;font-weight:700;color:#ffffffb3;text-transform:uppercase;letter-spacing:.05em}@media (min-width: 768px){.section-title{font-size:14px}}.control-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}@media (min-width: 768px){.control-grid{gap:.75rem}}.control-btn{padding:.9rem;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:.75rem;color:#fff;font-weight:600;font-size:13px;cursor:pointer;transition:all .2s;text-align:center}@media (min-width: 768px){.control-btn{padding:1rem;font-size:14px}}.control-btn:hover,.control-btn:active{background:#ffffff26;border-color:#ffffff4d;transform:translateY(-2px)}.control-btn.active{background:#6366f199;border-color:#6366f1cc}.controls-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:199;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}.controls-backdrop.active{opacity:1;visibility:visible}.cast-banner{position:fixed;top:-60px;left:50%;transform:translate(-50%);background:var(--primary-gradient);color:#fff;padding:10px 24px;border-radius:9999px;font-weight:500;font-size:13px;box-shadow:0 4px 20px #0000004d;z-index:150;transition:all .4s ease;max-width:92vw;text-align:center}@media (min-width: 768px){.cast-banner{padding:12px 30px;font-size:14px}}.cast-banner.active{top:calc(14px + var(--safe-top))}.hidden{display:none!important}.flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.min-h-screen{min-height:100vh}@media (hover: none) and (pointer: coarse){button,.action-card,.floor-btn,.control-btn{min-height:44px;min-width:44px}}.fullscreen-btn{position:fixed;bottom:calc(1rem + var(--safe-bottom));left:1rem;width:48px;height:48px;border-radius:50%;background:var(--primary-gradient);border:2px solid rgba(255,255,255,.3);cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 20px #667eea80;transition:all .3s ease;z-index:9999;-webkit-tap-highlight-color:transparent}.fullscreen-btn:hover,.fullscreen-btn:active{transform:scale(1.1);box-shadow:0 6px 30px #667eeab3;background:linear-gradient(135deg,#7c8ff0,#8a5db8)}.fullscreen-btn:active{transform:scale(.95)}.fullscreen-btn svg{width:24px;height:24px;stroke-width:2.5}@media (min-width: 768px){.fullscreen-btn{width:56px;height:56px;bottom:calc(1.5rem + var(--safe-bottom));left:1.5rem}.fullscreen-btn svg{width:26px;height:26px}}@media (max-width: 480px){.fullscreen-btn{width:44px;height:44px}.fullscreen-btn svg{width:20px;height:20px}}