/* The three concepts have their own visual systems, like real products would. */
.demo-panel{width:min(1120px,calc(100vw - 26px));border-radius:10px;background:#fff;box-shadow:0 28px 100px #080a1699}
.demo-head{padding:13px 22px;background:#13141b;color:#e5e6e0;border-bottom:0}
.demo-head button{color:#e5e6e0;cursor:pointer}
.premium-disclaimer{padding:16px 26px;font-size:.7rem;line-height:1.5;color:#777b80;border-top:1px solid #e7e8e3}
.premium-overline,.rail-label{font-size:.65rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.premium-overline span,.hook-topline i,.guide-topline i{opacity:.4;font-style:normal;margin:0 8px}
button{cursor:pointer}

/* Momentum: a crisp, useful planning application. */
.planner-shell{background:#f2f4ef;color:#13201b}
.premium-mast{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 34px;background:#13392d;color:#f8f7e9}
.premium-mast h2{font-size:clamp(2rem,4.2vw,3.7rem);letter-spacing:-.065em;line-height:1;margin:14px 0 9px}
.premium-mast p:last-child{color:#d1dfd6;font-size:.9rem}
.premium-mark{display:grid;place-items:center;width:74px;height:74px;flex:none;border-radius:18px;background:#d5f775;color:#12372b;font-size:2.5rem;font-weight:900;letter-spacing:-.11em;transform:rotate(8deg)}
.premium-mark span{color:#7b64a7}
.premium-workspace{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:570px}
.premium-rail{padding:26px 20px;background:#e6eae2;border-right:1px solid #d0d9cf}
.premium-rail>.rail-label{color:#5d7068}
.rail-group{margin-top:24px}.rail-group strong{display:block;font-size:.75rem;margin-bottom:10px}
.premium-segments{display:flex;gap:5px}.premium-segments button{flex:1;min-height:35px;padding:6px;border:1px solid #c7d0c6;background:#f6f8f2;border-radius:5px;font-size:.73rem;font-weight:750;color:#314238}
.premium-segments button.active{background:#15382e;color:#f7f7ed;border-color:#15382e}
.rail-note{margin-top:34px;padding:17px;background:#d6f0b7;border-radius:6px;transform:rotate(-1deg)}.rail-note span{font-size:.63rem;letter-spacing:.15em;font-weight:850}.rail-note p{margin:12px 0 0;font-family:Georgia,serif;font-size:1.12rem;line-height:1.2}
.premium-main{padding:28px 30px 30px;min-width:0}
.planner-summary{display:flex;justify-content:space-between;align-items:center;gap:15px}.planner-summary .rail-label{color:#547466}.planner-summary h3{font-size:clamp(1.4rem,2.7vw,2rem);letter-spacing:-.06em;margin:7px 0}.planner-summary p{color:#637169;font-size:.72rem;line-height:1.45;max-width:420px}
.week-graphic{width:140px;flex:none;display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}.week-graphic span{font-size:.53rem;color:#768079;font-weight:800}.week-graphic div{display:contents}.week-graphic i{height:21px;background:#dce2da;border-radius:3px}.week-graphic i.on{background:#a8da76}
.premium-day-list{display:flex;gap:7px;margin:23px 0 25px;overflow:auto}.premium-day-list button{min-width:115px;flex:1;text-align:left;padding:12px;background:#fff;border:1px solid #dce4da;border-radius:6px;color:#26362c}.premium-day-list button.active{background:#d7f39a;border-color:#bfd887}.premium-day-list span,.premium-day-list small{display:block;font-size:.58rem;letter-spacing:.1em;font-weight:850}.premium-day-list strong{display:block;font-size:.8rem;margin:10px 0}.premium-day-list small{color:#52745f}
.premium-tabs{display:flex;gap:23px;border-bottom:1px solid #ccd8ce;overflow-x:auto}.premium-tabs button{border:0;background:transparent;padding:0 2px 12px;color:#66766c;font-weight:800;font-size:.75rem;white-space:nowrap}.premium-tabs button.active{color:#12382d;border-bottom:3px solid #12382d}
.premium-panel{padding:19px 0;min-height:250px}.panel-head{display:flex;justify-content:space-between;align-items:center}.panel-head h4{font-size:1.55rem;letter-spacing:-.055em;margin:5px 0}.panel-time{padding:8px 11px;background:#e8eadf;border-radius:4px;font-size:.63rem;font-weight:900;letter-spacing:.1em}.panel-lead,.panel-foot{font-size:.75rem;color:#68746b;line-height:1.45;max-width:620px;margin:9px 0 15px}.movement-list{border-top:1px solid #dce3dc}.movement-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:9px;padding:10px 0;border-bottom:1px solid #dce3dc;align-items:center}.movement-row>span{font-size:.6rem;color:#839288;font-weight:800}.movement-row strong{display:block;font-size:.77rem}.movement-row small{display:block;color:#65746a;font-size:.63rem;margin-top:3px;line-height:1.25}.movement-row b{font-size:.67rem;color:#284b36;white-space:nowrap}.inline-action{border:0;background:transparent;padding:11px 0;color:#245f40;font-size:.7rem;font-weight:850;text-decoration:underline;text-underline-offset:3px}
.progress-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:14px}.progress-grid>div{padding:15px;background:#e8eee3;border-radius:5px}.progress-grid span{display:block;font-size:.6rem;font-weight:900;color:#50835b;margin-bottom:15px}.progress-grid strong{display:block;font-size:.84rem;line-height:1.2}.progress-grid p,.reason-list p{font-size:.69rem;line-height:1.45;color:#55685a;margin:9px 0 0}.reason-list{display:grid;gap:9px;margin-top:14px}.reason-list p{margin:0;padding:13px 15px;background:#e9efe7;border-radius:4px;font-size:.76rem}.reason-list b{color:#15382e}

/* Kitchen Notes: an editorial book with useful interactive pages. */
.guide-shell{background:#eae3d5;color:#282c27}.guide-topline,.hook-topline{display:flex;justify-content:space-between;gap:12px;padding:15px 24px;font-size:.64rem;letter-spacing:.13em;font-weight:850}.guide-topline{background:#25382e;color:#fff6e9}.guide-spread{display:grid;grid-template-columns:35% 65%;margin:20px auto;width:calc(100% - 42px);min-height:495px;box-shadow:0 13px 34px #433d2c26}.guide-left{position:relative;padding:30px;background:#293d32;color:#f3ebda;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.guide-left:before{content:"";position:absolute;width:270px;height:270px;right:-150px;top:110px;border:45px solid #819b81;border-radius:50%;opacity:.26}.guide-monogram{font-size:3rem;font-family:Georgia,serif;letter-spacing:-.12em}.guide-monogram span{color:#e6a966;font-size:2rem}.guide-left>p{font-family:Georgia,serif;font-size:clamp(2rem,4vw,3.3rem);line-height:.96;letter-spacing:-.07em;z-index:1}.guide-left-foot{display:flex;justify-content:space-between;gap:8px;font-size:.53rem;letter-spacing:.1em;border-top:1px solid #ffffff55;padding-top:13px}
.guide-page{position:relative;display:flex;flex-direction:column;padding:31px 36px 22px;background:#fcf9ef;min-width:0}.guide-page:before{content:"";position:absolute;left:0;top:0;bottom:0;width:9px;background:linear-gradient(90deg,#2c2b2020,transparent)}.guide-chapter{font-size:.6rem;letter-spacing:.15em;font-weight:900;color:#ad6750}.guide-page h2{font-family:Georgia,serif;font-size:clamp(2.3rem,5vw,4.1rem);line-height:.95;letter-spacing:-.075em;font-weight:400;margin:16px 0}.guide-deck{max-width:490px;font-size:.87rem;line-height:1.5;color:#53574c;margin:0}.guide-page-foot{margin-top:auto;padding-top:18px;border-top:1px solid #d8d2bd;display:flex;align-items:end;justify-content:space-between;gap:10px}.guide-page-foot span{font-family:Georgia,serif;font-style:italic;color:#8d6449;font-size:.78rem}.guide-page-foot strong{font-size:.6rem;letter-spacing:.1em;white-space:nowrap}.guide-page-foot i{font-weight:400;font-style:normal}
.ingredient-board{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:24px 0 15px}.ingredient-board>div{display:grid;gap:6px;align-content:start}.ingredient-board span{font-size:.56rem;letter-spacing:.14em;font-weight:900;color:#9b755b;margin-bottom:5px}.ingredient-board button{padding:9px 6px;border:1px solid #d3cbbb;background:#fffdfa;text-align:left;font-size:.7rem;color:#4f5549}.ingredient-board button.active{background:#e7efd8;border-color:#7d9e69;color:#254c31;font-weight:800}.guide-aside{font-family:Georgia,serif;font-size:.83rem;color:#9d6445;font-style:italic;margin:12px 0 19px}.recipe-title{background:#e7eddb;padding:13px 16px;margin:19px 0 0}.recipe-title span{display:block;font-size:.55rem;letter-spacing:.14em;font-weight:900;color:#6b8063}.recipe-title strong{display:block;margin-top:6px;font-family:Georgia,serif;font-size:1.18rem;font-weight:400}.recipe-steps{padding-left:23px;margin:13px 0}.recipe-steps li{font-size:.74rem;line-height:1.4;margin:7px 0;padding-left:3px}.fix-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:24px}.fix-grid>div{padding:13px;background:#ecede0}.fix-grid span{display:block;font-size:.55rem;letter-spacing:.1em;color:#9d6445;font-weight:900}.fix-grid strong{font-family:Georgia,serif;font-size:1.17rem;display:block;margin:10px 0 6px;font-weight:400}.fix-grid p{font-size:.65rem;line-height:1.42;margin:0}.guide-recap{display:flex;gap:9px;flex-wrap:wrap;align-items:baseline;margin-top:35px}.guide-recap span{font-size:.55rem;font-weight:900;letter-spacing:.1em}.guide-recap b{font-family:Georgia,serif;font-size:1.3rem;font-weight:400}.guide-recap i{color:#bc8160}.guide-controls{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 22px 20px}.guide-controls>button{border:0;background:#2d4435;color:#fff7ea;padding:10px 14px;font-size:.68rem;font-weight:800;min-width:118px}.guide-controls>button:disabled{opacity:.4;cursor:default}.guide-progress{display:flex;gap:7px}.guide-progress button{width:7px;height:7px;border-radius:50%;border:0;padding:0;background:#b4ae9d}.guide-progress button.active{background:#344d3b;transform:scale(1.4)}


@media(max-width:800px){.premium-workspace{grid-template-columns:1fr}.premium-rail{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px}.premium-rail>.rail-label,.rail-note{display:none}.rail-group{margin:0}.premium-main{padding:20px}.guide-spread{grid-template-columns:30% 70%}.guide-left{padding:23px}.guide-page{padding:27px}.hook-layout{grid-template-columns:1fr}.hook-input{border-right:0;border-bottom:1px solid #d6d5d0}.hook-input form{grid-template-columns:1fr 1fr}.hook-input form label,.hook-input form input,.hook-input form select,.hook-generate{grid-column:auto}.hook-generate{grid-column:1/-1}.hook-output{padding:20px}}
@media(max-width:620px){.demo-panel{width:calc(100vw - 12px);max-height:calc(100dvh - 12px)}.premium-mast{padding:23px}.premium-mark{width:50px;height:50px;font-size:1.8rem}.premium-rail{grid-template-columns:1fr;gap:12px}.rail-group{display:grid;grid-template-columns:112px 1fr;align-items:center}.rail-group strong{margin:0}.premium-day-list button{min-width:105px}.planner-summary{align-items:start}.week-graphic{display:none}.progress-grid{grid-template-columns:1fr}.guide-topline,.hook-topline{font-size:.52rem}.guide-spread{grid-template-columns:1fr;width:calc(100% - 20px);margin:10px auto}.guide-left{display:none}.guide-page{min-height:510px;padding:25px}.guide-page h2{font-size:3rem}.ingredient-board{gap:5px}.ingredient-board button{font-size:.63rem;padding:8px 4px}.fix-grid{grid-template-columns:1fr;margin-top:13px}.fix-grid>div{padding:8px}.fix-grid strong{margin:3px 0}.guide-controls{margin:0 10px 10px}.guide-controls>button{min-width:90px;font-size:.6rem;padding:9px 6px}.hook-input{padding:24px}.hook-input form{grid-template-columns:1fr}.hook-output{padding:18px}}
@media(prefers-reduced-motion:reduce){.premium-mark{transform:none}}
.guide-cover-art{margin:35px 0 15px;max-width:450px;padding:20px 24px;border:1px solid #d9d3c1;background:#f1f0e6;transform:rotate(-2deg)}.guide-cover-art>span,.guide-cover-art>small{font-size:.56rem;letter-spacing:.16em;font-weight:900;color:#96694d}.guide-cover-art>div{display:flex;align-items:baseline;gap:9px;margin:15px 0}.guide-cover-art b{font-family:Georgia,serif;font-size:clamp(1.25rem,2.8vw,2.1rem);font-weight:400;letter-spacing:-.06em}.guide-cover-art i{font-size:1.15rem;color:#bc8b69;font-style:normal}
