/* Sleep regression calendar (/tools/sleep-regression-calendar/, /cs/nastroje/spankova-regrese/) and the age pages
   (main.sr-page). Tokens come from page.css; the look follows the nap planner. */
main.narrow.tool-sleep-regression:not(.sr-page){width:min(1040px,100% - 2*var(--gut))}
.tool-sleep-regression .head .lede{max-width:40em}
.tool-sleep-regression .prose{max-width:720px}

.sr{margin:32px 0 12px;display:grid;gap:16px;grid-template-columns:minmax(0,1fr);overflow-wrap:break-word;min-height:420px}
.sr.on{min-height:0}
.sr-noscript{margin:0;padding:14px 18px;border-radius:16px;background:rgba(231,168,87,.14);font-size:15px}

/* inputs */
.sr-side{display:grid;gap:12px;align-content:start;min-width:0}
.sr-priv{display:flex;gap:9px;align-items:flex-start;margin:0;padding:0 4px;font-size:14.5px;line-height:1.45;color:var(--ink2)}
.sr-priv .ico{color:var(--caramel);margin-top:2px;width:17px;height:17px}
.sr .ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sr-inputs{padding:20px;border-radius:22px;background:var(--paper);box-shadow:0 0 0 1px var(--line),0 10px 30px rgba(169,103,42,.12)}
.sr-lab{display:block;margin:0 0 9px;font:600 12.5px/1.2 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--caramel)}
.sr-input{display:block;width:100%;min-height:54px;padding:0 16px;border-radius:15px;border:1.5px solid rgba(169,103,42,.22);background:#fff;font:500 18px/54px var(--sans);color:var(--ink);-webkit-appearance:none;appearance:none}
.sr-input::-webkit-date-and-time-value{text-align:left}
.sr-input:focus{outline:none;border-color:var(--honey);box-shadow:0 0 0 4px rgba(231,168,87,.28)}
.sr-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0 0}
.sr-chip{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:0;min-height:44px;padding:0 6px;border-radius:99px;background:var(--cream);color:var(--ink);font:600 15px/1 var(--sans);white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation}
.sr-chip input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.sr-chip:has(input:checked){background:var(--honey);box-shadow:0 6px 14px -8px rgba(169,103,42,.8)}
.sr-chip:has(input:focus-visible){outline:2px solid var(--caramel);outline-offset:2px}
.sr-ageline{margin:12px 0 0;font-size:15px;line-height:1.45;color:var(--ink2)}
.sr-ageline small{font-size:13.5px;color:var(--muted)}
.sr-link{display:inline-flex;align-items:center;min-height:44px;margin:4px 0 0;padding:0;border:0;background:none;color:var(--caramel);font:500 14.5px/1.35 var(--sans);text-align:left;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;cursor:pointer}
.sr-link[hidden]{display:none}
.sr-pre{margin-top:6px;padding:14px 16px 12px;border-radius:16px;background:rgba(245,232,214,.6)}
.sr-dueline{margin:10px 0 0;font-size:14px;line-height:1.45;color:var(--ink2)}
.sr-dueline:empty{display:none}

