.viewer{isolation:isolate;background:radial-gradient(circle at 50% 45%,#fffffffa 0 17%,#f5f9f6cc 42%,#0000 68%),linear-gradient(145deg,#e6efe9 0%,#f7f8f2 48%,#d9e6df 100%);grid-template-rows:auto minmax(0,1fr) auto;width:100%;height:100svh;min-height:540px;display:grid;position:relative;overflow:hidden}.viewer:before,.viewer:after{z-index:-1;content:"";border:1px solid #235b4b14;border-radius:50%;width:48vw;height:48vw;position:absolute}.viewer:before{top:-30vw;right:-14vw}.viewer:after{bottom:-34vw;left:-16vw}.viewer__header{z-index:2;padding:calc(18px + env(safe-area-inset-top)) clamp(20px, 4vw, 58px) 14px;justify-content:space-between;align-items:center;display:flex}.brand{color:#1a3a31;align-items:center;gap:10px;display:flex}.brand__mark{object-fit:contain;border-radius:50%;width:34px;height:34px}.brand__text{letter-spacing:.12em;font-size:13px;font-weight:760}.brand__text small{color:#66766f;letter-spacing:.28em;margin-top:2px;font-size:8px;font-weight:600;display:block}.viewer__badge{color:#60716b;letter-spacing:.18em;backdrop-filter:blur(10px);background:#ffffff70;border:1px solid #1c4f4129;border-radius:999px;padding:7px 11px;font-size:9px;font-weight:700}.viewer__stage{min-height:0;position:relative}.viewer__canvas{cursor:grab;touch-action:none;outline:none;width:100%;height:100%;display:block}.viewer__canvas:active{cursor:grabbing}.viewer__status{color:#31443e;text-align:center;backdrop-filter:blur(16px);background:#f8fbf8c7;border:1px solid #1c4f411f;border-radius:18px;flex-direction:column;align-items:center;gap:8px;min-width:210px;padding:22px 26px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 18px 60px #27413814}.viewer__status p,.viewer__status strong{letter-spacing:.04em;margin:5px 0 0;font-size:13px;font-weight:650}.viewer__status>span:last-child{color:#788680;font-size:11px}.viewer__status--error{color:#703e36}.loader{border:2px solid #1f5b4924;border-top-color:#2b735f;border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.viewer__hint{color:#64746e;white-space:nowrap;backdrop-filter:blur(12px);background:#ffffff94;border:1px solid #1e483d1f;border-radius:999px;align-items:center;gap:8px;padding:9px 13px;font-size:10px;animation:.5s both reveal;display:flex;position:absolute;bottom:14px;left:50%;transform:translate(-50%);box-shadow:0 8px 28px #2741380f}.viewer__gesture{color:#2b735f;font-size:15px}@keyframes reveal{0%{opacity:0;transform:translate(-50%,6px)}}.viewer__reset{color:#35544a;font:inherit;cursor:pointer;backdrop-filter:blur(12px);background:#ffffff9e;border:1px solid #1e483d24;border-radius:999px;align-items:center;gap:7px;padding:9px 12px;font-size:10px;font-weight:650;display:flex;position:absolute;top:10px;right:clamp(18px,4vw,56px);box-shadow:0 8px 28px #2741380f}.viewer__reset:hover:not(:disabled){background:#ffffffe6;border-color:#1e483d4d}.viewer__reset:focus-visible{outline-offset:3px;outline:2px solid #2b735f}.viewer__reset:disabled{opacity:.35;cursor:default}.viewer__reset svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:14px;height:14px}.viewer__footer{z-index:2;padding:14px 20px calc(20px + env(safe-area-inset-bottom));text-align:center}.viewer__footer p{color:#244d40;letter-spacing:.2em;margin:0 0 6px;font-size:clamp(10px,2vw,12px);font-weight:720}.viewer__footer span{color:#74827d;letter-spacing:.03em;font-size:10px}@media (width>=760px){.viewer__hint{bottom:18px}.viewer__footer{padding-bottom:24px}}@media (height<=620px){.viewer{min-height:480px}.viewer__header{padding-top:calc(10px + env(safe-area-inset-top));padding-bottom:6px}.viewer__footer{padding-top:8px;padding-bottom:calc(10px + env(safe-area-inset-bottom))}}@media (prefers-reduced-motion:reduce){.viewer__hint{animation:none}}:root{color:#15231f;font-synthesis:none;text-rendering:optimizelegibility;background:#e7eee9;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,main{width:100%;min-width:320px;height:100%;min-height:100%;margin:0}body{min-height:100svh;overflow:hidden}button,canvas{-webkit-tap-highlight-color:transparent}