:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f1f0eb;background:#171914;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;min-width:320px;overflow:hidden;background:#171914}.viewer-topbar{height:60px;position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(15px,4vw,50px);background:linear-gradient(#171914e8,transparent)}.brand{display:flex;align-items:center;gap:9px;color:#f3f1eb;text-decoration:none;font-size:18px;font-weight:750;letter-spacing:-.9px}.brand-mark{width:25px;height:25px;display:grid;place-items:center;background:#eeeae0;color:#292b24;border-radius:50%;font-size:12px}.brand-dot{color:#d47755}.viewer-tag{display:flex;align-items:center;gap:8px;font-size:8px;font-weight:700;letter-spacing:1.4px;color:#cbc9c1}.viewer-tag i{width:5px;height:5px;border-radius:50%;background:#d47755}.viewer-main{height:100%;display:flex;flex-direction:column}.stage{position:relative;flex:1;min-height:0;width:100%;background:radial-gradient(ellipse at 50% 47%,#3a3c35 0%,#282a24 48%,#1b1d18 100%);overflow:hidden}model-viewer{position:absolute;inset:0;width:100%;height:100%;outline:none;--poster-color:transparent;--progress-bar-color:#d47755;--progress-bar-height:2px}model-viewer[hidden]{display:none}.loading-state,.error-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:25px}.loading-state p{font-size:11px;color:#b9b8b0;margin:16px 0 0}.spinner{width:28px;height:28px;border:1px solid #77786f;border-top-color:#d47755;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-state .error-mark{width:36px;height:36px;border:1px solid #77786f;border-radius:50%;display:grid;place-items:center;color:#d47755;font-size:21px}.error-state h1{font-size:20px;letter-spacing:-.4px;margin:17px 0 6px}.error-state p{font-size:11px;line-height:1.6;color:#aaa99f}.error-state a{margin-top:10px;padding:10px 14px;background:#ece9df;color:#272920;text-decoration:none;font-size:10px;border-radius:3px}.model-title{position:absolute;left:clamp(16px,4vw,52px);top:clamp(73px,11vh,100px);pointer-events:none;text-shadow:0 1px 10px #0007}.model-title .title-kicker{font-size:8px;font-weight:700;letter-spacing:1.5px;color:#d5d1c6}.model-title h1{font-size:clamp(16px,2.5vw,24px);letter-spacing:-.5px;font-weight:600;color:#fff;margin:7px 0 0;max-width:min(70vw,500px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.touch-hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);padding:10px 12px;border-radius:3px;background:#171914bf;border:1px solid #ffffff19;color:#dad8ce;white-space:nowrap;font-size:9px;letter-spacing:.2px;pointer-events:none}.touch-hint span{font-size:13px;margin-right:4px}.viewer-actions{position:absolute;right:clamp(13px,3vw,34px);bottom:19px;display:flex;gap:7px}.viewer-actions button{width:40px;height:40px;border:1px solid #ffffff27;border-radius:3px;background:#171914c7;color:white;font-size:20px;cursor:pointer;touch-action:manipulation}.viewer-actions button:hover{background:#f2efe6;color:#282a23}.loading-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:#ffffff12;opacity:0;transition:opacity .2s}.loading-progress.active{opacity:1}.loading-progress span{display:block;width:0;height:100%;background:#d47755;transition:width .12s}.viewer-footer{height:38px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(15px,4vw,50px);background:#171914;color:#9d9e94;font-size:8px;font-weight:650;letter-spacing:.8px}.viewer-footer i{font-style:normal;color:#ce7554;padding:0 3px}.viewer-footer span:last-child{font-weight:450;letter-spacing:.1px}@media(max-width:600px){.viewer-topbar{height:54px;padding:0 14px}.viewer-tag{font-size:7px}.viewer-footer{height:34px;padding:0 14px;font-size:7px}.viewer-footer span:last-child{display:none}.stage{min-height:0}.model-title{top:68px;left:16px}.touch-hint{bottom:17px;left:14px;transform:none;font-size:8px;padding:9px 10px}.viewer-actions{right:12px;bottom:12px;gap:6px}.viewer-actions button{width:39px;height:39px}.error-state h1{font-size:18px}}@media(max-height:430px) and (orientation:landscape){.viewer-topbar{height:44px}.model-title{top:52px}.viewer-footer{height:28px}.touch-hint{bottom:7px}.viewer-actions{bottom:6px}}

/* Author rules above set display on the state panels, so explicitly hide any
   element carrying the HTML hidden attribute. */
[hidden] { display: none !important; }

/* The model opens in an immersive, full-viewport layout. */
html, body { height: 100%; height: 100dvh; }
.viewer-main { height: 100%; min-height: 100dvh; }
.stage { min-height: 100%; }
.viewer-footer { display: none; }

/* Keep AR separate from the reset/fullscreen dock so the browser's AR affordance
   cannot visually collide with adjacent controls on narrow touch screens. */
.viewer-actions {
  right: max(12px, env(safe-area-inset-right));
  bottom: max(12px, env(safe-area-inset-bottom));
}
.viewer-actions #ar-button {
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  border-radius: 50%;
}
@media (max-width: 380px) {
  .touch-hint {
    bottom: calc(60px + env(safe-area-inset-bottom));
    left: 50%;
    transform: translateX(-50%);
  }
}
.fullscreen-message {
  position: absolute;
  left: 50%;
  bottom: calc(66px + env(safe-area-inset-bottom));
  z-index: 3;
  max-width: min(90vw, 420px);
  padding: 10px 14px;
  transform: translateX(-50%);
  border: 1px solid #ffffff26;
  border-radius: 4px;
  background: #171914ed;
  color: #f1f0eb;
  font-size: 12px;
  line-height: 1.45;
  text-align: center;
  box-shadow: 0 6px 24px #0005;
}