/* summary */
.sr-main{display:grid;gap:12px;align-content:start;min-width:0}
.sr-sum{padding:20px 22px 22px;border-radius:28px;background:radial-gradient(110% 90% at 100% 0%,#FBE2BF 0%,rgba(251,226,191,0) 58%),var(--paper);box-shadow:0 0 0 1px var(--line),0 10px 30px rgba(169,103,42,.12)}
.sr-big{margin:0;font:500 clamp(23px,2.6vw,28px)/1.2 var(--serif);letter-spacing:-.01em;color:var(--ink)}
.sr-small{margin:8px 0 0;font-size:15.5px;line-height:1.5;color:var(--ink2)}

/* the cards */
.sr-list{display:grid;gap:10px}
.sr-rest{display:grid;gap:10px}
.sr-rest[hidden]{display:none}
.sr-card{border-radius:22px;background:var(--paper);box-shadow:0 0 0 1px var(--line),0 10px 30px -22px rgba(169,103,42,.45)}
.sr-card.st-now,.sr-card.pinned{box-shadow:0 0 0 2px var(--honey),0 14px 32px -18px rgba(169,103,42,.6)}
.sr-card.st-behind{background:rgba(255,252,247,.6)}
.sr-card-h{display:grid;grid-template-columns:minmax(0,1fr) 32px;column-gap:12px;width:100%;padding:16px 18px;border:0;background:none;text-align:left;color:var(--ink);cursor:pointer;font:inherit}
.sr-card-h::after{content:"+";grid-column:2;grid-row:1/4;align-self:center;width:32px;height:32px;border-radius:50%;background:var(--cream);display:flex;align-items:center;justify-content:center;font:500 20px/1 var(--sans);transition:transform .3s}
.sr-card.open .sr-card-h::after{transform:rotate(45deg);background:var(--honey)}
.sr-card-h:focus-visible{outline:3px solid var(--caramel);outline-offset:-3px;border-radius:22px}
.sr-st{grid-column:1;font:600 11.5px/1.2 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--caramel)}
.st-behind .sr-st,.st-later .sr-st{color:var(--muted)}
.sr-name{grid-column:1;margin:7px 0 3px;font:500 20px/1.2 var(--serif);letter-spacing:-.01em}
.st-behind .sr-name{color:var(--ink2)}
.sr-when{grid-column:1;font-size:14.5px;line-height:1.45;color:var(--ink2)}
.sr-card-b{padding:0 18px 16px;font-size:15px;line-height:1.55}
.sr-card-b[hidden]{display:none}
.sr-card-b p{margin:10px 0 0}
.sr-card-b ul{margin:4px 0 0;padding-left:1.1em}
.sr-card-b li{margin:3px 0}
.sr-usual{color:var(--muted);font-size:14px}
.sr-cols{display:grid;gap:10px;margin-top:10px}
.sr-ev{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;padding-top:10px;border-top:1px solid var(--line);font-size:14px;color:var(--ink2)}
.sr-pill{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:99px;font:600 12px/1 var(--sans);letter-spacing:.04em}
.ev-strong .sr-pill{background:rgba(63,122,74,.14);color:#2F5E38}
.ev-moderate .sr-pill{background:rgba(231,168,87,.22);color:#7A4A1C}
.ev-weak .sr-pill{background:rgba(42,31,26,.08);color:var(--ink2)}
.sr-more{display:inline-block;margin-top:10px;padding:10px 0;font-weight:600}
.sr-all{justify-self:start;min-height:44px;padding:0 18px;border-radius:99px;border:0;background:var(--cream);color:var(--ink);font:600 15px/1 var(--sans);cursor:pointer}
.sr-all:focus-visible{outline:3px solid var(--caramel);outline-offset:3px}

/* actions, bridge, toast */
.sr-actions{display:flex;flex-wrap:wrap;gap:8px}
.sr-actions:empty{display:none}
.sr-act{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px;border-radius:99px;border:0;background:var(--paper);box-shadow:0 0 0 1px rgba(169,103,42,.25);color:var(--ink);font:600 15px/1 var(--sans);text-decoration:none;cursor:pointer}
.sr-act .ico{color:var(--caramel)}
.sr-act:focus-visible{outline:3px solid var(--caramel);outline-offset:3px}
.sr-mamoon{position:relative;display:grid;grid-template-columns:38px minmax(0,1fr);gap:12px;align-items:start;padding:14px 16px 14px 14px;border-radius:20px;background:var(--paper);box-shadow:0 10px 22px -14px rgba(60,30,10,.5);font-size:14.5px;line-height:1.5;color:var(--ink)}
.sr-mamoon img{width:38px;height:38px;border-radius:11px;box-shadow:0 2px 6px rgba(60,35,20,.18)}
.sr-mamoon p{margin:0;padding-right:28px}
.sr-mamoon a{display:inline-block;padding:12px 3px;margin:-12px -3px}
.sr-x{position:absolute;right:2px;top:2px;width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:var(--muted);font:400 24px/1 var(--sans);cursor:pointer}
.sr-toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));z-index:70;width:max-content;max-width:min(440px,calc(100% - 32px));padding:14px 20px;border-radius:18px;background:var(--paper);color:var(--ink);font:500 15.5px/1.4 var(--sans);box-shadow:0 0 0 1px var(--line),0 18px 40px -12px rgba(169,103,42,.5);opacity:0;pointer-events:none;transform:translateX(-50%);transition:opacity .25s}
.sr-toast.on{opacity:1}

/* the pages around it */
.sr-ages{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}
.sr-ages b{flex-basis:100%;font:600 12.5px/1.2 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--caramel)}
.sr-ages a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:99px;background:var(--cream);color:var(--ink);font:600 14.5px/1 var(--sans);text-decoration:none}
.sr-ages a[aria-current]{background:var(--honey)}
.sr-evbox{margin:28px 0;padding:20px 24px;border-radius:18px;background:rgba(27,31,53,.06)}

@media (hover:hover){
  .sr-card-h:hover .sr-name{color:var(--caramel)}
  .sr-act:hover,.sr-all:hover{background:#FFF6EA}
  .sr-x:hover{background:var(--cream);color:var(--ink)}
  .sr-ages a:hover{background:var(--honeyHi)}
}
@media (min-width:640px){
  .sr-cols{grid-template-columns:1fr 1fr;gap:18px}
  .sr-chips{grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media (min-width:900px){
  main:not(.sr-page) .sr{grid-template-columns:320px minmax(0,1fr);gap:24px;align-items:start}
  main:not(.sr-page) .sr-side{position:sticky;top:84px}
  main:not(.sr-page) .sr-chips{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sr-sum{padding:26px 30px 28px}
}
@media (prefers-reduced-motion:no-preference){
  .sr-toast{transform:translate(-50%,14px);transition:opacity .25s,transform .25s}
  .sr-toast.on{transform:translate(-50%,0)}
}
