/* N3 Studio: warm, tactile containers shared across the learning experience. */
:root{--panel:#fffef9;--forest:#30452f;--sage:#dfe6d5;--panel-border:#d9dfce;--shadow:0 10px 30px #35472b08,0 2px 4px #35472b04}
body{background:#f8f7f1}
.header{height:94px;border-bottom:0;max-width:1330px}
.header nav{background:#f0f1e8;border:1px solid #e4e7da;border-radius:100px;padding:3px 23px;gap:27px}
.header nav a{font-size:11px}
.studio-link{border-radius:100px;background:var(--panel);border-color:var(--panel-border);padding:13px 18px;box-shadow:0 2px 4px #35472b04}
.brand{color:var(--forest)}
.button{border-radius:9px;padding:17px 22px;font-size:12px}
.button>span{font-size:17px;line-height:1}
.dark{background:var(--forest);box-shadow:0 4px 0 #22332214,0 5px 14px #263d2320}
.dark:hover{background:#253d26}
.hero{position:relative;max-width:1240px;width:calc(100% - 64px);border:1px solid #dfe4d4;border-radius:28px;padding:58px 53px 0;margin-bottom:31px;min-height:0;gap:27px;background:#eef0e5;box-shadow:inset 0 1px 0 #fff,0 8px 28px #35472b04;overflow:hidden;align-items:center}
.hero::before{content:'';position:absolute;width:360px;height:360px;background:#e5ead9;border-radius:50%;top:-240px;left:-130px;pointer-events:none}
.hero-copy{position:relative;padding-bottom:28px}
.hero-copy .eyebrow{font-size:8px;letter-spacing:1.35px}
h1{font-size:clamp(53px,5.2vw,69px);letter-spacing:-3px;margin:23px 0 21px}
.hero-copy>p{font-size:14px;color:#6c775f;line-height:1.8}
.hero-actions{gap:23px;margin-top:26px}
.hero-actions .text-link{border-bottom:0;font-size:11px}
.hero-actions .text-link span{border:1px solid #bfc9b1;border-radius:50%;width:21px;height:21px;display:grid;place-items:center;margin-top:-3px}
.hero-note{font-size:10px;color:#7b856e;margin-top:21px}
.hero-art{height:442px;display:flex;flex-direction:column;justify-content:flex-start;background:#f8f9f2;border:1px solid #c8d3bb;border-radius:17px;box-shadow:0 15px 30px #2d41251c,0 3px 6px #2d412508;align-self:center;transform:rotate(2deg);margin-bottom:34px}
.art-grid{inset:43px 0 0;background-color:#f0f3e8;border-radius:0 0 17px 17px;transform:none;background-image:linear-gradient(#cdd6c14d 1px,transparent 1px),linear-gradient(90deg,#cdd6c14d 1px,transparent 1px);background-size:22px 22px}
.demo-chrome{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--forest);color:#dce6d1;width:100%;min-height:43px;border-radius:16px 16px 0 0;padding:0 14px;font-size:6px;letter-spacing:1.1px}
.window-dots{display:flex;gap:4px;align-items:center}
.window-dots i{display:block;width:5px;height:5px;border-radius:50%;background:#8b9c7b}
.window-dots i:first-child{background:#c59b7f}
.window-dots i:nth-child(2){background:#b6b99b}
.live-pill{display:flex;align-items:center;gap:4px;border:1px solid #879d7770;border-radius:20px;padding:4px 6px;font-size:5px;white-space:nowrap}
.live-pill i{height:4px;width:4px;background:#adbf8d;border-radius:50%}
.practice-card{width:calc(100% - 40px);padding:21px 23px 17px;transform:rotate(-2deg);margin:23px 0 0;border-radius:12px;box-shadow:0 8px 15px #2d41250c,0 0 0 1px #d3dbc7}
.practice-top{font-size:7px;color:#69795d;letter-spacing:1px;gap:8px}
.question-pill{background:#eef2e5;border:1px solid #dce3cf;padding:5px 7px;border-radius:6px;white-space:nowrap;letter-spacing:1px}
.mini-progress{margin:16px 0 20px;height:4px;background:#e7ebdd}
.mini-progress span{border-radius:4px;background:#718956}
.practice-card h2{font-size:24px;letter-spacing:-.6px;margin-top:8px}
.practice-card .label{font-size:7px;letter-spacing:1.3px}
.equation{margin:16px 0;padding:17px 0;border:1px solid #e3e6d8;border-radius:9px;background:#f7f8ef;font-size:40px}
.hero-answers{gap:8px}
.hero-answers button{border:1px solid #cfd8c1;box-shadow:0 3px 0 #e5e9db;border-radius:7px;font-size:12px;padding:11px 0;background:#fffef9}
.hero-answers button:hover{transform:translateY(-2px)}
.hero-feedback{min-height:35px;font-size:9px;padding-top:13px}
.insight-card{position:absolute;right:-10px;bottom:25px;border-radius:10px;padding:13px 17px;background:#e5ebd8;border-color:#c4d0b2;transform:rotate(-3deg);box-shadow:0 5px 13px #2d412510;gap:10px}
.insight-card strong{font-size:10px}
.insight-card div>span{font-size:8px}
.insight-icon{height:29px;width:29px;background:#d3dec4;border-radius:7px;font-size:24px;display:grid;place-items:center}
.art-note{display:none}
.sunburst{font-size:51px;bottom:20px;left:17px;color:#b16a4c;z-index:2}
.art-caption{font-size:6px;bottom:9px;left:0;right:0;text-align:center;letter-spacing:1.1px;color:#7e8c6c}
.hero-bottom{grid-column:1/-1;display:flex;justify-content:space-between;gap:18px;position:relative;border-top:1px solid #d9dfcd;padding:20px 0 21px;color:#66785a;font-size:10px}
.hero-bottom>span{display:flex;align-items:center;gap:9px}
.hero-bottom i{height:22px;width:22px;display:grid;place-items:center;background:#e1e7d5;border:1px solid #d2dcc4;border-radius:6px;font-size:12px;font-style:normal}
.subject-strip{background:transparent;border:0;padding:7px 0 10px}
.subject-strip span:first-child{font-size:7px;letter-spacing:1.2px}
.subject-strip span{font-size:11px;color:#7b826f}
.subject-strip i{color:#a5ac97}
.section{padding-top:61px;padding-bottom:63px}
.section-heading{margin-bottom:27px}
.section-heading h2{font-size:42px;letter-spacing:-1.6px}
.section-heading p{color:#828977;font-size:12px}
.shelf-toolbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:17px;font-size:9px;color:#8a917e}
.shelf-toolbar>span:last-child{font:italic 14px var(--serif);color:#9d674d}
.shelf-toolbar>span:last-child>span{font:18px Arial;margin-left:7px}
.shelf-status{display:flex;align-items:center;gap:7px;letter-spacing:1.2px;font-size:7px}
.shelf-status i{display:block;width:5px;height:5px;border-radius:50%;background:#7f9568;box-shadow:0 0 0 3px #e9edde}
.activity-grid{gap:23px;align-items:stretch}
.activity-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:20px;padding:9px;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}
.activity-card:hover{transform:translateY(-5px);box-shadow:0 17px 35px #35472b12,0 3px 5px #35472b05}
.activity-art{border-radius:12px;height:245px;flex-shrink:0;padding:18px;outline-offset:3px!important}
.activity-art:hover{transform:none}
.activity-art::after{content:'';position:absolute;inset:0;pointer-events:none;border:1px solid #3e4b3310;border-radius:12px}
.algebra{background-color:#dce5cf;background-image:linear-gradient(#7f956814 1px,transparent 1px),linear-gradient(90deg,#7f956814 1px,transparent 1px);background-size:24px 24px}
.sat{background-color:#ecd5c6;background-image:radial-gradient(#ae79642c .75px,transparent .75px);background-size:12px 12px}
.basics{background-color:#e9e1c9;background-image:linear-gradient(-45deg,transparent 49.7%,#b69c6312 50%,transparent 50.3%);background-size:20px 20px}
.art-tag{background:#fffdf763;border:1px solid #fffdf7a8;border-radius:30px;padding:7px 10px;font-size:6px;letter-spacing:1px;box-shadow:0 2px 5px #35472b04}
.art-bottom{font-size:6px;letter-spacing:.7px;border-top:1px solid #3f50341f;padding-top:10px}
.art-bottom>span{font-size:16px}
.pipe-question{border:1px solid #c6d2b5;border-radius:7px;box-shadow:0 5px 0 #a7b69730;font-size:17px}
.floating-math{border:1px solid #d8b29e;border-radius:6px;box-shadow:0 4px 0 #bd93772a}
.activity-info{padding:14px 14px 10px;display:flex;flex-direction:column;flex:1}
.activity-features{display:flex;gap:9px;color:#879178;font-size:7px;padding-bottom:17px}
.activity-features span{padding:5px 7px;border-radius:5px;background:#f0f3e9;border:1px solid #e7ecdf;white-space:nowrap}
.card-meta{font-size:7px;color:#6c7c5d;letter-spacing:1px;align-items:center;flex-wrap:wrap}
.card-meta>span{font-size:6px;letter-spacing:.2px;color:#929a85}
.activity-info h3{font-size:25px;line-height:1.15;letter-spacing:-.7px;margin:12px 0 10px}
.activity-info p{font-size:12px;line-height:1.7;min-height:43px;margin-bottom:18px}
.card-link{background:var(--forest);border:1px solid #29412c;border-radius:8px;color:#fbfcf5;padding:13px 15px;font-size:10px;margin-top:auto;transition:background .2s;min-height:43px;align-items:center}
.card-link:hover{background:#42623c}
.card-link span{font-size:16px}
.shelf-note{font-size:8px;margin:20px 2px 0;line-height:1.6}
.method{background:transparent;border:0;padding:0}
.method-grid{max-width:1144px;width:calc(100% - 96px);background:#ecf0e3;border:1px solid #d8e0ca;border-radius:24px;padding:44px 47px;gap:60px;box-shadow:inset 0 1px 0 #ffffffa0}
.method-copy{padding:7px 0}
.method h2{font-size:46px;margin:22px 0 18px}
.method p{font-size:12px}
.method .text-link{font-size:11px;border-color:#b4bea4}
.method-steps{display:flex;flex-direction:column;justify-content:center;gap:13px;padding:0}
.method-steps>div{background:#fffef8;border:1px solid #dbe2ce;border-radius:13px;box-shadow:0 4px 10px #35472b04;padding:20px 22px;gap:16px;align-items:flex-start}
.method-steps>div:last-child{border:1px solid #dbe2ce}
.method-steps>div>.step-icon{position:relative;display:grid;place-items:center;min-width:38px;height:38px;border-radius:9px;background:#e9eedf;color:#647c4c;font:23px var(--serif);padding:0;margin-top:2px}
.step-icon small{position:absolute;bottom:-5px;right:-5px;font:7px Arial;background:var(--forest);color:#eaf1e1;border:2px solid #fffef8;border-radius:20px;padding:3px}
.method-steps h3{font-size:24px;letter-spacing:-.6px;margin-bottom:7px}
.method-steps p{font-size:11px;line-height:1.7}
.custom-box{position:relative;border-radius:24px;isolation:isolate;overflow:hidden;background:#30452f;border:1px solid #263e27;padding:51px 55px;gap:90px;box-shadow:0 14px 28px #30452f12}
.custom-watermark{position:absolute;left:-60px;bottom:-115px;font-size:420px;line-height:1;color:#98b17b0b;z-index:-1;transform:rotate(12deg);pointer-events:none}
.custom-copy .eyebrow{font-size:6px;letter-spacing:1px;gap:9px;flex-wrap:wrap}
.custom-badge{font-size:6px;letter-spacing:1px;border:1px solid #9bb78657;padding:7px 9px;border-radius:20px;color:#e0ebd4;background:#ffffff06}
.custom-copy h2{font-size:40px;margin-top:23px}
.custom-copy small{font-size:8px}
.custom-copy .button{font-size:11px;padding:16px 19px;border:1px solid #fff9}
.brief-art{border-radius:12px;border:1px solid #d6d8c5;box-shadow:9px 10px 0 #e4e8d626,18px 20px 0 #e4e8d610;transform:rotate(4deg);padding:33px 27px 21px;max-width:340px}
.paper-clip{top:-16px}
.brief-art>div:not(.paper-clip){padding:16px 0}
.brief-art i{background:#e1e7d3;display:grid;place-items:center;width:17px;height:17px;margin-top:-3px;border-radius:50%;font-size:9px}
.faq{gap:75px;padding-top:9px;padding-bottom:60px}
.faq>div:last-child{display:flex;flex-direction:column;gap:10px}
.faq details{border:1px solid var(--panel-border);border-radius:11px;background:var(--panel);padding:18px 19px;box-shadow:0 2px 5px #35472b03}
.faq details:first-child{padding-top:18px}
.faq summary{font-size:11px;align-items:center;gap:12px}
.faq summary span{width:21px;height:21px;border-radius:5px;display:grid;place-items:center;background:#edf1e4;color:#71865d;flex-shrink:0;font-size:17px;line-height:1}
.faq p{font-size:11px}
.closing{width:calc(100% - 96px);max-width:1144px;background:#efeadd;border:1px solid #e0d8c4;border-radius:24px;position:relative;padding-top:42px;padding-bottom:45px;margin-bottom:44px;overflow:hidden}
.closing::before,.closing::after{content:'';position:absolute;height:250px;width:250px;border:1px solid #d9cbb480;border-radius:50%;pointer-events:none}
.closing::before{left:-140px;top:-100px;box-shadow:0 0 0 22px #d9cbb41a,0 0 0 45px #d9cbb410}
.closing::after{right:-160px;bottom:-110px;box-shadow:0 0 0 22px #d9cbb41a,0 0 0 45px #d9cbb410}
.closing-stamp{display:grid;width:44px;height:44px;place-items:center;background:#e8dcc6;border:1px solid #dbccb2;border-radius:12px;margin:auto;font-size:29px!important;transform:rotate(-7deg)}
.closing h2{font-size:43px;margin:19px 0 24px}
footer{padding-top:25px!important;padding-bottom:30px!important;border-top:1px solid #e3e6d9}
/* The same container system continues inside the working demos and forms. */
dialog{background:#fffef9;border:1px solid #d2dcc6;border-radius:22px;box-shadow:0 30px 100px #10230e4a;max-height:91dvh}
dialog::backdrop{background:#172713b8;backdrop-filter:blur(7px)}
#modal-body{padding:44px 39px 34px}
.close{border-radius:9px;background:#f2f5ea;border-color:#dce3cf;top:16px;right:16px;font-size:23px;color:#637953}
.modal-eyebrow{font-size:8px;letter-spacing:1.4px;background:#edf2e4;border:1px solid #dfe6d3;border-radius:30px;width:fit-content;max-width:calc(100% - 35px);padding:7px 10px;color:#6b8058;margin-bottom:18px}
.modal-title{font-size:38px;margin-right:15px}
.form-note{border:1px solid #dfe6d0;border-radius:10px;background:#f0f4e8;font-size:11px;padding:15px 17px}
.form-field{font-size:11px}
.form-field>span{font-weight:600;color:#5d7150}
.form-field input,.form-field textarea,.form-field select{border-radius:8px;border-color:#d2dcc6;background:#f8faf3;padding:14px;box-shadow:inset 0 2px 3px #35472b03}
.quiz-top{color:#748565;font-size:9px;border-bottom:1px solid #e6eadc;padding-bottom:15px;gap:20px;align-items:center;margin-right:33px;line-height:1.6}
.quiz-top>span:last-child{white-space:nowrap;background:#eef2e6;padding:4px 8px;border-radius:5px}
.quiz-progress{margin:20px 0 26px;height:5px;background:#e6ebdb}
.quiz-progress>div{background:#7d975f}
.question{font-size:29px;letter-spacing:-.5px;line-height:1.35;margin:12px 0 26px}
.choice{border-radius:10px;box-shadow:0 3px 0 #e9edde;padding:15px 16px;border-color:#d3ddc6;transition:background .2s,transform .2s}
.choice:hover:not(:disabled){transform:translateY(-1px)}
.choice>span{border-radius:6px;background:#eff3e7;border:1px solid #e0e7d3;color:#799066;width:29px;height:29px}
.choice.right{background:#e3ecd6;border-color:#87a36c;box-shadow:0 3px 0 #cbdcba}
.choice.wrong{background:#f4e6dc;border-color:#c48f70;box-shadow:0 3px 0 #e5cdbb}
.hint{border:1px solid #e5d8bd;border-radius:10px;padding:15px;background:#f5efe2}
.hint-btn{color:#947047;font-size:11px;padding:11px 0}
.explanation{border:1px solid #d9e3c9;border-radius:13px;background:#f0f5e7;padding:23px;position:relative}
.explanation h3{font-size:24px;color:#426037}
.explanation ol{list-style:none;padding:0;counter-reset:steps}
.explanation li{counter-increment:steps;position:relative;padding:12px 0 12px 35px;border-bottom:1px solid #dfe7d3;line-height:1.7;font-size:12px;margin:0}
.explanation li:last-child{border-bottom:0}
.explanation li::before{content:counter(steps,decimal-leading-zero);position:absolute;left:0;top:15px;font-size:8px;background:#dce7cd;color:#5f774a;width:22px;height:22px;display:grid;place-items:center;border-radius:6px}
.explanation .takeaway{font-size:11px;line-height:1.7;border-color:#d0ddbf;color:#6b8056}
.score-ring{background:#eff4e5;border:8px solid #dae7c8;outline:1px solid #c7d6b4;color:#48603b;box-shadow:0 0 0 7px #f5f8ee;font-size:45px;width:150px;height:150px;margin:31px auto}
.report-row{background:#f8faf3;border:1px solid #e2e8d7;border-radius:10px;padding:14px 16px;margin-top:8px;align-items:center}
.report-symbol{width:27px;height:27px;display:grid;place-items:center;border-radius:7px;background:#e6eedb;flex-shrink:0}
.report-symbol.review{background:#f2e8dc}
.studio-item{background:#f2f5ea;border:1px solid #dce5ce;border-radius:12px;padding:20px}
.brief-preview{background:#f7f8ef;border:1px solid #dce3ce;border-radius:12px;padding:23px}
#toast{border-radius:12px;border:1px solid #7e966955;box-shadow:0 8px 25px #20391830}
@media(min-width:1450px){.hero{max-width:1280px}.hero-art{height:450px}.practice-card{padding:23px 25px 18px}.method-grid,.closing{max-width:1224px}}
@media(max-width:1100px) and (min-width:701px){.hero{padding:45px 34px 0;gap:20px}.hero-copy .eyebrow{font-size:7px}.hero-actions{gap:15px}.hero-actions .button{padding:15px 17px;font-size:11px;gap:15px}.hero-art{height:412px}.demo-chrome{font-size:5px;padding:0 11px;gap:7px}.practice-card{padding:19px;width:calc(100% - 28px);margin-top:18px}.practice-card h2{font-size:22px}.practice-top{font-size:6px;letter-spacing:.5px}.equation{font-size:36px;padding:15px 0;margin:14px 0}.insight-card{bottom:21px;right:-7px;padding:11px 13px}.insight-card strong{font-size:9px}.hero-answers button{font-size:11px}.hero-bottom{font-size:9px}.activity-art{height:230px;padding:15px}.activity-info{padding:13px 9px 9px}.activity-info h3{font-size:23px}.activity-info p{font-size:11px;min-height:56px}.activity-features{gap:5px;font-size:6px}.activity-features span{padding:5px}.card-meta{font-size:6px}.method-grid{width:calc(100% - 60px);padding:35px;gap:35px}.method h2{font-size:42px}.method-steps>div{padding:19px 16px}.custom-box{padding:41px 37px;gap:50px}.custom-copy h2{font-size:35px}.brief-art{padding:29px 23px 20px}.closing{width:calc(100% - 60px)}}
@media(max-width:700px){.header{height:77px;padding:0 21px}.header nav{display:none}.studio-link{font-size:10px;padding:11px 14px}.hero{width:calc(100% - 24px);border-radius:22px;grid-template-columns:1fr;padding:29px 20px 0;gap:25px;margin-bottom:23px;overflow:hidden}.hero-copy{padding-bottom:0}.hero-copy .eyebrow{font-size:6px;letter-spacing:1.15px;gap:6px}.tiny-star{font-size:17px}h1{font-size:52px;letter-spacing:-2.5px;margin:17px 0 18px;line-height:1.06}.hero-copy>p{font-size:12px;line-height:1.8}.hero-actions{gap:18px;margin-top:23px}.hero-actions .button{font-size:10px;padding:15px;gap:19px;min-height:47px}.hero-actions .text-link{font-size:10px;gap:8px;white-space:nowrap}.hero-actions .text-link span{width:19px;height:19px;font-size:10px;margin-top:-2px}.hero-note{font-size:8px;margin-top:17px}.hero-art{width:calc(100% - 10px);max-width:354px;height:395px;transform:rotate(1.7deg);margin:6px auto 2px;border-radius:14px}.demo-chrome{min-height:38px;border-radius:13px 13px 0 0;font-size:5px;letter-spacing:.6px;padding:0 11px;gap:6px}.live-pill{font-size:4.5px;padding:4px 5px;letter-spacing:.5px}.window-dots{gap:3px}.window-dots i{width:4px;height:4px}.art-grid{inset:38px 0 0;border-radius:0 0 14px 14px}.practice-card{padding:17px 17px 13px;width:calc(100% - 29px);border-radius:10px;margin:19px 0 0}.practice-top{font-size:6px;letter-spacing:.6px;gap:7px}.practice-card h2{font-size:22px;margin-top:7px}.practice-card .label{font-size:6px;letter-spacing:1.1px}.question-pill{font-size:6px;padding:4px 6px}.mini-progress{margin:13px 0 18px;height:3px}.equation{font-size:36px;padding:16px 0;margin:14px 0;border-radius:8px}.hero-answers{gap:7px}.hero-answers button{font-size:11px;min-height:40px;padding:9px 0;border-radius:7px}.hero-feedback{font-size:8px;min-height:30px;padding-top:12px;line-height:1.7}.insight-card{padding:11px 12px;right:-8px;bottom:22px;gap:9px;border-radius:8px}.insight-card strong{font-size:8px}.insight-card div>span{font-size:7px}.insight-icon{font-size:22px;width:26px;height:26px}.sunburst{font-size:39px;left:12px;bottom:21px}.art-caption{font-size:4.8px;bottom:8px;letter-spacing:.8px}.hero-bottom{flex-wrap:wrap;justify-content:center;gap:10px 20px;padding:16px 0 19px;margin-top:1px;font-size:8px}.hero-bottom>span{gap:6px}.hero-bottom i{height:19px;width:19px;border-radius:5px;font-size:10px}.subject-strip{margin:0;padding:3px 0 9px}.subject-strip>.wrap{gap:11px}.subject-strip span:first-child{font-size:6px;margin-bottom:1px}.subject-strip span{font-size:9px}.section{padding-top:43px;padding-bottom:43px}.section-heading{margin-bottom:23px}.section-heading h2{font-size:34px}.section-heading p{font-size:11px}.shelf-toolbar{font-size:7px;margin-bottom:14px}.shelf-status{font-size:6px;letter-spacing:.7px}.shelf-toolbar>span:last-child{font-size:12px}.activity-grid{gap:19px}.activity-card{border-radius:20px;padding:9px;border:1px solid var(--panel-border);box-shadow:var(--shadow)}.activity-card:last-child{border:1px solid var(--panel-border)}.activity-card:hover{transform:none}.activity-art{height:244px;border-radius:12px;padding:19px}.art-tag{font-size:6px;padding:7px 10px}.art-bottom{font-size:6px;padding-top:10px}.activity-info{padding:15px 13px 11px}.activity-features{font-size:7px;gap:8px;padding-bottom:17px}.activity-features span{padding:6px 8px}.card-meta{font-size:7px;letter-spacing:.7px;gap:10px}.card-meta>span{font-size:6px}.activity-info h3{font-size:27px;line-height:1.2;margin:12px 0 11px}.activity-info p{font-size:12px;min-height:0;margin-bottom:20px;max-width:100%}.card-link{padding:14px 16px;font-size:11px;min-height:46px;border:1px solid #29412c;margin-top:auto}.shelf-note{font-size:7px;margin-top:17px}.pipe-visual{width:235px}.sat-visual{width:250px;max-width:100%}.fraction-visual{width:245px;max-width:100%}.fraction-circle{left:8px}.fraction-label{font-size:23px;right:0}.method{padding:0}.method-grid{width:calc(100% - 26px);padding:30px 23px;border-radius:21px;gap:24px}.method-copy{padding:0}.method h2{font-size:39px;margin:19px 0 17px;letter-spacing:-1.4px}.method p{font-size:12px}.method .text-link{margin-top:11px}.method-steps{gap:11px}.method-steps>div,.method-steps>div:last-child{padding:19px 16px;border:1px solid #dbe2ce;border-radius:12px;gap:15px}.method-steps h3{font-size:23px;margin-bottom:7px}.method-steps p{font-size:10px}.method-steps>div>.step-icon{min-width:33px;height:33px;font-size:21px}.custom-box{border-radius:21px;padding:30px 24px 40px;gap:39px}.custom-copy h2{font-size:33px}.custom-copy .eyebrow{font-size:5px;gap:8px}.custom-badge{font-size:5px;letter-spacing:.6px;padding:6px 8px}.custom-copy p{font-size:12px;line-height:1.8}.custom-copy .button{font-size:10px;padding:15px 17px}.custom-copy small{font-size:7px}.brief-art{padding:31px 22px 19px;max-width:265px;border-radius:10px;box-shadow:7px 8px 0 #e4e8d626,14px 16px 0 #e4e8d610}.brief-art h3{font-size:27px}.brief-art>div:not(.paper-clip){padding:15px 0;font-size:9px}.brief-art .label{font-size:7px}.paper-signature{font-size:12px}.faq{padding-top:1px;padding-bottom:41px;gap:24px}.faq h2{font-size:31px}.faq details,.faq details:first-child{padding:17px 16px;border-radius:10px}.faq summary{font-size:11px}.faq p{font-size:11px}.closing{width:calc(100% - 26px);border-radius:21px;padding:31px 22px 34px;margin-bottom:30px}.closing h2{font-size:34px;margin:18px 0 24px}.closing .button{font-size:10px}.closing-stamp{width:39px;height:39px;border-radius:11px;font-size:25px!important}footer{padding-top:23px!important;padding-bottom:23px!important}dialog{border-radius:17px;width:calc(100% - 20px);max-height:93dvh}#modal-body{padding:38px 22px 25px}.close{top:12px;right:12px;width:32px;height:32px;border-radius:8px;font-size:22px}.modal-eyebrow{font-size:7px;padding:6px 9px;margin-bottom:16px;letter-spacing:1px}.modal-title{font-size:31px;margin-right:10px}.modal-subtitle{font-size:12px}.quiz-top{font-size:8px;margin-right:30px;gap:14px;padding-bottom:14px}.question{font-size:25px;line-height:1.35;margin-bottom:22px}.quiz-progress{margin:18px 0 23px}.choice{padding:13px;font-size:13px;min-height:54px;gap:13px}.choice>span{width:27px;height:27px}.explanation{padding:19px 17px;border-radius:11px}.explanation h3{font-size:23px}.explanation li{font-size:11px;padding-left:31px}.explanation li::before{width:21px;height:21px}.explanation .takeaway{font-size:10px}.form-note{font-size:10px;padding:13px}.report-row{padding:13px 11px;gap:9px;font-size:11px}.report-row button{font-size:9px}.report-symbol{width:24px;height:24px}.studio-item{padding:17px}.studio-item strong{font-size:22px}.modal-buttons{gap:10px}.modal-buttons .button{font-size:10px;padding:14px 16px;gap:12px}}
@media(max-width:360px){h1{font-size:47px}.hero{padding-left:15px;padding-right:15px}.hero-actions{gap:12px}.hero-actions .button{padding:14px 12px;gap:12px}.hero-actions .text-link{font-size:9px}.practice-card h2{font-size:20px}.hero-art{height:391px}.activity-features{font-size:6px}.method-grid{padding-left:19px;padding-right:19px}}
@media(prefers-reduced-motion:reduce){.activity-card:hover,.hero-answers button:hover,.choice:hover{transform:none}}
/* Keep the dismiss control reachable when a long explanation scrolls. */
.close{position:sticky;top:12px;right:auto;float:right;margin:12px 12px -47px 0}
@media(max-width:700px){.close{margin-bottom:-44px}.activity-features{font-size:8px}.card-meta{font-size:8px}.card-meta>span{font-size:7px}.art-tag{font-size:7px}.hero-copy .eyebrow{font-size:7px}.hero-note{font-size:9px}}
@media(max-width:360px){h1{font-size:40px}.hero-copy .eyebrow{font-size:6px}.practice-card h2{font-size:19px}.hero-art{height:400px}.activity-features{font-size:7px}.activity-info{padding-left:10px;padding-right:10px}.fraction-label{font-size:20px}.fraction-circle{width:108px;height:108px;left:0}.fraction-circle span{font-size:32px;left:31px;top:34px}}
/* A live window into the same HTML files supplied by the download buttons. */
.deliverable-section{padding-top:0;padding-bottom:65px;scroll-margin-top:20px}
.file-preview-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:32px;align-items:center}
.file-preview-copy{padding:12px 0}
.file-format-badge{font-size:6px;letter-spacing:1px;line-height:1.7;color:#7c8b6a;display:flex;gap:7px;align-items:center}
.file-format-badge>span{font-size:17px;color:#9c6549}
.file-preview-copy h3{font:34px/1.15 var(--serif);letter-spacing:-1px;margin:20px 0 17px}
.file-preview-copy>p{font-size:12px;line-height:1.9;color:#869079;margin-bottom:25px}
.file-feature{display:flex;gap:13px;padding:15px 0;border-top:1px solid #e2e7d9}
.file-feature>span{font-size:8px;color:#809468;background:#eaf0e0;border:1px solid #dce5ce;border-radius:6px;display:grid;place-items:center;height:25px;width:25px;flex-shrink:0}
.file-feature strong{display:block;font-size:11px;font-weight:500;margin:1px 0 6px}
.file-feature small{font-size:10px;color:#8b947e;line-height:1.7;display:block}
.file-preview-copy .button{font-size:10px;padding:15px 18px;gap:30px;margin-top:20px}
.download-caption{display:block;font-size:8px;line-height:1.8;color:#929b86;margin:13px 1px}
.file-preview-window{border:1px solid #cbd7bd;border-radius:17px;background:#fffef8;box-shadow:0 12px 35px #344d2710;overflow:hidden;min-width:0}
.file-preview-toolbar{height:43px;background:#30452f;color:#d2dec4;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:0 15px}
.file-preview-toolbar>span:nth-child(2){font-size:8px;letter-spacing:.4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-preview-toolbar>button{color:#c9d6ba;border:1px solid #ffffff30;border-radius:5px;width:25px;height:25px;font-size:14px;flex-shrink:0}
.preview-tabs{display:flex;gap:5px;align-items:center;padding:11px 13px;border-bottom:1px solid #dbe4cd;background:#f0f4e8}
.preview-tabs button{font-size:9px;padding:9px 13px;border:1px solid transparent;border-radius:6px;color:#7c8f69}
.preview-tabs button[aria-pressed="true"]{background:#fffef8;border-color:#d8e2ca;color:#3b572f;box-shadow:0 2px 4px #30452f05}
#deliverable-frame{display:block;border:0;width:100%;height:630px;background:#f6f6ee}
.file-preview-caption{padding:13px 15px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #dde5d0;background:#f8faf2}
.file-preview-caption>span{font-size:6px;letter-spacing:.6px;color:#8a977b;display:flex;gap:6px;align-items:center}
.file-preview-caption i{display:block;height:4px;width:4px;background:#7e9862;border-radius:50%}
.file-preview-caption button{font-size:9px;color:#6e815b;padding:5px;white-space:nowrap}
#activity-preview{width:min(1150px,calc(100% - 32px));height:91dvh;max-height:91dvh;padding:0;border:1px solid #a7ba92;border-radius:18px;background:#f7f8f0;overflow:hidden;box-shadow:0 30px 100px #14241055}
#activity-preview[open]{display:flex;flex-direction:column}
.activity-preview-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 20px;border-bottom:1px solid #d8e2ca;background:#f7f9ef;flex-shrink:0}
.activity-preview-bar>div:first-child>span{font-size:7px;letter-spacing:1px;color:#91a17e;display:block;margin-bottom:5px}
.activity-preview-bar h2{font:23px var(--serif);letter-spacing:-.5px}
.activity-preview-actions{display:flex;align-items:center;gap:17px}
.activity-preview-actions>a{font-size:10px;border:1px solid #c5d2b6;background:#fffef8;padding:11px 13px;border-radius:7px;white-space:nowrap}
.activity-preview-actions>button{border:1px solid #cfdbc1;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font-size:23px;background:#ecf1e2}
#full-activity-frame{width:100%;height:100%;min-height:0;flex:1;border:0;display:block;background:#f6f6ee}
@media(max-width:1000px) and (min-width:701px){.file-preview-layout{grid-template-columns:235px minmax(0,1fr);gap:25px}.file-preview-copy h3{font-size:30px}.file-preview-copy>p{font-size:11px}.file-preview-copy .button{gap:15px}.file-preview-caption>span{font-size:5px}.file-preview-caption button{font-size:8px}}
@media(max-width:700px){.deliverable-section{padding-top:0;padding-bottom:41px}.file-preview-layout{grid-template-columns:1fr;gap:25px}.file-preview-copy{padding:0}.file-format-badge{font-size:7px;letter-spacing:.6px}.file-preview-copy h3{font-size:32px;margin:17px 0 15px}.file-preview-copy>p{font-size:12px;margin-bottom:21px}.file-preview-copy h3 br{display:none}.file-feature{padding:13px 0;gap:13px}.file-feature strong{font-size:12px}.file-feature small{font-size:10px}.file-preview-copy .button{margin-top:18px;font-size:11px}.download-caption{font-size:9px;line-height:1.8}.file-preview-toolbar{height:41px;padding:0 12px;gap:9px}.file-preview-toolbar>span:nth-child(2){font-size:7px}.preview-tabs{padding:9px 10px;gap:4px}.preview-tabs button{font-size:9px;padding:10px 11px}#deliverable-frame{height:590px}.file-preview-window{border-radius:14px}.file-preview-caption{padding:12px 10px;align-items:center;flex-wrap:wrap;gap:9px}.file-preview-caption>span{font-size:6px;letter-spacing:.4px}.file-preview-caption button{font-size:9px;padding:4px 0}#activity-preview{width:calc(100% - 10px);height:96dvh;max-height:96dvh;border-radius:13px}.activity-preview-bar{padding:12px 13px;gap:12px;align-items:center}.activity-preview-bar h2{font-size:19px}.activity-preview-bar>div:first-child>span{font-size:5px;letter-spacing:.5px}.activity-preview-actions{gap:8px}.activity-preview-actions>a{font-size:8px;padding:9px}.activity-preview-actions>button{width:29px;height:29px;border-radius:7px;font-size:22px}.activity-info p{min-height:0}}
@media(max-width:360px){.activity-preview-bar h2{font-size:17px}.activity-preview-actions>a{font-size:7px;padding:8px 7px}.activity-preview-actions{gap:5px}.activity-preview-bar{padding:11px 10px;gap:8px}.preview-tabs button{font-size:8px;padding:9px 10px}}
/* Advanced subject and exam samples keep their own visual identity. */
.subject-strip>.wrap{flex-wrap:wrap;row-gap:12px;column-gap:21px;justify-content:center}
.activity-grid{row-gap:25px}
.statistics-art{background:#dce6e1;background-image:linear-gradient(#78958a12 1px,transparent 1px),linear-gradient(90deg,#78958a12 1px,transparent 1px);background-size:22px 22px}
.ged-art{background:#ece3cc;background-image:radial-gradient(#a6906422 .75px,transparent .75px);background-size:12px 12px}
.gre-art{background:#dbe5d5;background-image:linear-gradient(135deg,transparent 49.7%,#72856b14 50%,transparent 50.3%);background-size:22px 22px}
.statistics-visual,.ged-visual,.gre-visual{height:160px;width:260px;max-width:100%;align-self:center;position:relative}
.statistics-visual svg{display:block;width:100%;height:150px;padding-top:18px}
.statistics-visual svg text{fill:#6f877d;font:10px Georgia,serif}
.formula-note{position:absolute;top:7px;left:7px;font:italic 14px var(--serif);color:#6b8278;transform:rotate(-5deg)}
.math-sticker{position:absolute;right:0;bottom:0;padding:8px 11px;border:1px solid #a7b9aa80;background:#f6f6ec;border-radius:6px;box-shadow:0 3px 0 #80947d18;font:italic 14px var(--serif);transform:rotate(5deg)}
.statistics-visual .math-sticker{bottom:10px;right:3px;font-size:17px}
.ged-note,.gre-note{position:absolute;font:italic 19px var(--serif);color:#927341;top:5px;left:9px;transform:rotate(-7deg)}
.ged-steps{display:flex;align-items:flex-end;position:absolute;bottom:17px;left:25px;gap:4px;height:100px}
.ged-steps>span{width:59px;height:42px;display:flex;align-items:center;justify-content:center;font:italic 16px var(--serif);color:#f8f4e9;background:#bca677;border:1px solid #a38c5a;border-radius:3px 3px 0 0;box-shadow:inset 0 7px #d4c29b88}
.ged-steps>span:nth-child(2){height:66px;background:#a79262}
.ged-steps>span:nth-child(3){height:94px;background:#8a784b}
.ged-steps b{position:absolute;top:-12px;right:8px;font:30px Georgia,serif;color:#a07a42}
.ged-visual .math-sticker{right:4px;bottom:0;font-size:12px;border-color:#cbb88f}
.gre-note{font-size:16px;color:#66805d;left:8px;top:7px}
.comparison{display:flex;align-items:center;justify-content:center;gap:20px;position:absolute;left:19px;right:15px;top:43px}
.comparison>div{width:85px;height:88px;background:#eef3e8;border:1px solid #a6b99a99;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px 0 #9cae9122}
.comparison small{font-size:6px;letter-spacing:1px;color:#7a8c6d}
.comparison b{font:italic 48px var(--serif);line-height:1.1;color:#4a6745}
.comparison>span{font:italic 22px var(--serif);color:#7c906c}
.gre-visual .math-sticker{bottom:-3px;right:10px;font-size:14px}
.preview-tabs{flex-wrap:wrap;gap:5px}
.preview-tabs button{white-space:nowrap}
@media(max-width:1000px) and (min-width:701px){.statistics-visual,.ged-visual,.gre-visual{height:150px}.ged-steps{left:7px;bottom:14px}.ged-steps>span{width:48px}.comparison{left:4px;right:4px;gap:10px}.comparison>div{width:69px}.formula-note{font-size:12px}.ged-note{font-size:17px}.math-sticker{font-size:12px}}
@media(max-width:700px){.subject-strip>.wrap{column-gap:12px;row-gap:11px}.activity-grid{row-gap:20px}.statistics-visual,.ged-visual,.gre-visual{width:258px;height:160px}.preview-tabs{gap:3px;padding:9px 10px}.preview-tabs button{padding:9px 10px;font-size:9px}}
@media(max-width:360px){.ged-steps{left:7px}.ged-steps>span{width:51px}.comparison{left:3px;right:3px;gap:13px}.comparison>div{width:72px}.ged-note{font-size:17px}.formula-note{font-size:12px}}
