/* Current feature guides and faithful settings previews. */
.native-app [hidden]{display:none!important}
.native-status{display:flex;align-items:center;justify-content:space-between;padding:0 24px;font-size:14px;color:var(--app-ink)}
.native-status-icons{font-size:12px;letter-spacing:1px}
.native-system-navigation{display:flex;align-items:center;justify-content:space-evenly;background:var(--app-base);font-size:24px;color:var(--app-muted)}
.native-toolbar{display:flex;justify-content:flex-end;margin-top:8px}
.native-number-field{display:block;margin-top:16px;color:var(--app-muted);font-size:14px;line-height:21px}
.native-number-field .native-custom{margin-top:6px}
.native-time-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.native-validation{color:#A13D2E!important;font-size:14px;line-height:21px;margin-block:12px;min-height:0}
.native-clock{padding:18px 0;margin-top:18px;border-radius:24px;background:var(--app-card)}
.native-clock .native-focus-time{margin:8px 0}
.native-focus-controls{flex-wrap:wrap}
.native-work-controls-list{display:flex;flex-direction:column;gap:2px}
.native-example-label{display:inline-block;font-size:12px;line-height:18px;color:var(--app-muted);padding:7px 10px;background:var(--app-card);border-radius:10px;margin-top:12px}
.native-week-chart{display:flex;align-items:end;gap:6px;min-height:148px;margin-top:24px;padding:0 0 8px;border-bottom:1px solid var(--app-line)}
.native-week-chart>div{flex:1;min-width:0;text-align:center;color:var(--app-muted);font-size:12px;line-height:18px}
.native-week-chart i{display:block;margin:5px auto 6px;width:18px;max-width:100%;background:var(--app-primary);border-radius:5px 5px 0 0}
.native-week-chart i.native-chart-gap{border:1px dashed var(--app-outline);background:transparent}
.native-week-value{font-size:11px;white-space:nowrap}
.native-card p.native-stat-total{font-size:18px;color:var(--app-ink);margin-top:16px;font-weight:500}
.native-plan-row{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid var(--app-line);padding:14px 0;font-size:15px}
.native-plan-row span{font-size:13px;color:var(--app-muted)}
.native-settings-group{margin-top:24px;padding:0 2px}
.native-settings-group h3{font-size:14px;color:var(--app-muted);font-weight:500}
.native-settings-group .native-row-button{border-bottom:1px solid var(--app-line);padding-block:12px}
.native-tour-card{padding:38px 20px;text-align:center;border-radius:24px;background:var(--app-card);margin-block:24px}
.native-tour-card>.native-glyph{display:block;width:56px;height:56px;margin:0 auto 28px}
.native-tour-card h3{font-size:25px;line-height:32px;font-weight:600;margin-block:12px}
.native-tour-card p{font-size:16px;line-height:24px;color:var(--app-muted)}
.native-card .native-details a,.native-details>a,.native-settings-group>a{color:var(--app-primary)}
/* Keep the full phone silhouette. Omit the retired footer within the screen,
   using the current APK's backdrop instead of cutting the phone in half. */
body.site-page .hero-recording-panel[data-blocker-visible="true"]::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(#0000008c 0%, #00000059 45%, #000000b8 100%), url("/screens/blocking-forest.jpg") center / cover;
  -webkit-mask-image: linear-gradient(transparent 53.8%, #000 55.3%);
  mask-image: linear-gradient(transparent 53.8%, #000 55.3%);
}
/* Show the original capture’s controls without the retired lower-screen footer. */
.blocking-recording-crop{position:relative;overflow:hidden;aspect-ratio:720/860;width:min(260px,100%);margin-inline:auto;border:1px solid var(--sl-border);border-radius:20px;background:#151B16}
body.site-page .blocking-recording-crop video{position:absolute;inset:0 auto auto 0;width:100%;max-width:none;height:auto;border:0;border-radius:0;margin:0;display:block}
body.site-page .learn-guide-media .blocking-recording-crop{width:min(300px,100%)}
body.site-page .steps.steps-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.learn-current-guides{margin-block:28px 36px}
.learn-current-guides>h2{font-size:28px;line-height:1.25;letter-spacing:-.03em;color:var(--sl-forest);margin-bottom:18px}
.learn-current-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.learn-current-grid>a{display:block;padding:24px;border:1px solid var(--sl-border);border-radius:18px;background:var(--sl-surface);color:var(--sl-forest)}
.learn-current-grid>a:hover{border-color:var(--sl-forest)}
.learn-current-grid>a>span{font-size:13px;font-weight:600;color:var(--sl-muted)}
.learn-current-grid h3{font-size:25px;line-height:1.25;letter-spacing:-.035em;margin-block:14px}
.learn-current-grid p{font-size:15px;line-height:1.7;color:var(--sl-muted);margin-bottom:18px}
.learn-current-grid strong{font-size:14px;font-weight:600}
.policy-page{max-width:1050px;padding-block:36px 60px}
.policy-page header{max-width:760px;margin-bottom:36px}
.policy-page h1{font-family:var(--display);font-size:clamp(36px,5vw,58px);line-height:1.1;letter-spacing:-.045em;color:var(--sl-forest);margin-block:18px}
.policy-page header>p:last-child{font-size:18px;line-height:1.7;color:var(--sl-muted)}
.policy-page article>p,.policy-page article>ul{font-size:16px;line-height:1.8;max-width:88ch;margin-block:16px;color:var(--sl-ink,var(--ink))}
.policy-page h2{font-size:27px;line-height:1.3;letter-spacing:-.03em;color:var(--sl-forest);margin:36px 0 16px;scroll-margin-top:110px}
.policy-page ul{padding-left:22px}
.policy-page li{margin-bottom:9px}
.policy-page a{color:var(--sl-forest);text-decoration:underline;text-underline-offset:3px}
.policy-page code{font-size:.9em;overflow-wrap:anywhere;padding:2px 4px;border-radius:4px;background:var(--sl-sage-wash,#EAF0E4)}
.policy-table-wrap{overflow:auto;border:1px solid var(--sl-border);border-radius:14px;margin-block:24px}
.policy-page table{border-collapse:collapse;width:100%;min-width:620px;font-size:14px;line-height:1.7;text-align:left}
.policy-page th{background:var(--feature-sage,#D9E6CD);font-weight:600;color:var(--sl-forest)}
.policy-page th,.policy-page td{vertical-align:top;padding:16px 18px;border-bottom:1px solid var(--sl-border)}
.policy-page td:first-child{width:48%}
.policy-page tr:last-child td{border-bottom:0}
.policy-help-link{padding-top:24px;font-size:15px}
/* Useful support links keep the hub compact. */
.learn-support-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-block:18px 28px}
.learn-support-links a{display:flex;flex-direction:column;justify-content:center;gap:5px;padding:18px 22px;border:1px solid var(--sl-border);border-radius:16px;color:var(--sl-forest);background:var(--sl-surface)}
.learn-support-links strong{font-size:17px;line-height:1.4}
.learn-support-links span{font-size:14px;line-height:1.6;color:var(--sl-muted)}
.learn-support-links a:hover{border-color:var(--sl-forest)}
.help-inline-feedback p a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:650px){.learn-support-links{grid-template-columns:1fr;gap:10px}.learn-support-links a{padding:16px 18px}}
@media(max-width:850px){body.site-page .steps.steps-four,.learn-current-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){body.site-page .steps.steps-four,.learn-current-grid{grid-template-columns:1fr}.policy-page{padding-block:24px 40px}.policy-page header{margin-bottom:24px}.policy-page h2{font-size:23px}.learn-current-grid>a{padding:20px}}
