.laptop{transform:none!important}.lid{width:90%;margin:0 5%;padding:2.2% 1.5% 1.5%;border-radius:10px 10px 4px 4px;background:linear-gradient(145deg,#728184,#1a272d 35%,#46585e);border:1px solid #afc4c5;box-shadow:0 12px 24px #0005}.camera{top:1.5%;left:50%;width:3px;height:3px;background:#071215}.base{height:9px;background:linear-gradient(#c4d0d0,#63767e 50%,#2b3b42);border-radius:2px 2px 45% 45%;box-shadow:0 10px 13px #0005}.base span{top:0;left:43%;width:14%;height:3px;background:#71878b;border-radius:0 0 5px 5px}@media(max-width:700px){.base{height:7px}}header .brand{display:inline-flex;align-items:center;gap:9px;white-space:nowrap}header .brand .product-brand-icon{width:34px;height:34px;object-fit:contain;flex-shrink:0}header .brand .product-brand-wordmark{font-weight:700}@media(max-width:700px){header .brand{gap:6px}header .brand .product-brand-icon{width:28px;height:28px}}
.actions a:after{content:"";position:absolute;inset:-90% auto -90% -65%;width:36%;pointer-events:none;z-index:-1;background:linear-gradient(90deg,transparent,#ffffff45,transparent);animation:product-glass-sheen 6s ease-in-out infinite}.actions a:nth-child(2):after{animation-delay:-3s}@keyframes product-glass-sheen{0%{transform:translateX(0) skewX(-24deg);opacity:0}7%{opacity:.65}43%{opacity:.65}50%,100%{transform:translateX(560%) skewX(-24deg);opacity:0}}@media(prefers-reduced-motion:reduce){.actions a:after{animation:none;opacity:0}}

.story>h2+p{margin-top:28px;margin-left:auto;margin-right:auto;max-width:900px}.story>p:not(.eyebrow){line-height:1.85}@media(max-width:700px){.story>h2+p{margin-top:24px}}
.notes{padding-top:72px;padding-bottom:72px;align-items:center}.notes .note-list article:last-child{padding-bottom:0;margin-bottom:0}@media(max-width:700px){.notes{padding-top:48px;padding-bottom:48px}.notes .note-list article:last-child{padding-bottom:0;margin-bottom:0}}
/* Fit the guidance copy as a coherent text block, not a vertically shifted row. */
.notes{max-width:1160px;grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr);gap:64px;padding:56px 5%;align-items:start}.notes>div:first-child{min-width:0}.notes .eyebrow{margin-bottom:16px;line-height:1.5}.notes h2{font-size:34px;font-weight:500;line-height:1.18;letter-spacing:-.035em;max-width:320px}.notes .note-list{min-width:0;max-width:620px}.notes .note-list h3{font-size:18px;font-weight:600;line-height:1.4;letter-spacing:-.02em;margin:0 0 14px}.notes .note-list p,.notes .note-list li{font-size:14px;line-height:1.75;font-weight:400;overflow-wrap:break-word}.notes .note-list ul{margin:0;padding-left:18px}.notes .note-list li+li{margin-top:9px}.notes .note-list article{padding-bottom:22px;margin-bottom:22px}.notes .note-list article:last-child{padding-bottom:0;margin-bottom:0}@media(max-width:700px){.notes{display:block;padding:40px 25px}.notes h2{font-size:30px;line-height:1.2;max-width:none;margin-bottom:26px}.notes .eyebrow{margin-bottom:12px}.notes .note-list h3{font-size:18px;margin-bottom:12px}.notes .note-list p,.notes .note-list li{font-size:14px;line-height:1.75}}

.notes h2 br{display:block}

/* Desktop editorial composition; mobile keeps its approved stacked layout. */
@media(min-width:701px){.notes{display:block;max-width:1200px;padding:60px 5% 64px}.notes>div:first-child{display:grid;grid-template-columns:1fr 3fr;align-items:baseline;gap:40px;margin-bottom:38px}.notes .eyebrow{margin:0;font-size:10px;letter-spacing:.14em}.notes h2{font-size:36px;line-height:1.2;max-width:none;letter-spacing:-.035em}.notes h2 br{display:inline}.notes h2 br:after{content:" "}.notes .note-list{max-width:none}.notes .note-list h3{font-size:17px;margin-bottom:20px}.notes .note-list ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;list-style:none;padding:0;counter-reset:note}.notes .note-list li{position:relative;margin:0;padding-top:18px;border-top:1px solid #ffffff24;line-height:1.7;font-size:15px}.notes .note-list li+li{margin-top:0}.notes .note-list article{padding:0 0 26px;margin:0 0 26px}.notes .note-list article:last-child{padding:0;margin:0}.notes .note-list p{max-width:680px;font-size:15px;line-height:1.7}}

@media(min-width:701px){.notes>div:first-child{display:block;margin-bottom:30px}.notes .eyebrow{margin-bottom:14px}.notes h2 br{display:none}}

/* Tutorial preview: glass depth and clearly identifiable play control. */
.film .player{padding:12px;background:linear-gradient(135deg,#d9ede94d,#6a9b9229 48%,#102a34a8);border-radius:24px;box-shadow:inset 0 2px 2px #ffffff45,inset 0 -2px 3px #001a294d,0 24px 48px #00121980,0 5px 14px #00121966;backdrop-filter:blur(14px)}
.film .player>button,.film .player>iframe{border-radius:15px;overflow:hidden}.film .play{width:88px;height:88px;background:linear-gradient(145deg,#fffffffa,#e0ebe8e8);box-shadow:0 8px 25px #00121985,inset 0 2px 3px white;backdrop-filter:blur(10px)}
.film .play svg{width:56px;height:40px;padding:8px 13px;fill:#fff;background:#f03;border-radius:11px}.film .player button:focus-visible{outline:3px solid #fff;outline-offset:-5px}.film .player button:hover .play{box-shadow:0 10px 30px #001219a0,inset 0 2px 3px white}
@media(max-width:700px){.film .player{padding:8px;border-radius:18px}.film .player>button,.film .player>iframe{border-radius:11px}.film .play{width:68px;height:68px}.film .play svg{width:46px;height:34px;padding:7px 11px;border-radius:9px}}

/* Glass sits outside an exact 16:9 media viewport. */
.film .player{aspect-ratio:auto;padding:14px;background:radial-gradient(ellipse at 5% 0%,#efffffb3,transparent 48%),linear-gradient(125deg,#afd2c53b,#2c545d33 55%,#7ca9a047);box-shadow:inset 0 2px 2px #ffffff88,inset 0 -3px 5px #00121f66,0 5px 5px #00101866,0 28px 45px -10px #000b,0 0 65px -22px #bde9d773;border-radius:27px;backdrop-filter:blur(20px)}
.film .player>button,.film .player>iframe{display:block;width:100%;height:auto;aspect-ratio:16/9;border:0;border-radius:14px;box-shadow:0 2px 7px #0008}.film .player>button img{aspect-ratio:16/9;object-fit:cover}
@media(max-width:700px){.film .player{padding:10px;border-radius:22px}.film .player>button,.film .player>iframe{border-radius:12px}}
body:has(link[rel=canonical][href$="/calm-hustle/"]) h1,body:has(link[rel=canonical][href$="/calm-savings/"]) h1,body:has(link[rel=canonical][href$="/calm-budget/"]) h1{font-size:36px}

.named-title h1{font-size:36px}@media(max-width:700px){.named-title h1{font-size:30px}}
/* One shared detail laptop geometry, independent of source image proportions. */
.hero{grid-template-columns:55% 45%;gap:0}.product-art{width:100%;min-width:0;padding:0 6% 0 0!important}.product-art .laptop{width:100%;max-width:none;margin:0;transform:none!important}.product-art .lid{width:90%;margin:0 5%;padding:2.2% 1.5% 1.5%}.product-art .lid img{display:block;width:100%;height:auto!important;aspect-ratio:16/9!important;object-fit:cover;object-position:center top!important}.product-art .base{width:100%;height:9px}.product-art .art-note{margin-top:28px}
@media(max-width:700px){.product-art{padding:0!important;width:100%}.product-art .base{height:7px}.product-art .art-note{margin-top:22px}}