#tour-nav{background:rgba(32,43,43,.9);border:1px solid rgba(224,231,226,.15);border-radius:8px;box-shadow:0 8px 28px #1114;padding:8px;bottom:20px}
canvas{transition:opacity .18s;touch-action:none}
#tour-nav button{border-radius:3px}
#tour-nav button:focus-visible{outline:2px solid #f8e6ba;outline-offset:3px}
#hint{max-width:none;font-size:12px;color:#eee;background:#263a39b8;padding:8px 14px;border-radius:4px;bottom:90px;left:50%;transform:translateX(-50%);white-space:nowrap;letter-spacing:0}
#loading{background:#1e2929}
#load-enter{border-radius:4px}
#desktop-tip{display:none!important}
#hexu-detail-backdrop{display:none;position:fixed;inset:0;background:rgba(19,28,29,.45);backdrop-filter:blur(5px);z-index:49}
body:has(#detail.open) #hexu-detail-backdrop{display:block}
#detail{left:50%;right:auto;top:50%;transform:translate(-50%,-48%);width:min(1040px,calc(100% - 64px));max-height:calc(100dvh - 64px);padding:40px;background:#f5f6f2;border:1px solid #dce2db;border-radius:8px;box-shadow:0 24px 100px #1115;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s,transform .2s,visibility .2s}
#detail.open{right:auto;opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,-50%)}
#detail .x{top:12px;right:12px;width:36px;height:36px;border:1px solid #d0d9d2;border-radius:50%;background:#f5f6f2;color:#34554b;font-size:26px;line-height:30px}
#dc{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);grid-template-rows:auto auto 1fr;gap:14px 32px;align-items:start}
#detail h3{grid-column:2;grid-row:1;font-size:25px;line-height:1.35;color:#243a33;margin:20px 20px 0 0}
#detail .yr{grid-column:2;grid-row:2;color:#718278;margin:0;font-size:13px}
#detail .img{grid-column:1;grid-row:1/4;aspect-ratio:3/2;background-size:contain;background-repeat:no-repeat;background-color:#e8ece7;margin:0;border-radius:3px}
#detail p{grid-column:2;grid-row:3;color:#485b52;font-size:15px;line-height:1.9;margin:0}
@media(max-width:600px){
  #hint{display:none}
  #tour-nav{bottom:12px;max-width:calc(100vw - 24px);overflow-x:auto}
  #mobile-stick{bottom:94px}
  #detail{width:calc(100% - 24px);max-height:calc(100dvh - 32px);padding:24px}
  #dc{display:flex;flex-direction:column;gap:14px}
  #detail h3{font-size:22px;margin:8px 36px 0 0}
  #detail .yr{order:1}
  #detail .img{order:2;flex:none;width:100%}
  #detail p{order:3;font-size:14px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}#detail{transition:none}}