/* UpOnly Learning: Move Every Day (free PE, K–8). Uses the site tokens from styles.css (--ink, --muted, --display, --body). */
.pe{--pe-navy:#15233c;--pe-yel:#ffd23f;--pe-blue:#8fb0e3;--pe-pale:#f3f6fb;--pe-line:#d5deec;--pe-r:16px}
.pe-main{overflow-x:clip;background:#fff}
.pe .wrap{max-width:1120px}
.pe-band{background:var(--pe-navy);color:#fff}
.pe-band .wrap{display:flex;align-items:center;gap:10px;min-height:40px;font-weight:700;font-size:15px;letter-spacing:.02em}
.pe-band a{color:#fff;text-decoration:none}.pe-band a:hover{text-decoration:underline}.pe-band b{color:var(--pe-yel)}
.pe-hero{padding:22px 0 18px;border-bottom:4px solid var(--pe-yel);background:linear-gradient(180deg,var(--pe-pale),#fff)}
.pe-crumb{font-size:14px;color:var(--muted);margin-bottom:10px;overflow-wrap:anywhere}.pe-crumb a{color:var(--pe-navy)}
.pe-kicker{display:inline-block;font:800 13.5px/1.2 var(--body);letter-spacing:.08em;text-transform:uppercase;color:#5a6a8a;margin:0}
.pe-hero h1{font-family:var(--display);font-size:clamp(28px,4.6vw,46px);line-height:1.07;margin:8px 0 10px;text-wrap:balance;overflow-wrap:anywhere;color:var(--ink)}
.pe-hero .wrap.pe-hg{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:22px;align-items:center}.pe-herofig svg{width:100%;height:auto;max-height:200px;display:block}
@media (max-width:720px){.pe-hero .wrap.pe-hg{grid-template-columns:minmax(0,1fr)}.pe-herofig{max-width:220px}}
.pe-lead{font-size:18px;max-width:62ch;margin:0 0 10px}
.pe-pills{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0;padding:0;list-style:none}
.pe-pills li{border:1.5px solid var(--pe-line);background:#fff;border-radius:999px;padding:4px 12px;font-weight:700;font-size:14.5px}
.pe-body{padding-top:18px;padding-bottom:40px}
.pe-body h2{font-family:var(--display);font-size:clamp(22px,3vw,30px);line-height:1.15;margin:34px 0 10px;scroll-margin-top:90px}
.pe-body h3{font-size:19px;margin:20px 0 6px;scroll-margin-top:90px}
.pe-body p,.pe-body li{font-size:17px;line-height:1.55}
.pe-body .pe-note{color:var(--muted);font-size:15px}
.pe-toc{border:2px solid var(--pe-navy);border-radius:var(--pe-r);padding:12px 18px;margin:14px 0;background:#fff}
.pe-toc h2{font-size:18px!important;margin:0 0 6px!important}.pe-toc ol{margin:0;padding-left:22px;columns:2 260px}.pe-toc li{font-size:16px;margin:2px 0}
.pe-tbl{width:100%;border-collapse:collapse;margin:10px 0 6px;font-size:16px}
.pe-tblw{overflow-x:auto;-webkit-overflow-scrolling:touch}
.pe-tbl th,.pe-tbl td{border:1px solid var(--pe-line);padding:8px 10px;text-align:left;vertical-align:top}
.pe-tbl th{background:var(--pe-pale);font-weight:800}
.pe-box{border:2px solid var(--pe-navy);border-radius:var(--pe-r);padding:14px 18px;margin:16px 0;background:#fff;box-shadow:0 4px 0 var(--pe-navy)}
.pe-box h2,.pe-box h3{margin-top:0}
.pe-safe{background:#fffbea;border-color:#b98a00;box-shadow:0 4px 0 #b98a00}
.pe-safe ul{columns:2 240px;margin:6px 0 0;padding-left:20px}
.pe-d60{display:grid;grid-template-columns:150px 1fr;gap:16px;align-items:center}
.pe-d60 svg{width:150px;height:150px}
@media (max-width:560px){.pe-d60{grid-template-columns:1fr}.pe-d60 svg{margin:0 auto}}
.pe-grades{list-style:none;margin:10px 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr));gap:10px}
.pe-grades li{margin:0}
.pe-grades a,.pe-grades span.pe-soon{display:block;border:2px solid var(--pe-navy);border-radius:14px;padding:12px;text-decoration:none;color:var(--ink);background:#fff;min-height:64px}
.pe-grades a{box-shadow:0 4px 0 var(--pe-navy)}.pe-grades a:hover{background:var(--pe-pale)}
.pe-grades b{display:block;font-size:18px}.pe-grades small{color:var(--muted);font-size:14px}
.pe-grades span.pe-soon{border-style:dashed;border-color:#9aa6bd;color:#5a6a8a}
.pe-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:12px;margin:10px 0}
.pe-links a{display:block;border:2px solid var(--pe-navy);border-radius:14px;padding:12px 14px;text-decoration:none;color:var(--ink);background:#fff;box-shadow:0 4px 0 var(--pe-navy)}
.pe-links a b{display:block;font-size:17px}.pe-links a span{font-size:15px;color:var(--muted)}
.pe-sess{border:2px solid var(--pe-navy);border-radius:var(--pe-r);margin:12px 0;background:#fff}
.pe-sess>summary{cursor:pointer;padding:12px 16px;font-weight:800;font-size:17px;list-style:none;display:flex;gap:10px;align-items:baseline}
.pe-sess>summary::-webkit-details-marker{display:none}
.pe-sess>summary::before{content:"+";font-weight:900;width:1ch}.pe-sess[open]>summary::before{content:"\2212"}
.pe-sess>summary small{font-weight:600;color:var(--muted)}
.pe-sess .pe-sb{padding:0 16px 14px}
.pe-exl{display:inline-block;font-size:13px;font-weight:800;border:1.5px solid var(--pe-navy);border-radius:999px;padding:0 7px;margin-left:2px;text-decoration:none;color:var(--pe-navy);background:var(--pe-pale);vertical-align:1px}
.pe-ican{columns:2 260px;padding-left:20px}
.pe-fig{display:block;width:100%;height:auto;max-height:190px}
.pe-filters{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}
.pe-filters button{font:700 15px var(--body);border:2px solid var(--pe-navy);background:#fff;color:var(--pe-navy);border-radius:999px;padding:7px 14px;min-height:44px;cursor:pointer}
.pe-filters button[aria-pressed="true"]{background:var(--pe-navy);color:#fff}
.pe-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:16px}
.pe-card{border:2px solid var(--pe-navy);border-radius:var(--pe-r);padding:12px;background:#fff;box-shadow:0 4px 0 var(--pe-navy);scroll-margin-top:90px;min-width:0}
.pe-card:target{outline:4px solid var(--pe-yel)}
.pe-card h3{margin:8px 0 2px;font-size:19px}
.pe-card .pe-tags{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 6px;padding:0;list-style:none}
.pe-card .pe-tags li{font-size:13px;font-weight:800;background:var(--pe-pale);border:1px solid var(--pe-line);border-radius:999px;padding:1px 8px}
.pe-card p,.pe-card li,.pe-card dd,.pe-card dt{font-size:15.5px;line-height:1.45}
.pe-card dl{display:grid;grid-template-columns:minmax(0,1fr);gap:0;margin:6px 0}
.pe-card dt{font-weight:800}.pe-card dd{margin:0 0 6px}
.pe-card .pe-dose{width:100%;border-collapse:collapse;margin:6px 0;font-size:14.5px}
.pe-card .pe-dose th,.pe-card .pe-dose td{border:1px solid var(--pe-line);padding:4px 6px;text-align:center}
.pe-card .pe-dose th{background:var(--pe-pale)}
.pe-comm{list-style:none;padding:0;margin:10px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
.pe-comm li{border:1.5px solid var(--pe-line);border-radius:14px;padding:12px 14px;margin:0;background:#fff}
.pe-comm b{display:block;font-size:17px;margin-bottom:2px}
.pe-comm p{font-size:15.5px!important;margin:4px 0}
.pe-sources ol{padding-left:0;list-style:none}
.pe-sources li{border-top:1px solid var(--pe-line);padding:8px 0;font-size:15.5px}
.pe-sources .pe-k{font-weight:800;margin-right:6px}
.pe-sources a{overflow-wrap:anywhere;word-break:break-word}
.pe-cite{font-size:.72em;line-height:0}.pe-cite a{text-decoration:none;font-weight:700}
.pe-disc{border-top:3px solid var(--pe-yel);margin-top:30px;padding-top:12px;font-size:15px;color:#3b4763}
.pe-member{background:var(--pe-pale);border-radius:12px;padding:10px 14px;font-size:16px}
.pe .fp{padding-top:6px}
@media print{.pe-band,.pe-filters,#site-header,#site-footer{display:none}.pe-sess>summary::before{content:""}.pe-box,.pe-card,.pe-links a,.pe-grades a{box-shadow:none}}
.pe-info{display:block;width:100%;height:auto;max-width:560px;margin:12px 0}
.pe-cfu{background:#eef7e6;border-left:4px solid #5f9e4f;padding:8px 12px;border-radius:6px}
/* v154-pe-mobile:start */
@media (max-width:1024px){
/* The global `section{padding-block:72px}` from styles.css stacked with the h2 top margin,
   leaving ~180px empty bands between PE sections on phones and tablets, while the printables
   sections (padding 6px) sat almost flush. One even rhythm instead: 40px above every section heading. */
.pe-body>section,.pe-body>section.fp{padding-block:0}
.pe-body>section>h2:first-child,.pe-body>section>.fp-in>h2:first-child,.pe-body>section>div>h2:first-child{margin-top:40px}
.pe-body>.pe-disc{margin-top:40px}
.pe-body>section.pe-sources>ol{margin-bottom:0}
}
@media (max-width:720px){
/* Boxes: the last paragraph's margin doubled the bottom padding. The Daily 60 box stacks its
   clock and text block as grid items, so grid gap + paragraph margins left a loose 30-45px around it. */
.pe-box>:last-child{margin-bottom:0}
.pe-d60{gap:0}
.pe-d60>svg{margin-bottom:12px}
.pe-d60 p{margin:0 0 12px}
.pe-d60 p:last-child,.pe-d60>div>:last-child{margin-bottom:0}
/* Session cards: keep "30 min" on one line, pinned right, instead of wrapping to "30 / min". */
.pe-sess>summary{align-items:flex-start}
.pe-sess>summary small{white-space:nowrap;margin-left:auto;flex-shrink:0;padding-left:8px}
/* Exercise number chips inside tables and notes: give them room so stacked chips don't touch. */
.pe-exl{padding:1px 8px;margin:2px 1px;line-height:1.45}
/* Tables: tighter cells so more fits; soft edge shadow shows a wide table scrolls sideways. */
.pe-tbl{font-size:15px}
.pe-tbl th,.pe-tbl td{padding:7px 8px}
.pe-tblw{background:linear-gradient(90deg,#fff 30%,rgba(255,255,255,0)) left/24px 100% no-repeat local,linear-gradient(270deg,#fff 30%,rgba(255,255,255,0)) right/24px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgba(21,35,60,.22),rgba(21,35,60,0)) left/10px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(21,35,60,.22),rgba(21,35,60,0)) right/10px 100% no-repeat scroll}
.pe-tbl th{background-color:var(--pe-pale)}
.pe-tbl td{background-color:transparent}
/* Card grids and link lists: one consistent gap. */
.pe-cards{gap:14px}
.pe-card dd{margin-bottom:8px}
.pe-links,.pe-comm{gap:12px}
.pe-sources li{padding:10px 0}
}
/* v154-pe-mobile:end */