html,body,#root{width:100%;min-height:100%;margin:0}.app-shell{width:100%;min-height:100vh;min-height:100dvh;min-width:320px;padding:clamp(.5rem,2vw,1.5rem);color:#111827;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at top,#fffffff0,#f4f4f5fa),linear-gradient(180deg,#fafafa,#eceff3)}.app-shell,.app-shell *,.app-shell *:before,.app-shell *:after{box-sizing:border-box}body{overflow-x:hidden}html.is-embedded,body.is-embedded,body.is-embedded #root{min-height:0;height:auto;background:transparent;overflow:hidden}.app-shell--embedded{min-height:0;padding:0;background:transparent}@media (max-width: 480px){.app-shell{padding:max(.35rem,env(safe-area-inset-top)) .35rem max(.5rem,env(safe-area-inset-bottom))}}.app-shell,#root{width:100%}.viewer3d{width:100%;max-width:1120px;margin:0 auto;padding:clamp(.75rem,1.5vw,1.25rem);box-sizing:border-box}.app-shell--embedded .viewer3d{max-width:100%;padding:0}.viewer3d__stage{position:relative;width:100%;height:clamp(320px,58vw,680px);min-height:320px;aspect-ratio:16 / 10;border-radius:20px;overflow:hidden;background:linear-gradient(180deg,#fff,#f4f4f4);box-shadow:0 18px 48px #11182714}.app-shell--embedded .viewer3d__stage{border-radius:0;box-shadow:none}.viewer3d__stage-badge{position:absolute;z-index:2;top:1rem;right:1rem;padding:.55rem .8rem;border-radius:999px;background:#ffffffe6;color:#111827;font-size:.82rem;font-weight:700;letter-spacing:.01em;box-shadow:0 12px 30px #11182714;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none}.viewer3d__canvas{width:100%!important;height:100%!important;display:block}.viewer3d__thumbnails{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-top:1rem}.viewer3d__mobile-nav{display:none}.viewer3d__thumbnail{width:64px;height:64px;object-fit:cover;cursor:pointer;border:2px solid #d1d5db;border-radius:12px;padding:.15rem;background:#fff;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.viewer3d__thumbnail:hover{transform:translateY(-2px)}.viewer3d__thumbnail.is-active{border-color:#ff4d4d;box-shadow:0 10px 18px #ff4d4d2e}@media (max-width: 768px){.viewer3d{padding:.65rem}.app-shell--embedded .viewer3d{padding:0}.viewer3d__stage{height:min(72dvh,clamp(300px,82vw,520px));min-height:300px;aspect-ratio:1 / 1;border-radius:16px}.viewer3d__stage-badge{top:auto;right:auto;left:50%;bottom:.85rem;transform:translate(-50%);width:calc(100% - 1.5rem);max-width:320px;text-align:center;font-size:.78rem}.viewer3d__thumbnails{display:none}.viewer3d__mobile-nav{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;align-items:center;gap:.75rem;margin-top:.9rem;padding:.75rem;border:1px solid rgba(209,213,219,.9);border-radius:18px;background:#fffffff0;box-shadow:0 10px 28px #11182714;touch-action:pan-y;-webkit-user-select:none;user-select:none;max-width:560px;margin-left:auto;margin-right:auto}.viewer3d__mobile-button{width:52px;height:52px;border:0;border-radius:14px;background:#111827;color:#fff;font-size:1.35rem;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:transform .2s ease,background-color .2s ease}.viewer3d__mobile-button:active{transform:scale(.96)}.viewer3d__mobile-status{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.1rem;text-align:center}.viewer3d__mobile-label{color:#111827;font-size:.98rem;font-weight:700}.viewer3d__mobile-count{color:#6b7280;font-size:.82rem}.viewer3d__mobile-hint{color:#ef4444;font-size:.76rem;font-weight:600}.app-shell--embedded .viewer3d__mobile-nav{margin-left:0;margin-right:0;max-width:100%}}@media (max-width: 480px){.viewer3d{padding:.35rem 0 .5rem}.viewer3d__stage{height:min(68dvh,clamp(260px,96vw,420px));min-height:260px;border-radius:14px}.viewer3d__stage-badge{width:calc(100% - 1rem);padding:.5rem .7rem;font-size:.74rem}.viewer3d__mobile-nav{grid-template-columns:48px minmax(0,1fr) 48px;gap:.6rem;padding:.65rem;border-radius:16px}.viewer3d__mobile-button{width:48px;height:48px;border-radius:12px}.viewer3d__mobile-label{font-size:.92rem}.viewer3d__mobile-hint{font-size:.72rem}.app-shell--embedded .viewer3d__stage{min-height:240px}}@media (max-width: 900px) and (orientation: landscape){.viewer3d__stage{height:min(76dvh,420px);aspect-ratio:16 / 9}.viewer3d__mobile-nav{max-width:640px}}