/* Original STEP colours: coral, teal, purple and blue on warm white. */
:root{--tune-coral:#E8634F;--tune-purple:#6B4C9A;--tune-teal:#2B8B95;--tune-muted:#69606f}
body{padding-bottom:calc(156px + env(safe-area-inset-bottom,0px))!important}
.page-content .clock-title{color:#553d7b;font-weight:700}
.page-content>.clock-eyebrow{color:#397781!important;font-weight:700;letter-spacing:.1em}
.page-spirit56{margin:6px auto 18px}
.page-spirit56>button.spirit-trigger57{padding-top:0!important}
.spirit-trigger57>img{width:190px!important;height:190px!important;background:radial-gradient(circle,#fff6df 15%,#eee0f5 65%,transparent 66%);filter:drop-shadow(0 10px 14px #6b4c9a24)}
.spirit-trigger57>span{font-size:calc(18px * var(--text-scale,1))}
.page-content .clock-entry{background:linear-gradient(115deg,#fff4e7,#fffdf9 60%,#f0e7fa);border-color:#d9c7e8;border-left:4px solid #9b71bb;box-shadow:0 5px 16px #6b4c9a0b}
.page-content .clock-entry:nth-of-type(3n){background:linear-gradient(115deg,#e4f3ed,#fffdf7);border-color:#c0dbd1;border-left-color:#4a9b7f}
.page-content .clock-entry:nth-of-type(3n+2){border-left-color:#e88962}
.clock-subtitle{color:#6B4C9A!important}
.care-details{border-color:#daccE6;box-shadow:0 4px 14px #6b4c9a08}

/* A full-size illustrated companion, with the previous STEP's teal/purple header. */
.tune-heading-panel61{margin:10px 0 25px;border:1px solid #d9c9e5;border-radius:28px;overflow:hidden;background:radial-gradient(ellipse at 12% 5%,#ffe8ca,transparent 55%),linear-gradient(145deg,#f4eaf8,#e5f3ef);box-shadow:0 10px 26px #6b4c9a16}
.tune-heading-panel61 .page-spirit56{padding:20px 8px 12px;margin:0}
.tune-heading-panel61 .spirit-trigger57>img{width:178px!important;height:178px!important}
.tune-heading-copy61{padding:20px 22px 23px;background:linear-gradient(130deg,#267e88,#6B4C9A);color:#fff}
.tune-heading-copy61 .clock-eyebrow{color:#fff!important;font-weight:700;margin:0 0 7px;letter-spacing:.06em}
.tune-heading-copy61 .clock-title{color:#fff!important;font-size:calc(25px * var(--text-scale,1));margin:0;line-height:1.5!important}
.tune-heading-copy61 .tune-intro60{color:#fff;font-size:calc(16px * var(--text-scale,1));margin:12px 0 0;line-height:1.8}
.tune-heading-panel61.is-main61{background:radial-gradient(ellipse at 22% 20%,#fff0c4,transparent 60%),linear-gradient(145deg,#fde8d9,#e9dff5 60%,#d9eeeb)}
.is-main61 .page-spirit56{padding-top:22px;padding-bottom:18px}
.is-main61 .spirit-trigger57>img{width:228px!important;height:228px!important}
.is-main61 .spirit-trigger57>span{font-size:calc(20px * var(--text-scale,1));color:#604079}
.is-main61 .spirit-trigger57 small{color:#695471}
.is-main61 .tune-heading-copy61{padding:22px 24px 26px}
.tune-section-head60 h2,.tune-heading60,.tune-group60>h2{color:#6B4C9A}
.tune-section-head60{border-bottom:2px solid #dccae8;padding-bottom:12px}
.tune-section-head60 h2{margin:0}
.tune-heading60{border-left:5px solid #E8634F;padding-left:12px}
.tune-group60>h2{padding:12px 15px;border-radius:12px;background:linear-gradient(120deg,#287f89,#6B4C9A);color:#fff}
.tune-recommend60{position:relative;border:1px solid #e6b7a7;border-top:5px solid #E8634F;background:radial-gradient(ellipse at 100% 100%,#eeddf5,transparent 65%),linear-gradient(125deg,#fff0dc,#fffaf3);box-shadow:0 8px 22px #bb65451a}
.tune-recommend60 h3{color:#ac493c}
.tune-recommend60.teal{border-color:#a8d2cc;border-top-color:#2B8B95;background:linear-gradient(125deg,#dff2e9,#f0e9fa);box-shadow:0 8px 22px #2b8b9515}
.tune-recommend60.teal h3{color:#246f77}
.tune-recommend60 .clock-primary{background:linear-gradient(120deg,#d95d49,#a44982);box-shadow:0 5px 13px #c7585c29}
.tune-recommend60.teal .clock-primary{background:linear-gradient(120deg,#287f89,#6B4C9A)}
.tune-recommend60 .clock-secondary{background:#fffaf4;border-color:#d1b9d8;color:#6B4C9A}
.tune-chip60{border-color:#b293ca;background:#ffffffc9;color:#654584;font-weight:600}
.tune-quick60{gap:14px}
.tune-quick60 button{display:flex;flex-direction:column;align-items:center;padding:12px 8px 18px;border:1px solid #b9d7cb;background:linear-gradient(145deg,#e0f1e7,#fffaf0)!important;box-shadow:0 5px 18px #42796412;color:#356d61}
.tune-quick60 button[data-tone61=coral]{border-color:#efc1a8;background:linear-gradient(145deg,#ffe3c8,#fff6ec)!important;color:#a0503c}
.tune-quick60 button[data-tone61=purple]{border-color:#cfb8e4;background:linear-gradient(145deg,#e5d9f4,#fcf3f5)!important;color:#6B4C9A}
.tune-quick60 button[data-tone61=blue]{border-color:#b9c9e5;background:linear-gradient(145deg,#dfe7fb,#f0f6f5)!important;color:#465f9f}
.tune-quick60 .tune-art61{width:138px;max-width:100%;height:auto;aspect-ratio:1;object-fit:contain;margin:0 auto 5px}
.tune-quick60 button>span{display:block;line-height:1.6}
.tune-quick60 small{color:#6c6170}
.tune-banner60{grid-template-columns:145px minmax(0,1fr);background:linear-gradient(120deg,#ffe8c7,#efe1f5);border-color:#d5b4c7;box-shadow:0 6px 20px #6b4c9a10}
.tune-banner60 h3,.tune-banner60 h2{color:#6B4C9A}
.tune-scene60{background:radial-gradient(circle,#fff8e9,#ebd7ea 65%,transparent 66%)}
.tune-item60{background:linear-gradient(120deg,#f5ecfa,#fffaf1);border-color:#d8c4e4;padding:15px 12px;gap:13px;box-shadow:0 5px 16px #6b4c9a0d}
.tune-item60:nth-of-type(3n+2){background:linear-gradient(120deg,#e6f3ed,#fffaf0);border-color:#c4dbd0}
.tune-item60:nth-of-type(3n){background:linear-gradient(120deg,#fff0da,#fff5f0);border-color:#edcead}
.tune-art61{display:block;width:94px;height:94px;object-fit:contain;flex-shrink:0}
.tune-item60>span:nth-child(2){flex:1;min-width:0}
.tune-item60 small{color:#716274}
.tune-item60 b{color:#634584}
.tune-theme60{border-top:5px solid #6B4C9A;background:linear-gradient(130deg,#f2e9fa,#fff8ed);box-shadow:0 6px 18px #6b4c9a10}
.tune-theme60:nth-of-type(2n){border-top-color:#2B8B95;background:linear-gradient(130deg,#e5f3ed,#fff8ed)}
.tune-theme60 h2{color:#674486}
.tune-form60>fieldset{padding:18px 14px;border:1px solid #d8c6e7;border-radius:20px;background:linear-gradient(135deg,#f3e9fa,#fff9ef)}
.tune-form60>fieldset:nth-of-type(2n){border-color:#c3dbd0;background:linear-gradient(135deg,#eaf4ed,#fffbef)}
.tune-form60>fieldset legend{padding:0 6px;color:#654484}
.tune-scale60 span{background:#fffdfb;border-color:#cdbada}
.tune-timer-card60{background:radial-gradient(ellipse at top,#ffe9cd,transparent 60%),linear-gradient(135deg,#ece0f7,#e5f2ee);border-color:#cbb4df;box-shadow:0 7px 23px #6b4c9a15}
.tune-timer-card60>.tune-scene60{width:220px;max-width:90%}
.home-tune60{background:linear-gradient(125deg,#267e88,#6B4C9A);border:0;box-shadow:0 8px 24px #6b4c9a2a;color:white}
.home-tune60 span,.home-tune60 h2,.home-tune60 p{color:#fff}
.home-tune60 .clock-primary{background:#fff5e6;color:#6B4C9A;box-shadow:0 5px 13px #18314222}
.almanac-time60{border-color:#d6b88a;background:linear-gradient(135deg,#fff0d3,#efe1f4);box-shadow:0 7px 25px #a16f5317}
.almanac-moon60{background:linear-gradient(130deg,#e5d9f5,#f3edf9);border-color:#c9b0df}
.almanac-season60{background:linear-gradient(130deg,#dcefdc,#fbf3dc);border-color:#b8d0aa}
.almanac-pair60 h2{color:#674486}
#page-learn .history-card{margin-inline:0;border:1px solid #d9c5e6;border-radius:22px;background:#fffaf5;box-shadow:0 6px 20px #6b4c9a10}
#page-learn .n-det{border-color:#e0d1e9}
#page-learn .n-det summary{color:#68488c;font-size:calc(16px * var(--text-scale,1));flex-wrap:wrap;gap:8px;line-height:1.7}
#page-learn .n-det p{font-size:calc(16px * var(--text-scale,1));line-height:1.9}

/* Seven destinations without squeezing seven labels into one phone-width row. */
body>nav{padding:8px 12px calc(7px + env(safe-area-inset-bottom,0px));background:rgba(255,250,247,.98);border-top:1px solid #d9c8e3;box-shadow:0 -4px 22px #55386e0d}
body>nav .container{gap:3px}
body>nav .nav-item{min-height:58px;justify-content:center;border-radius:12px}
body>nav .nav-label{font-size:calc(12px * var(--text-scale,1));white-space:normal;line-height:1.4;text-align:center;max-width:100%;overflow-wrap:anywhere}
body>nav .nav-item[aria-current=page]{background:#ecdef5;color:#65438c}
body>nav .tune-nav60[aria-current=page]{background:#fae1d9;color:#ac473d}
.tune-nav60 .nav-icon{background:linear-gradient(135deg,#E8634F,#6B4C9A);box-shadow:0 3px 9px #ac548f33}
.nav-utility61{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px;padding-top:5px;border-top:1px solid #e5d7eb}
body>nav .nav-utility61 .nav-item{flex-direction:row;gap:8px;min-height:44px;padding:4px 12px;background:#f4edf8;color:#6B4C9A}
body>nav .nav-utility61 .nav-item:last-child{background:#eaf4ef;color:#377b73}
body>nav .nav-utility61 .nav-item[aria-current=page]{background:#6B4C9A;color:#fff}
body>nav .nav-utility61 .nav-item:last-child[aria-current=page]{background:#2b7a76}
body>nav .nav-utility61 .nav-label{font-size:calc(14px * var(--text-scale,1))}
.nav-utility61 svg{display:block;width:20px;height:20px}
.nav-utility61 .nav-icon{line-height:20px!important}
.n-toast{bottom:calc(153px + env(safe-area-inset-bottom,0px))!important}
.n-player{bottom:calc(147px + env(safe-area-inset-bottom,0px))!important}
@media(min-width:650px){.tune-quick60{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:430px){.tune-banner60{grid-template-columns:1fr;text-align:center;padding:20px}.tune-banner60 .tune-scene60{width:178px;margin:0 auto}.tune-heading-copy61,.is-main61 .tune-heading-copy61{padding:20px}.tune-item60{gap:10px}.tune-item60 .tune-art61{width:86px;height:86px}}
@media(max-width:359px){.spirit-trigger57>img{width:174px!important;height:174px!important}.is-main61 .spirit-trigger57>img{width:208px!important;height:208px!important}.tune-quick60{gap:10px}.tune-item60{flex-wrap:wrap}.tune-item60 .tune-art61{width:112px;height:112px;margin:auto}.tune-item60>span:nth-child(2){flex-basis:100%}.tune-item60>i{margin-left:auto}.tune-form60>fieldset{padding:16px 9px}.tune-heading-copy61 .clock-title{font-size:calc(23px * var(--text-scale,1))}}
html[data-text-size="1.3"] .tune-item60{flex-wrap:wrap}
html[data-text-size="1.3"] .tune-item60>span:nth-child(2){flex-basis:100%}
html[data-text-size="1.3"] body>nav .nav-label{font-size:calc(12px * var(--text-scale,1))!important;white-space:normal}
html[data-text-size="1.3"] body>nav .nav-utility61 .nav-label{font-size:calc(14px * var(--text-scale,1))!important}
html[data-text-size="1.3"] body{padding-bottom:calc(178px + env(safe-area-inset-bottom,0px))!important}
html[data-text-size="1.3"] .n-toast,html[data-text-size="1.3"] .n-player{bottom:calc(178px + env(safe-area-inset-bottom,0px))!important}