.viewer-page{z-index:100;background:var(--dark,#111318) var(--light,#e8ecf0);color:var(--dark,#eef2ff) var(--light,#1a1a2e);position:fixed;inset:0;overflow:hidden}.viewer-topbar{-webkit-backdrop-filter:blur(3px);z-index:10;-webkit-app-region:drag;pointer-events:auto;background:0 0;border-bottom:none;align-items:center;gap:.5rem;padding:.4rem .75rem;display:flex;position:absolute;top:0;left:0;right:0}.viewer-back-btn,.viewer-info-btn{background:var(--dark,rgba(255,255,255,.06)) var(--light,rgba(0,0,0,.04));border:1px solid var(--dark,rgba(255,255,255,.08)) var(--light,rgba(0,0,0,.1));color:var(--dark,#d0d4e0) var(--light,#333);cursor:pointer;text-shadow:var(--dark,0 1px 3px rgba(0,0,0,.7)) var(--light,none);white-space:nowrap;-webkit-app-region:no-drag;font-weight:500;line-height:1.3;transition:background .1s,color .1s}.viewer-back-btn:hover,.viewer-info-btn:hover{background:var(--dark,rgba(255,255,255,.12)) var(--light,rgba(0,0,0,.08));color:var(--dark,#f0f2f8) var(--light,#111)}.viewer-back-btn:active,.viewer-info-btn:active{transform:scale(.96)}.viewer-back-btn{border-radius:.3rem;flex-shrink:0;align-items:center;gap:.2rem;padding:.25rem .5rem;font-size:.75rem;display:inline-flex}.viewer-back-arrow{font-size:.9rem;line-height:1}.viewer-info-btn{border-radius:.3rem;flex-shrink:0;justify-content:center;align-items:center;padding:.25rem .5rem;font-size:.75rem;font-weight:500;line-height:1.3;display:inline-flex}.viewer-info-overlay{z-index:20;background:var(--dark,rgba(18,20,26,.2)) var(--light,rgba(232,236,240,.9));-webkit-backdrop-filter:blur(8px);border:1px solid var(--dark,rgba(255,255,255,.08)) var(--light,rgba(0,0,0,.1));min-width:200px;max-width:340px;text-shadow:var(--dark,0 1px 3px rgba(0,0,0,.75)) var(--light,none);border-radius:.5rem;padding:.75rem 1rem;animation:.15s viewer-info-fade;position:absolute;top:calc(.8rem + 28px);right:.75rem}@keyframes viewer-info-fade{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.viewer-info-close{cursor:pointer;color:var(--dark,rgba(255,255,255,.5)) var(--light,rgba(0,0,0,.4));border-radius:.25rem;padding:.1rem .25rem;font-size:.85rem;line-height:1;transition:color .12s;position:absolute;top:.3rem;right:.4rem}.viewer-info-close:hover{color:var(--dark,#eef2ff) var(--light,rgba(0,0,0,.8))}.viewer-info-row{flex-direction:column;gap:.1rem;padding:.3rem 0;display:flex}.viewer-info-row+.viewer-info-row{border-top:1px solid var(--dark,rgba(255,255,255,.06)) var(--light,rgba(0,0,0,.06));margin-top:.1rem;padding-top:.4rem}.viewer-info-label{text-transform:uppercase;letter-spacing:.04em;color:var(--dark,rgba(255,255,255,.4)) var(--light,rgba(0,0,0,.4));font-size:.68rem;font-weight:600}.viewer-info-value{color:var(--dark,rgba(255,255,255,.85)) var(--light,rgba(0,0,0,.8));word-break:break-all;font-size:.85rem}.viewer-info-path{color:var(--dark,rgba(255,255,255,.6)) var(--light,rgba(0,0,0,.55));font-family:Monaco,Menlo,Courier New,monospace;font-size:.75rem}.viewer-toolbar{scrollbar-width:none;flex:1;align-items:center;gap:.25rem;min-width:0;display:flex;overflow:auto hidden}.viewer-toolbar::-webkit-scrollbar{display:none}#viewer-toolbar.v3d-toolbar,#viewer-toolbar .v3d-toolbar{all:unset;align-items:center;gap:.25rem;display:flex}#viewer-toolbar .v3d-toolbar-section{box-shadow:none;backdrop-filter:none;pointer-events:auto;background:0 0;border:none;align-items:center;gap:.15rem;padding:0;display:flex}#viewer-toolbar .v3d-btn{background:var(--dark,rgba(255,255,255,.06)) var(--light,rgba(0,0,0,.04));border:1px solid var(--dark,rgba(255,255,255,.08)) var(--light,rgba(0,0,0,.1));color:var(--dark,#d0d4e0) var(--light,#333);cursor:pointer;white-space:nowrap;text-shadow:var(--dark,0 1px 3px rgba(0,0,0,.7)) var(--light,none);border-radius:.3rem;align-items:center;gap:.3rem;padding:.25rem .5rem;font-size:.75rem;font-weight:500;line-height:1.3;transition:background .1s,color .1s;display:inline-flex}#viewer-toolbar .v3d-btn:hover{background:var(--dark,rgba(255,255,255,.12)) var(--light,rgba(0,0,0,.08));color:var(--dark,#f0f2f8) var(--light,#111)}#viewer-toolbar .v3d-btn:active{transform:scale(.96)}#viewer-toolbar .v3d-btn.active{background:var(--dark,rgba(120,80,240,.25)) var(--light,rgba(120,80,240,.12));color:var(--dark,#c4b0ff) var(--light,#5b21b6);border-color:var(--dark,rgba(120,80,240,.3)) var(--light,rgba(120,80,240,.25))}#viewer-toolbar .v3d-btn-icon{font-size:.85rem}@media (width<=600px){.viewer-back-label,#viewer-toolbar .v3d-btn-label{display:none}#viewer-toolbar .v3d-btn,.viewer-back-btn,.viewer-info-btn{padding:.25rem .35rem}.viewer-info-overlay{max-width:none;left:.4rem;right:.4rem}}.viewer-loading{background:var(--dark,#111318) var(--light,#e8ecf0);z-index:5;color:var(--dark,rgba(255,255,255,.6)) var(--light,rgba(0,0,0,.55));flex-direction:column;justify-content:center;align-items:center;gap:1rem;font-size:.92rem;display:flex;position:absolute;inset:0}.viewer-spinner{border:3px solid var(--dark,rgba(255,255,255,.08)) var(--light,rgba(0,0,0,.1));border-top-color:var(--dark,#a78bfa) var(--light,#7c3aed);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite viewer-spin}@keyframes viewer-spin{to{transform:rotate(360deg)}}.viewer-error,.viewer-empty{background:var(--dark,#111318) var(--light,#e8ecf0);z-index:5;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.6rem;padding:2rem;display:flex;position:absolute;inset:0}.viewer-error h3,.viewer-empty h3{color:#f87171;margin:0;font-size:1.1rem}.viewer-empty h3{color:#a78bfa}.viewer-error p,.viewer-empty p{color:var(--dark,rgba(255,255,255,.55)) var(--light,rgba(0,0,0,.55));max-width:32rem;margin:0;font-size:.88rem;line-height:1.5}.viewer-empty a{color:#a78bfa;cursor:pointer;text-decoration:underline}.viewer-empty code{background:var(--dark,rgba(255,255,255,.08)) var(--light,rgba(0,0,0,.06));border-radius:.25rem;padding:.1rem .35rem;font-size:.82rem}.viewer-retry-btn{background:var(--dark,rgba(255,255,255,.08)) var(--light,rgba(0,0,0,.06));border:1px solid var(--dark,rgba(255,255,255,.12)) var(--light,rgba(0,0,0,.1));color:var(--dark,#eef2ff) var(--light,#1a1a2e);cursor:pointer;border-radius:.35rem;margin-top:.5rem;padding:.4rem 1rem;font-size:.82rem;transition:background .12s}.viewer-retry-btn:hover{background:var(--dark,rgba(255,255,255,.15)) var(--light,rgba(0,0,0,.12))}.viewer-canvas-container{position:absolute;inset:0;overflow:hidden}.viewer-canvas-container canvas{display:block;width:100%!important;height:100%!important}