/* Speedometer One User Guide: always light, like Apple's guides. Scoped to body.sog.
   Same pattern as /travelone/css/guide.css. */
:root{color-scheme:light}
.sog{--t:#1d1d1f;--t2:#6e6e73;--a:#0066cc;--rule:#d2d2d7;margin:0;background:#fff;color:var(--t);
font:17px/1.47059 "SF Pro Text",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:-.022em;-webkit-font-smoothing:antialiased}
.sog nav[role=navigation]{background:rgba(251,251,253,.94);border-bottom:1px solid #e8e8ed}
.sog .nav-logo,.sog .nav-back{color:var(--t)}
.sog footer{background:#f5f5f7;color:var(--t2)}.sog footer a{color:var(--a);text-decoration:none}
.sog .skip{position:absolute;left:-9999px}.sog .skip:focus{left:16px;top:16px;z-index:100;background:#fff;padding:8px 12px}
.sog a{color:var(--a);text-decoration:none}.sog a:hover{text-decoration:underline}
.sog a:focus-visible{outline:2px solid var(--a);outline-offset:3px;border-radius:3px}
.sog .layout{max-width:1180px;margin:0 auto;padding:0 22px;display:grid;grid-template-columns:1fr;gap:56px}
@media(min-width:1024px){.sog .layout{grid-template-columns:260px minmax(0,1fr)}}
.sog .sidebar{display:none;font-size:14px;line-height:1.43;padding:40px 0 60px;position:sticky;top:0;align-self:start;max-height:100vh;overflow:auto}
@media(min-width:1024px){.sog .sidebar{display:block}}
.sog .sidebar .sb-title{font-weight:600;font-size:15px;margin:0 0 14px}.sog .sidebar .sb-title a{color:var(--t)}
.sog .sidebar .sb-group{font-weight:600;color:var(--t);margin:18px 0 6px}
.sog .sidebar ul{list-style:none;margin:0;padding:0}.sog .sidebar li a{display:block;padding:4px 0 4px 12px;color:var(--t2);border-left:2px solid transparent}
.sog .sidebar li a[aria-current=page]{color:var(--t);font-weight:600;border-left-color:var(--a)}
.sog .article{max-width:692px;padding:40px 0 96px}
.sog .crumbs{font-size:14px;margin:0 0 8px}
.sog h1{font:600 40px/1.1 "SF Pro Display",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;letter-spacing:0;margin:0 0 14px;color:var(--t)}
.sog .intro{font-size:21px;line-height:1.381;color:var(--t);margin:0 0 28px}
.sog h2{font:600 28px/1.143 "SF Pro Display",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;margin:44px 0 12px;color:var(--t)}
.sog p{margin:0 0 14px}
.sog .steps{padding-left:1.4em;margin:0 0 16px}.sog .steps li{margin:0 0 10px;padding-left:4px}
.sog .anyof{padding-left:1.2em;margin:0 0 16px}.sog .anyof li{margin:0 0 10px}
.sog b{font-weight:600}
.sog .note{border-left:3px solid var(--rule);padding:2px 0 2px 14px;color:var(--t)}
.sog .shot{margin:8px 0 28px;width:240px;border:9px solid #1d1d1f;border-radius:42px;overflow:hidden;background:#000}
.sog .shot img{display:block;width:100%;height:auto}
.sog .seealso{border-top:1px solid var(--rule);margin-top:48px;padding-top:4px}.sog .seealso h2{font-size:21px;margin-top:20px}
.sog .seealso ul{list-style:none;padding:0;margin:0}.sog .seealso li{margin:0 0 8px}
.sog .pager{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--rule);margin-top:40px;padding-top:20px}
.sog .pager a{display:flex;flex-direction:column;font-size:17px}.sog .pager a span{font-size:12px;color:var(--t2);text-transform:uppercase;letter-spacing:.04em}.sog .pager .next{text-align:right}
.sog .toc-group{font-size:21px !important;margin:36px 0 4px !important}
.sog .toclist{list-style:none;padding:0;margin:0}.sog .toclist li{border-top:1px solid #e8e8ed}.sog .toclist a{display:block;padding:12px 0}
.sog .ui{font-weight:600}
@media(max-width:734px){.sog h1{font-size:32px}.sog .intro{font-size:19px}.sog h2{font-size:24px}}

/* Apple Watch screen in a drawn case (CSS only, no device images) */
.sog .watchshot { position:relative; width:200px; padding:13px; border-radius:62px; background:linear-gradient(150deg,#48484a 0%,#1c1c1e 55%,#2c2c2e 100%); box-shadow:0 18px 44px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.10); }
.sog .watchshot img { display:block; width:100%; height:auto; border-radius:49px; background:#000; }
.sog .watchshot::after { content:""; position:absolute; right:-6px; top:62px; width:7px; height:40px; border-radius:0 4px 4px 0; background:linear-gradient(90deg,#3a3a3c,#636366); }
.sog .watchshot::before { content:""; position:absolute; right:-3px; top:122px; width:4px; height:46px; border-radius:0 3px 3px 0; background:#3a3a3c; }
.sog .watchshot { margin:8px 0 28px; }