/* Shared navigation panel for the property 3D tours. Each viewer may override the --tu-* colors. */
:root{
  --tu-bg:#faf9f4f2;--tu-ink:#26352c;--tu-muted:#617066;--tu-line:#d0d4c9;
  --tu-btn:#fffefb;--tu-accent:#344d3d;--tu-accent-ink:#fff;--tu-radius:10px;
}
#tour-panel{position:fixed;right:20px;top:20px;width:288px;max-height:calc(100dvh - 40px);overflow-y:auto;
  background:var(--tu-bg);color:var(--tu-ink);border:1px solid var(--tu-line);border-radius:14px;
  box-shadow:0 8px 40px #2a33281a;padding:16px 16px 12px;font:13px/1.4 system-ui,-apple-system,sans-serif;z-index:20}
#tour-panel button,#tour-panel select{font:inherit;color:inherit;background:var(--tu-btn);border:1px solid var(--tu-line);
  border-radius:8px;padding:8px 10px;cursor:pointer;min-height:36px}
#tour-panel select{width:100%}
#tour-panel button:focus-visible,#tour-panel select:focus-visible,#tour-panel a:focus-visible,#tour-sheet:focus-visible{outline:3px solid var(--tu-accent);outline-offset:2px}
#tour-panel button[aria-pressed="true"]{background:var(--tu-accent);color:var(--tu-accent-ink);border-color:var(--tu-accent)}
.tu-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.tu-back{flex-basis:100%;font-size:12px;color:var(--tu-accent);text-decoration:none}
.tu-back:hover{text-decoration:underline}
.tu-title{flex:1;font:600 17px Georgia,serif}
.tu-sec{margin-top:14px}
.tu-label{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--tu-muted);margin-bottom:6px}
.tu-sub{display:block;font-size:11px;color:var(--tu-muted);margin:0 0 4px}
.tu-seg{display:flex;border:1px solid var(--tu-line);border-radius:9px;overflow:hidden}
#tour-panel .tu-seg button{flex:1;border:0;border-radius:0;border-right:1px solid var(--tu-line)}
#tour-panel .tu-seg button:last-child{border-right:0}
.tu-chips{display:flex;flex-wrap:wrap;gap:6px}
.tu-chips.dim{opacity:.55}
#tour-panel .tu-primary{width:100%;margin-top:8px;background:var(--tu-accent);color:var(--tu-accent-ink);border-color:var(--tu-accent);font-weight:600}
.tu-pad{display:none;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:8px}
#tour-panel .tu-pad button{padding:8px 4px;font-size:12px}
.tu-walk .tu-exit{display:none;width:100%;margin-top:6px}
.tu-walk.on .tu-pad{display:grid}
.tu-walk.on .tu-exit{display:block}
.tu-walk.on .tu-primary{display:none}
.tu-note{font-size:11px;color:var(--tu-muted);margin:8px 0 0}
.tu-more{margin-top:14px;border-top:1px solid var(--tu-line);padding-top:10px}
.tu-more summary{cursor:pointer;font-weight:600;font-size:12px}
.tu-layers{display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 0}
.tu-layers label{font-size:12px;display:flex;align-items:center;gap:4px;cursor:pointer}
.tu-layers input{accent-color:var(--tu-accent)}
.tu-links{display:flex;flex-direction:column;gap:4px;margin:6px 0}
.tu-links a,.tu-notes a{font-size:12px;color:var(--tu-accent)}
.tu-notes{font-size:11px;line-height:1.55;color:var(--tu-muted)}
.tu-info{font-size:11.5px;line-height:1.55;color:var(--tu-muted);margin:12px 0 4px}
#tour-panel .tu-helpbtn{border:0;background:none;padding:4px 0;min-height:0;color:var(--tu-accent);font-size:12px}
#tour-hint{position:fixed;left:20px;bottom:20px;max-width:min(520px,calc(100vw - 340px));font:11px/1.5 system-ui,sans-serif;
  color:var(--tu-muted);background:var(--tu-bg);padding:7px 11px;border-radius:7px;z-index:10;pointer-events:none}
#tour-sheet{display:none}
#tour-walkbar{display:none}
#tour-help{position:fixed;inset:0;background:#0006;display:grid;place-items:center;z-index:50;padding:16px}
#tour-help[hidden]{display:none}
.tu-card{background:#fff;color:#1d241f;border-radius:14px;padding:20px;max-width:420px;width:100%;font:13px/1.45 system-ui,sans-serif}
.tu-card h2{margin:0 0 10px;font:600 18px Georgia,serif}
.tu-card table{border-collapse:collapse;width:100%}
.tu-card th{text-align:left;padding:5px 12px 5px 0;white-space:nowrap;font-weight:600;vertical-align:top}
.tu-card td{padding:5px 0;color:#4d5a51}
.tu-card .tu-primary{margin-top:14px;width:100%;padding:10px;border-radius:8px;border:0;background:var(--tu-accent);color:var(--tu-accent-ink);font:600 13px system-ui;cursor:pointer}
@media (max-width:699px){
  #tour-panel{left:0;right:0;top:auto;bottom:0;width:auto;max-height:58dvh;border-radius:16px 16px 0 0;padding:14px 16px calc(14px + env(safe-area-inset-bottom))}
  #tour-panel.closed{display:none}
  #tour-panel button,#tour-panel select{min-height:44px}
  #tour-sheet{display:block;position:fixed;right:12px;top:16px;z-index:30;font:600 13px system-ui;padding:10px 14px;min-height:44px;
    border-radius:22px;border:1px solid var(--tu-line);background:var(--tu-bg);color:var(--tu-ink)}
  #tour-hint{left:12px;right:12px;bottom:12px;max-width:none;text-align:center}
  body:has(#tour-panel:not(.closed)) #tour-hint{display:none}
  body.tu-walking #tour-panel.closed~#tour-walkbar{display:block;position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:25;
    background:var(--tu-bg);border:1px solid var(--tu-line);border-radius:14px;padding:8px;font:12px system-ui,sans-serif;color:var(--tu-ink)}
  body.tu-walking #tour-panel.closed~#tour-hint{bottom:96px}
  .tu-bar-stop{text-align:center;color:var(--tu-muted);margin:0 0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .tu-bar-row{display:grid;grid-template-columns:repeat(4,1fr) 44px;gap:5px}
  #tour-walkbar button{min-height:44px;font:12px system-ui;border:1px solid var(--tu-line);border-radius:8px;background:var(--tu-btn);color:var(--tu-ink);padding:4px 2px}
  #tour-walkbar .tu-bar-exit{background:var(--tu-accent);color:var(--tu-accent-ink);border-color:var(--tu-accent)}
}
