/* Touch-first review controls and four material finishes. */
.materials{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.materials button{min-height:82px;font-size:10px;padding:9px 2px 6px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.materials i{flex-shrink:0;margin-bottom:7px}.materials .finish-detail{display:block;font-size:8px;margin-top:4px;color:#6a7b92}.materials i.stone{background:radial-gradient(circle at 32% 25%,#7a6769,#564346 70%,#33272a)}.materials i.bronze{background:radial-gradient(ellipse at 30% 26%,#a18a6b 0%,#705237 30%,#503622 65%,#2f211a 100%)}.materials i.gold{background:linear-gradient(135deg,#72501c 0%,#eac264 23%,#fff2bc 33%,#9a6c22 45%,#d4a23c 58%,#ffe8a0 73%,#a47624 100%)}.materials i.silver{background:linear-gradient(135deg,#807d75 0%,#b5b2a8 22%,#e4e2da 40%,#9c9991 58%,#d6d3ca 77%,#a4a198 100%)}.advanced-controls{margin-bottom:16px}.advanced-controls>summary{display:none}.advanced-controls .toggles{margin-bottom:0}.touch-hint{display:none}.viewport.immersive{position:fixed!important;inset:0!important;z-index:1000!important;width:100vw!important;height:100dvh!important;max-height:none!important;min-height:0!important;border-radius:0!important;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}body.viewer-expanded{overflow:hidden}.immersive .stage-actions{top:calc(15px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right))}.immersive .stage-bottom{bottom:calc(20px + env(safe-area-inset-bottom))}.immersive .stage-heading{top:calc(22px + env(safe-area-inset-top))}.immersive #compatibility{top:calc(48px + env(safe-area-inset-top))}
@media(max-width:720px){
 .topbar{height:65px;margin:0 14px}.brand>span:not(.color-logo){font-size:16px}.brand small{font-size:5.5px;letter-spacing:1.45px}.brand .color-logo{width:43px;height:33px}.brand .color-logo img{width:83px;height:83px;left:-18.8px;top:-16.4px}.brand{gap:7px}.help-btn{height:44px;width:44px;border-color:transparent;background:#f1f6ff;font-size:18px;border-radius:50%}
 main{padding:0 12px}.project-heading{margin:0 -12px 13px;padding:17px 17px 23px;min-height:112px}.project-heading:after{height:24px;bottom:-13px}.eyebrow{font-size:7px;letter-spacing:1px}h1{font-size:27px;margin:7px 0 5px}.project-heading p{font-size:10px}.workspace{border-radius:10px;overflow:visible;display:flex;flex-direction:column}.viewport{height:clamp(300px,44svh,430px);min-height:300px;max-height:none;border-radius:10px 10px 0 0;overflow:hidden}.stage-heading{top:17px;left:12px;font-size:7px;letter-spacing:.6px;max-width:calc(100% - 122px)}#compatibility{top:37px;left:12px;font-size:8px;max-width:calc(100% - 108px);line-height:1.4}.stage-actions{top:8px;right:8px;gap:5px}.stage-actions button{width:44px;height:44px;border-radius:9px}.stage-bottom{left:10px;right:10px;bottom:11px}.view-label{font-size:10px}.view-label small{font-size:7px;letter-spacing:.4px}.floating-tools{padding:2px;border-radius:10px}.floating-tools button{height:44px;min-width:44px;padding:0 12px}.floating-tools #reset{font-size:10px;gap:6px}.floating-tools #reset svg{width:16px}.floating-tools #reset span{font-size:0}.floating-tools #reset span:after{content:'Reset';font-size:10px}.touch-hint{display:block;position:absolute;left:12px;top:57px;bottom:auto;transform:none;white-space:nowrap;pointer-events:none;font-size:9px;color:#6a7f99;background:#f0f5fbcc;border-radius:20px;padding:4px 9px}.touch-hint span{margin:0 5px}.viewport:not(.light) .touch-hint{background:#181b20cc;color:#adb8c9}
 .panel{display:flex;flex-direction:column;gap:16px;padding:14px;border-radius:0 0 10px 10px}.panel-title{display:none}.finish-group{order:0}.viewpoint-group{order:1}.control-group>label{font-size:9px;margin-bottom:8px;letter-spacing:.7px}.materials{gap:7px}.materials button{min-height:81px;font-size:11px;border:1px solid #d9e4f2;border-radius:9px;padding:8px 2px}.materials button.selected{border:2px solid #0054e9;padding:7px 1px;background:#eef5ff}.materials i{width:30px;height:30px;margin-bottom:5px}.materials .finish-detail{font-size:8px;margin-top:4px}.view-buttons{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.view-buttons button{min-height:44px;font-size:12px;border-radius:8px}.advanced-controls{order:2;margin:0;border-top:1px solid #d7e1ee;border-bottom:1px solid #d7e1ee;padding:0}.advanced-controls>summary{display:flex;min-height:48px;align-items:center;justify-content:space-between;font-size:12px;font-weight:700;color:#164480;cursor:pointer;list-style:none;gap:10px}.advanced-controls>summary::-webkit-details-marker{display:none}.advanced-controls>summary:after{content:'+';font-size:22px;font-weight:400}.advanced-controls[open]>summary:after{content:'−'}.advanced-controls>summary span{font-size:9px;font-weight:400;color:#60748e;margin-left:auto}.advanced-content{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center;padding:8px 0 15px}.quality select{font-size:12px;min-height:46px;padding:8px}.toggle-row{min-height:44px;font-size:12px}.toggle-row input{width:100%;height:100%;inset:0;cursor:pointer}.toggle-row i{width:35px;height:22px;flex-shrink:0}.toggle-row i:before{width:16px;height:16px}.toggle-row input:checked+i:before{transform:translateX(13px)}.save-view{order:3;min-height:48px;font-size:12px;border-radius:9px;letter-spacing:.3px}.save-hint{order:4;margin:-8px 0 0;font-size:9px}.below-viewer{margin:12px 0 22px}.gesture{display:none}.detail-note{display:block;font-size:9px}.scan-info{padding:22px 0;gap:18px}.scan-info h2{font-size:18px}.scan-info p{font-size:11px}.scan-info .file-note{font-size:10px}footer{padding-left:16px;padding-right:16px;padding-bottom:calc(25px + env(safe-area-inset-bottom))}dialog{max-height:85dvh;overflow:auto;padding:25px}dialog p{font-size:13px}.close-dialog:not(.save-view){width:44px;height:44px;right:5px;top:5px}.viewport.immersive .touch-hint{top:calc(67px + env(safe-area-inset-top));bottom:auto}#toast{width:calc(100vw - 32px);text-align:center;bottom:calc(16px + env(safe-area-inset-bottom));font-size:12px}
}
@media(max-width:360px){.brand>span:not(.color-logo){font-size:14px}.brand small{letter-spacing:1.1px}.stage-bottom{gap:5px}.view-label{font-size:9px}.floating-tools button{padding:0 8px}.advanced-controls>summary span{font-size:8px}.advanced-content{grid-template-columns:1fr}.materials{gap:5px}}
@media(max-width:950px) and (orientation:landscape) and (max-height:520px){.viewport{min-height:280px;height:65svh}.viewport.immersive{height:100dvh!important}.immersive .stage-bottom{bottom:10px}.immersive .touch-hint{display:none}}
