@font-face{font-family:Barlow;src:url("media/body.ttf") format("truetype");font-style:normal;font-weight:400 700;font-display:swap}
@font-face{font-family:Barlow Condensed;src:url("media/display.ttf") format("truetype");font-style:normal;font-weight:800;font-display:swap}
:root{color-scheme:dark;--bg:#10130f;--surface:#161b15;--ink:#f3f4e9;--muted:#b9c0ae;--lime:#d3ff63;--line:#394134;--display:"Barlow Condensed","Arial Narrow",sans-serif;--body:Barlow,system-ui,sans-serif;scroll-behavior:smooth;font-family:var(--body);color:var(--ink);background:var(--bg)}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.58}
::selection{background:var(--lime);color:#14200d}*:focus-visible{outline:3px solid var(--lime);outline-offset:4px}input{caret-color:var(--lime)}[hidden]{display:none!important}.sr,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip:focus{position:fixed;z-index:8;top:10px;left:12px;padding:12px;background:var(--lime);color:#162011}
.wrap{width:min(100% - clamp(40px,8.5vw,150px),1360px);margin-inline:auto}.mast{background:#10130f;border-bottom:1px solid var(--line)}.nav-inner{height:70px;display:flex;align-items:center;justify-content:space-between}.wordmark{display:inline-flex;gap:8px;align-items:center;font:800 27px/.95 var(--display);letter-spacing:-.025em;text-transform:uppercase}.wordmark img{display:block}.mast nav{display:flex;align-items:center;gap:clamp(18px,3vw,40px);font-size:16px;font-weight:600}.mast nav a:hover,.footer a:hover{color:var(--lime)}.nav-install{border-bottom:1px solid #717d64;padding-bottom:3px}.nav-install svg{margin-left:4px;vertical-align:-3px}.primary svg,.player-top button svg{flex:none}
.poster{position:relative;isolation:isolate;overflow:hidden;background:#151c15;border-bottom:1px solid var(--line)}.poster-field{position:absolute;inset:0;overflow:hidden;z-index:-2;background:radial-gradient(ellipse at 76% 28%,#3e5037 0,#253326 34%,#151d16 61%,#111610 87%)}.chalk{position:absolute;top:10%;left:60%;width:60%;height:106%;transform:rotate(-17deg);border:1.5px solid #c1d5a62b}.chalk i{display:block;width:55%;height:66%;border:1.5px solid #c1d5a629;margin:12% 0 0 -1.5px}.chalk:after{content:"";position:absolute;border:1.5px solid #c1d5a625;width:52%;height:76%;border-radius:50%;top:10%;left:-26%}
.poster-grid{position:relative;display:grid;grid-template-columns:49% 51%;align-items:center;min-height:clamp(455px,43vw,620px)}.poster-copy{padding:46px 0 52px;z-index:1}.poster h1,.section h2,.install h2{font-family:var(--display);font-weight:800;margin:0;letter-spacing:-.034em;text-transform:uppercase}
.poster h1{font-size:clamp(64px,7.9vw,116px);line-height:.87}.poster h1 em,.install h2 em{display:inline-block;color:var(--lime);font-style:normal}
.poster-copy p,.intro{font-size:clamp(17px,1.45vw,21px);line-height:1.48;color:var(--muted);max-width:36ch;margin:21px 0 27px}.poster-copy p{max-width:35ch;color:#d1d8c8}
.primary{display:inline-flex;min-height:49px;align-items:center;justify-content:center;gap:12px;background:var(--lime);color:#19200e;padding:12px 21px;border:0;border-radius:4px;font-weight:700;font-size:16px;line-height:1.35;transition:background .15s,transform .15s;white-space:nowrap}.primary:hover{background:#e0ff91;transform:translateY(-2px)}.primary:active{transform:translateY(0)}.primary>span:last-child:not(.triangle){font-size:22px}.triangle{width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid currentColor}
.poster-art{align-self:stretch;min-width:0;display:flex;align-items:center;justify-content:center;z-index:0;pointer-events:none}.poster-art img{display:block;width:115%;max-width:none;height:100%;max-height:635px;object-fit:contain}
.section{padding-block:clamp(58px,7vw,100px)}.demo{display:grid;grid-template-columns:minmax(300px,.86fr) minmax(0,1.25fr);gap:clamp(36px,7vw,116px);align-items:center}.section h2,.install h2{font-size:clamp(40px,4.65vw,68px);line-height:.93}.demo .intro,.install .intro{font-size:18px;margin:14px 0 24px}.grade-choices{padding:0;margin:0;border:0;min-width:0}.grade-choices label{display:grid;grid-template-columns:78px 1fr 20px;align-items:center;gap:12px;position:relative;min-height:58px;border-top:1px solid var(--line);cursor:pointer}.grade-choices label:last-child{border-bottom:1px solid var(--line)}.grade-choices input{position:absolute;opacity:0;width:1px;height:1px}.grade-choices label:focus-within{outline:2px solid var(--lime);outline-offset:3px}.grade-choices .grade{font:800 40px/1 var(--display);letter-spacing:-.035em;font-variant-numeric:tabular-nums}.grade-choices label:has(input:checked) .grade{color:var(--lime)}.grade-choices label:hover{background:#1a2017}.grade-choices i{width:15px;height:15px;border:1px solid #77806f;border-radius:50%;display:grid;place-items:center}.grade-choices input:checked~i{border-color:var(--lime)}.grade-choices input:checked~i:after{content:"";width:7px;height:7px;border-radius:50%;background:var(--lime)}.grade-choices span:nth-of-type(2){font-weight:600}.custom-mark{font-size:31px!important}
.subject,.custom-grade{display:flex;align-items:center;gap:12px;margin-top:19px}.subject>label,.custom-grade>label{font-size:15px;font-weight:600}.subject select,.custom-grade input{min-height:42px;border:1px solid #56614f;border-radius:4px;background:#1a2018;padding:6px 10px}.subject select{flex:1;max-width:250px}.custom-grade{flex-wrap:wrap}.custom-grade input{width:70px}.custom-grade span:not(:empty){color:#ffc78e;width:100%}.preview{position:relative;background:#070a0c;isolation:isolate;aspect-ratio:1.35;overflow:hidden;border-radius:7px;align-self:center}.preview-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.preview:after{content:"";position:absolute;inset:44% 0 0;background:linear-gradient(transparent,rgba(5,9,6,.95));pointer-events:none}.preview-foot{position:absolute;z-index:1;inset:auto 0 0;padding:clamp(18px,3vw,42px);display:flex;justify-content:space-between;align-items:end;gap:12px}.preview-foot>div{display:grid;gap:3px}.preview-foot>div span{color:#e5e9dd;font-size:15px}.preview-foot strong{font:800 clamp(58px,6.4vw,90px)/.88 var(--display);font-variant-numeric:tabular-nums}
.install{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.install-grid{padding-block:clamp(56px,7vw,100px);display:grid;grid-template-columns:.9fr 1.2fr;gap:clamp(40px,8vw,130px)}.download-info{font-size:13px;color:var(--muted);margin:10px 0 0}.steps{margin:0;padding:0;list-style:none;counter-reset:step}.steps li{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:17px 0 18px;border-top:1px solid var(--line);counter-increment:step}.steps li:first-child{padding-top:0;border:0}.steps li:last-child{padding-bottom:0}.steps li:before{content:counter(step,decimal-leading-zero);font:800 29px/1 var(--display);color:var(--lime);font-variant-numeric:tabular-nums}.steps h3{font-size:20px;font-weight:700;margin:0 0 6px}.steps p{font-size:16px;color:var(--muted);line-height:1.5;margin:0;max-width:51ch}.steps code{font-size:.95em;color:var(--ink)}.copy{border:0;border-bottom:1px solid #80975d;background:none;color:var(--lime);padding:0 0 1px;margin-top:8px;font-weight:600;font-size:14px}.copy-status{font-size:13px;color:var(--muted);margin-left:8px}
.footer{display:flex;align-items:center;gap:22px;justify-content:space-between;padding-block:28px}.footer .wordmark{font-size:22px}.footer p{font-size:14px;color:var(--muted);margin:0}.footer>div{display:flex;gap:18px;font-size:14px}.footer>div a{text-decoration:underline;text-underline-offset:.2em}
dialog{padding:0;width:min(1024px,calc(100% - 40px));max-height:calc(100dvh - 24px);background:#0a0e0c;color:var(--ink);border:1px solid #586349;border-radius:10px;overflow:hidden}dialog::backdrop{background:#050705e6}.viewer{display:flex;flex-direction:column}.player-top{display:flex;align-items:center;justify-content:space-between;padding:9px 16px;min-height:46px;font-size:15px;background:#161c15}.player-top strong{color:var(--lime);margin-left:5px}.player-top button{background:none;border:0;display:flex;gap:9px;align-items:center;min-height:32px}.player-top button span{font-size:21px}#frame-slot{aspect-ratio:16/10;max-height:calc(100dvh - 84px);background:#090d0c}#frame-slot iframe{display:block;width:100%;height:100%;border:0}.dialog-open{overflow:hidden}
@media(max-width:800px){.poster-grid{grid-template-columns:47% 53%;min-height:445px}.poster h1{font-size:clamp(64px,9vw,78px)}.demo{grid-template-columns:1fr 1.1fr;gap:28px}.grade-choices label{grid-template-columns:55px 1fr 16px}.install-grid{gap:32px}.preview .primary{padding-inline:13px}}
@media(max-width:640px){.wrap{width:calc(100% - 36px)}.nav-inner{height:56px}.wordmark{font-size:23px;gap:5px}.wordmark img{width:29px;height:29px}.mast nav{font-size:14px;gap:16px}.poster-grid{display:flex;flex-direction:column;align-items:stretch;min-height:0}.poster-copy{padding:35px 0 0}.poster h1{font-size:clamp(65px,15vw,89px);line-height:.9}.poster-copy p{font-size:17px;margin:15px 0 18px;max-width:35ch}.poster-art{height:clamp(235px,62vw,340px);margin:-4px -12px 4px 4px;align-self:auto}.poster-art img{width:100%;height:115%}.chalk{left:55%;top:48%;height:55%}.poster-field{background:radial-gradient(ellipse at 70% 78%,#3c5036 0,#263628 36%,#151d16 70%,#131912 98%)}.demo{grid-template-columns:1fr;gap:24px}.section,.install-grid{padding-block:45px}.section h2,.install h2{font-size:46px}.grade-choices label{min-height:54px;grid-template-columns:62px 1fr 18px}.grade-choices .grade{font-size:36px}.preview{aspect-ratio:1.45}.preview-foot{padding:18px}.preview-foot strong{font-size:59px}.install-grid{grid-template-columns:1fr;gap:34px}.steps li{grid-template-columns:34px 1fr;gap:10px}.footer{display:grid;grid-template-columns:1fr auto;gap:9px}.footer p{grid-column:1/-1;grid-row:2}.footer>div{gap:12px;font-size:13px}.footer .wordmark{font-size:20px}dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;border:0;border-radius:0}.viewer{height:100%}#frame-slot{flex:1;max-height:none;min-height:0;aspect-ratio:auto}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.primary{transition:none}}
.demo{display:block}.demo .pack-shelf{margin-top:26px}.shelf-controls{margin-top:16px;padding:15px 0;border-block:1px solid var(--line);display:flex;align-items:center;gap:20px;flex-wrap:wrap}.shelf-controls .subject,.shelf-controls .custom-grade{margin:0}.shelf-controls .custom-grade{order:1}.shelf-confirm{display:flex;align-items:center;gap:18px;margin-left:auto;order:2}.shelf-confirm>span{font-size:14px;color:var(--muted)}.shelf-confirm strong{margin-left:3px;font-size:17px;color:var(--ink)}
@media(max-width:640px){.shelf-controls{gap:12px}.shelf-confirm{width:100%;justify-content:space-between}.shelf-confirm .primary{min-height:43px}.shelf-controls .custom-grade{flex-basis:100%}.demo .pack-shelf{margin-top:18px}}

.grade-test{width:fit-content;max-width:100%;margin-top:13px;color:var(--muted);font-size:14px}.grade-test summary{cursor:pointer;padding:7px 0}.grade-test summary:focus-visible{outline:2px solid var(--lime);outline-offset:3px}.grade-test .custom-grade{margin-top:8px}
@media(max-width:640px){.shelf-confirm{width:auto;margin-left:auto}.shelf-controls .subject{flex:1}.shelf-controls .subject select{min-width:0}.shelf-confirm .primary{padding-inline:14px}}