body:has(.landing-shell){overflow:hidden}body:has(.landing-shell) #app{flex-direction:column;height:100dvh;display:flex}.landing-header{border-bottom:1px solid #263b3b2a;flex:none;justify-content:space-between;align-items:center;width:100%;max-width:1320px;margin:0 auto;padding:clamp(8px,1.6dvh,16px) 36px;display:flex}.landing-header>span{color:#697879;font:10px var(--mono);letter-spacing:1.5px}.landing-shell{flex-direction:column;flex:1;gap:clamp(12px,2.5dvh,24px);width:100%;max-width:1320px;min-height:0;margin:0 auto;padding:clamp(12px,2.5dvh,24px) 36px;display:flex}.landing-intro{flex:0 0 clamp(130px,27dvh,240px);grid-template-columns:minmax(0,1fr) minmax(260px,.75fr);align-items:center;gap:30px;min-height:0;display:grid}.landing-intro .eyebrow{margin-bottom:12px}.landing-intro h1{margin-bottom:10px;font-size:clamp(40px,7.2dvh,72px)}.landing-intro p:last-child{color:#53636a;max-width:530px;margin-bottom:0;font-size:clamp(11px,1.65dvh,14px);line-height:1.45}.landing-art{background:linear-gradient(#9cc4bf 0 54%,#789969 54%);border-radius:8px;height:100%;position:relative;overflow:hidden;box-shadow:7px 8px #e5bf67}.landing-sun{aspect-ratio:1;background:#efc46a;border-radius:50%;width:16%;position:absolute;top:8%;right:18%}.landing-hill{background:#5e846d;border-radius:50% 50% 0 0;width:120%;height:35%;position:absolute;bottom:35%;left:-10%}.landing-pitch{background:#d1bd88;width:24%;height:65%;position:absolute;bottom:-9%;left:39%;transform:perspective(190px)rotateX(42deg)}.landing-crease{border-top:3px solid #f8f0d2;width:32%;position:absolute;bottom:15%;left:35%}.landing-stump{background:#f5e8c4;border-radius:4px;width:6px;height:20%;position:absolute;bottom:17%}.landing-stump-one{left:58%}.landing-stump-two{left:60%}.landing-stump-three{left:62%}.landing-bat{background:#e2bd75;border-radius:5px 5px 12px 12px;width:28px;height:44%;position:absolute;bottom:10%;left:29%;transform:rotate(-25deg);box-shadow:inset 5px 0 #c99b5c}.landing-bat:before{content:"";background:#574539;border-radius:5px;width:32%;height:42%;position:absolute;top:-40%;left:32%}.landing-ball{background:#d94d36;border-radius:50%;width:19px;height:19px;position:absolute;bottom:40%;left:72%;box-shadow:-28px 9px 0 -6px #d94d3670,-52px 17px 0 -7px #d94d3640}.landing-modes{flex:1;grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.8dvh,16px);min-height:0;display:grid}.landing-mode{background:#fffdf5;border:1px solid #cbd1c2;border-radius:7px;flex-direction:column;min-width:0;min-height:0;padding:clamp(12px,2dvh,20px) 20px;transition:transform .18s,border-color .18s,box-shadow .18s;display:flex;position:relative}a.landing-mode:hover{border-color:#5b8263;transform:translateY(-3px);box-shadow:0 12px 24px #172d3021}.landing-mode:focus-visible{outline-offset:3px;outline:3px solid #d66d3e}.landing-mode-kicker{color:#777e73;font:clamp(8px, 1.3dvh, 10px) var(--mono);letter-spacing:1px;padding-right:43px}.landing-mode-icon{color:#c35938;font:24px Georgia,serif;position:absolute;top:clamp(10px,1.8dvh,18px);right:20px}.landing-mode h2{letter-spacing:-1px;margin:clamp(8px,1.8dvh,16px) 0 7px;font-size:clamp(22px,3.8dvh,32px);line-height:1.08}.landing-mode p{color:#5c6b69;max-width:370px;margin-bottom:10px;font-size:clamp(11px,1.65dvh,14px);line-height:1.4}.landing-mode-action{color:#22513f;justify-content:space-between;align-items:center;gap:8px;margin-top:auto;font-size:clamp(11px,1.5dvh,13px);font-weight:700;line-height:1.25;display:flex}.landing-mode-action span{font-size:22px;line-height:1}.landing-mode-disabled{color:#8b918b;background:#e9e9e3;border-color:#d7d8d0;grid-column:span 2}.landing-mode-disabled h2,.landing-mode-disabled p,.landing-mode-disabled .landing-mode-icon,.landing-mode-disabled .landing-mode-action{color:#939a93}@media (width<=900px){.landing-header{padding-inline:20px}.landing-shell{gap:12px;padding:12px 20px}.landing-intro{flex-basis:clamp(130px,22dvh,180px);grid-template-columns:minmax(0,1fr) minmax(180px,.65fr);gap:20px}.landing-intro .eyebrow{margin-bottom:7px;font-size:9px}.landing-intro h1{margin-bottom:7px;font-size:clamp(30px,5.8dvh,44px)}.landing-modes{grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.landing-mode{padding:10px 14px}.landing-mode h2{margin:7px 0 4px;font-size:clamp(18px,3dvh,24px)}.landing-mode p{margin-bottom:6px;font-size:clamp(10px,1.55dvh,12px);line-height:1.3}.landing-mode-icon{font-size:20px;top:8px;right:14px}}@media (width<=600px){.landing-header{padding:8px 16px}.landing-header>span,.landing-art{display:none}.landing-shell{gap:10px;padding:10px 12px 12px}.landing-intro{flex:none;display:block}.landing-intro h1{letter-spacing:-1px;font-size:28px}.landing-intro h1 br{display:none}.landing-intro h1 em{margin-left:.2em}.landing-intro p:last-child{font-size:11px}.landing-mode{padding:10px}.landing-mode-kicker{letter-spacing:.3px;padding-right:0;font-size:8px}.landing-mode-icon{display:none}.landing-mode h2{letter-spacing:-.5px;font-size:clamp(18px,2.5dvh,22px)}.landing-mode-action{font-size:11px}.landing-mode-action span{font-size:16px}}@media (width<=600px) and (height<=640px){.landing-header{padding-block:6px}.landing-shell{gap:8px;padding:8px 10px}.landing-intro h1{font-size:24px}.landing-intro p:last-child{font-size:10px;line-height:1.3}.landing-modes{gap:8px}.landing-mode{padding:6px 8px}.landing-mode h2{margin:4px 0 3px;font-size:16px}.landing-mode p{margin-bottom:4px;font-size:10px;line-height:1.25}}@media (width>=601px) and (height<=540px){.landing-header{padding-block:6px}.landing-shell{gap:8px;padding-block:8px}.landing-intro{flex-basis:75px}.landing-intro .eyebrow{margin-bottom:5px;font-size:8px}.landing-intro h1{letter-spacing:-1px;margin-bottom:5px;font-size:28px}.landing-intro h1 br{display:none}.landing-intro h1 em{margin-left:.2em}.landing-intro p:last-child{font-size:10px;line-height:1.3}.landing-modes{grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.landing-mode{padding:8px 10px}.landing-mode-kicker{padding-right:0;font-size:8px}.landing-mode-icon{display:none}.landing-mode h2{margin:5px 0 4px;font-size:18px}.landing-mode p{margin-bottom:5px;font-size:10px;line-height:1.25}.landing-mode-action{font-size:10px}}@media (width>=601px) and (width<=760px) and (height<=540px){.landing-header .brand{font-size:10px}.landing-header .brand-mark{width:22px;height:26px}.landing-mode{padding:6px 8px}.landing-mode h2{margin:3px 0 2px;font-size:16px}.landing-mode p{margin-bottom:3px;line-height:1.2}.landing-mode-action span{font-size:14px}}
