/* Sleep Calculator — WakeUpSounds dark theme */
.sc-page{background:#0b1522;color:#e8eef6;min-height:70vh}
.sc-hero{padding:48px 0 28px;background:linear-gradient(180deg,#11263d 0%,#0b1522 100%)}
.sc-hero .eyebrow{color:#ffae59;display:block;font-size:.76rem;font-weight:750;letter-spacing:.14em;text-transform:uppercase;margin:0 0 16px}
.sc-hero h1{font-size:clamp(2.3rem,5vw,3.5rem);line-height:1.08;letter-spacing:-.05em;font-weight:750;margin:0 0 16px;color:#fff}
.sc-hero h1 span{color:#ffae59}
.sc-hero-lead{font-size:1.04rem;line-height:1.65;color:#cfdaea;max-width:540px;margin:0}
.sc-panel-wrap{padding:0 0 56px}
.sc-panel{background:#152a42;border:1px solid #2a4563;border-radius:22px;padding:28px;box-shadow:0 24px 60px #00000055;max-width:920px}
.sc-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#0d1c2e;padding:6px;border-radius:14px;margin-bottom:26px}
.sc-tab{appearance:none;border:0;background:transparent;color:#a8b9cd;font-weight:680;font-size:.88rem;padding:14px 12px;border-radius:10px;min-height:48px;cursor:pointer;line-height:1.25}
.sc-tab.is-active{background:#ffae59;color:#11263d}
.sc-tab:focus-visible{outline:3px solid #ffae59;outline-offset:2px}
.sc-field{margin-bottom:22px}
.sc-field label{display:block;font-size:.82rem;font-weight:650;color:#d7e3f0;margin-bottom:10px}
.sc-time{width:100%;max-width:280px;font-size:2.4rem!important;font-weight:650;letter-spacing:-.04em;min-height:76px;padding:12px 16px;border-radius:14px;border:1px solid #35506c;background:#0b1522;color:#fff;font-variant-numeric:tabular-nums}
.sc-time:focus{outline:3px solid #ffae59;outline-offset:2px;border-color:#ffae59}
.sc-latency{display:flex;flex-wrap:wrap;gap:8px}
.sc-chip{appearance:none;border:1px solid #35506c;background:#0d1c2e;color:#d5e2f0;border-radius:999px;padding:10px 16px;font-size:.82rem;font-weight:650;min-height:44px;cursor:pointer}
.sc-chip.is-active{background:#ffae59;border-color:#ffae59;color:#11263d}
.sc-chip:focus-visible{outline:3px solid #ffae59;outline-offset:2px}
.sc-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.sc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:14px 18px;border-radius:12px;font-weight:720;font-size:.93rem;text-decoration:none;border:1px solid transparent;cursor:pointer;text-align:center;line-height:1.3}
.sc-btn-primary{background:#ffae59;border-color:#ffae59;color:#11263d}
.sc-btn-primary:hover{filter:brightness(1.05)}
.sc-btn-secondary{background:transparent;border-color:#4a6785;color:#e8eef6}
.sc-btn-secondary:hover{background:#1a314a}
.sc-hint{font-size:.76rem;color:#8fa3b8;margin-top:10px;line-height:1.5}
.sc-results{margin-top:28px}
.sc-results-head h2{font-size:1.35rem;letter-spacing:-.03em;margin:0 0 8px;color:#fff}
.sc-results-head p{margin:0 0 18px;color:#a9bcd0;font-size:.9rem;line-height:1.55}
.sc-empty{color:#8fa3b8;font-size:.92rem}
.sc-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sc-card{border-radius:18px;padding:20px 18px 16px;border:1px solid transparent;background:#0d1c2e}
.sc-card--optimal{border-color:#2f6e4a;background:linear-gradient(160deg,#143528 0%,#0d1c2e 70%);box-shadow:0 0 28px #2f8f3a33}
.sc-card--good{border-color:#8a6418;background:linear-gradient(160deg,#2a220f 0%,#0d1c2e 70%);box-shadow:0 0 22px #d4a01722}
.sc-card--warn{border-color:#8a2f28;background:linear-gradient(160deg,#2a1210 0%,#0d1c2e 70%);box-shadow:0 0 22px #c0392b22}
.sc-card-top{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:8px}
.sc-badge{font-size:.68rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase;padding:5px 9px;border-radius:6px}
.sc-card--optimal .sc-badge{background:#2d6b34;color:#d8ffd4}
.sc-card--good .sc-badge{background:#8a6418;color:#ffe9b0}
.sc-card--warn .sc-badge{background:#8a2f28;color:#ffd0cb}
.sc-cycles{font-size:.72rem;color:#9aafc0}
.sc-card .sc-time{font-size:clamp(2rem,4vw,2.55rem);font-weight:700;letter-spacing:-.045em;line-height:1.15;margin:4px 0 6px;font-variant-numeric:tabular-nums;border:0;padding:0;min-height:0;background:transparent;max-width:none;color:#fff}
.sc-sub{font-size:.82rem;color:#b3c5d4;margin:0 0 14px}
.sc-phase{display:grid;grid-template-columns:1.1fr 1.4fr 1fr;gap:4px;height:8px;border-radius:99px;overflow:hidden}
.sc-phase-seg{display:block;height:100%}
.sc-phase-light{background:#6bb8d6}
.sc-phase-deep{background:#3d6ec9}
.sc-phase-rem{background:#9b6bdb}
.sc-phase-legend{display:grid;grid-template-columns:1.1fr 1.4fr 1fr;gap:4px;margin:6px 0 0;font-size:.62rem;color:#7f95a8;text-transform:uppercase;letter-spacing:.04em}
.sc-cta-band{margin-top:28px;padding:22px;border-radius:18px;background:#1a2f48;border:1px solid #3d5a78;display:grid;gap:14px}
.sc-cta-band p{margin:0;color:#cfe0f0;font-size:.92rem;line-height:1.55}
.sc-cta-band strong{color:#ffae59}
.sc-seo{padding:20px 0 80px;background:#0b1522}
.sc-seo .eyebrow{color:#ffae59}
.sc-seo h2{color:#fff;font-size:clamp(1.8rem,3vw,2.4rem);letter-spacing:-.04em;margin:0 0 8px}
.sc-seo .lead{color:#a9bcd0;margin:0 0 20px;max-width:560px}
.sc-seo details{border-bottom:1px solid #2a4563}
.sc-seo details:first-of-type{border-top:1px solid #2a4563}
.sc-seo summary{padding:18px 28px 18px 0;cursor:pointer;font-weight:630;font-size:.98rem;list-style:none;position:relative;color:#e8eef6}
.sc-seo summary:after{content:'+';position:absolute;right:0;top:16px;font-size:1.2rem}
.sc-seo details[open] summary:after{content:'−'}
.sc-seo summary::-webkit-details-marker{display:none}
.sc-seo details p{font-size:.89rem;line-height:1.8;color:#9aafc0;padding-bottom:20px;margin:0}
.sc-seo .tips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
.sc-tip{background:#152a42;border:1px solid #2a4563;border-radius:16px;padding:20px}
.sc-tip h3{font-size:1rem;margin:0 0 10px;color:#ffae59}
.sc-tip p{margin:0;font-size:.86rem;line-height:1.65;color:#a9bcd0}
.sc-page .site-footer{background:#09111c;border-top:1px solid #1e334a;color:#a9bcd0}
.sc-page .site-footer .brand{color:#fff}
.sc-page .footer-bottom{color:#7f95a8}
@media(max-width:720px){
  .sc-hero{padding:32px 0 20px}
  .sc-panel{padding:22px 18px 26px;border-radius:18px}
  .sc-tabs{grid-template-columns:1fr}
  .sc-actions{grid-template-columns:1fr}
  .sc-cards{grid-template-columns:1fr}
  .sc-seo .tips{grid-template-columns:1fr}
  .sc-time{max-width:100%;font-size:2.1rem!important}
  .wrap{width:calc(100% - 36px)}
}
