/* A floating coach, not a cursor replacement. Controls stay clickable. */
#truesize-guide { position:fixed; inset:0; z-index:1000; pointer-events:none; }
#truesize-guide[hidden] { display:none; }
.guide-veil { display:none; position:absolute; inset:0; background:#0b0c1980; backdrop-filter:blur(3px); }
.guide-welcome .guide-veil { display:block; pointer-events:auto; }
.guide-spotlight {
 position:fixed; border:2px solid #c6b5ff; border-radius:12px;
 box-shadow:0 0 0 5px #b8a1ff22,0 0 0 200vmax #080c142b,0 0 28px #b9a4ff50;
 transition:left .36s ease,top .36s ease,width .36s ease,height .36s ease;
}
.guide-hint .guide-spotlight { box-shadow:0 0 0 5px #b8a1ff22,0 0 28px #b9a4ff50; }
.guide-pointer { position:fixed; width:44px; height:48px; transform:translate(-5px,-4px); transition:left .48s cubic-bezier(.22,1,.36,1),top .48s cubic-bezier(.22,1,.36,1); }
.guide-pointer svg { width:44px; height:48px; display:block; overflow:visible; filter:drop-shadow(0 3px 5px #0e0c2455); animation:guide-point 2.8s ease-in-out infinite; }
.guide-tap { position:absolute; left:-10px; top:-10px; width:28px; height:28px; border:2px solid #d4c6ff; border-radius:50%; animation:guide-tap 2.8s ease-out infinite; }
.guide-card {
 position:fixed; pointer-events:auto; width:340px; max-width:calc(100vw - 24px);
 max-height:calc(100dvh - 24px); overflow:auto; box-sizing:border-box; padding:22px;
 border:1px solid #bdaaff65; border-radius:18px; color:#f2effb;
 background:linear-gradient(145deg,#303046fa,#191d2cfc 70%);
 box-shadow:0 18px 60px #080b184d,inset 0 1px 0 #ffffff15;
 font:14px/1.6 'DM Sans',sans-serif; animation:guide-appear .22s ease-out;
}
.guide-card-top,.guide-card-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.guide-eyebrow { color:#bcafeb; font-size:9px; font-weight:800; letter-spacing:1.7px; }
.guide-close { flex:none; display:grid; place-items:center; width:28px; height:28px; padding:0; border:1px solid #ffffff20; border-radius:50%; background:#ffffff08; color:#d6cdea; font-size:20px; line-height:1; }
.guide-card #guide-title { margin:14px 0 9px; font:750 23px/1.2 Manrope,sans-serif; color:#fff; letter-spacing:-.65px; outline:none; }
.guide-card #guide-description { margin:0 0 20px; color:#c4c2d3; font-size:13px; line-height:1.75; }
.guide-progress { display:flex; gap:4px; margin-top:16px; }
.guide-progress span { height:3px; flex:1; border-radius:4px; background:#ffffff15; }
.guide-progress .done { background:linear-gradient(90deg,#bca9ff,#b3e9dc); }
.guide-actions { display:flex; justify-content:flex-end; gap:8px; }
.guide-actions button { min-height:38px; border-radius:10px; padding:8px 13px; font:700 12px/1.4 'DM Sans',sans-serif; cursor:pointer; }
.guide-primary { border:1px solid #c8b8ff; background:linear-gradient(130deg,#d5c9ff,#a9d9d0); color:#242239; }
.guide-secondary { border:1px solid #ffffff26; background:#ffffff05; color:#dcd5ec; }
.guide-actions button:hover,.guide-close:hover { filter:brightness(1.13); }
.guide-card button:focus-visible { outline:3px solid #c5b4ff; outline-offset:3px; }
.guide-counter { color:#a19aaf; font-size:10px; font-variant-numeric:tabular-nums; }
.guide-welcome .guide-card { left:50%; top:50%; transform:translate(-50%,-50%); width:390px; padding:26px; }
.guide-welcome .guide-spotlight,.guide-welcome .guide-pointer { display:none; }
.guide-welcome-art { position:relative; height:100px; margin-top:12px; overflow:hidden; border-radius:12px; background:radial-gradient(ellipse at 40% 40%,#8270b538,transparent 65%); }
.guide-welcome-art svg { position:absolute; width:48px; height:52px; left:calc(50% - 24px); top:19px; transform:rotate(-12deg); filter:drop-shadow(0 5px 8px #0006); animation:guide-point 3s ease-in-out infinite; }
.guide-orbit { position:absolute; width:155px; height:52px; border:1px solid #b8a4f94a; border-radius:50%; left:calc(50% - 77px); top:20px; transform:rotate(-18deg); }
.guide-welcome-chip { position:absolute; bottom:2px; left:0; right:0; text-align:center; font-size:8px; letter-spacing:2px; color:#b1a7cf; }
.compare-page .comparison-help { display:inline-flex; align-items:center; gap:7px; min-height:34px; padding:7px 11px; margin-left:8px; border:1px solid var(--line); border-radius:8px; background:var(--surface2); color:var(--green); font-size:11px; font-weight:650; cursor:pointer; }
.comparison-help svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; }
@keyframes guide-point { 0%,40%,100%{translate:0 0} 55%{translate:-3px -3px} 64%{translate:0 0} }
@keyframes guide-tap { 0%,40%{scale:.3;opacity:0} 57%{scale:.6;opacity:.75} 86%,100%{scale:1.8;opacity:0} }
@keyframes guide-appear { from{opacity:0} to{opacity:1} }
@media(max-width:480px) { .guide-card{padding:18px}.guide-card #guide-title{font-size:21px}.guide-card #guide-description{font-size:12px}.guide-pointer{width:36px}.guide-pointer svg{width:36px;height:40px}.compare-page .comparison-help{margin:8px 0 0} }
@media(prefers-reduced-motion:reduce) { html.compare-document{scroll-behavior:auto}.guide-pointer,.guide-spotlight{transition:none}.guide-pointer svg,.guide-tap,.guide-welcome-art svg,.guide-card{animation:none}.guide-tap{opacity:.4} }