:root{font-family:"Trebuchet MS",Arial,sans-serif;color:#603d50;background:#f8ecd8;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #784777;outline-offset:5px}.academy{min-height:100svh;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;background:url('assets/vietnam-schoolyard.png') center top/cover no-repeat}.academy:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#fff6df26,#fff5df08 40%,#fff0d45c)}.brand{height:clamp(160px,25vh,245px);text-align:left;padding:12px 0 0 clamp(24px,7vw,160px)}.brand img{height:100%;width:min(400px,38vw);object-fit:contain;object-position:left top;animation:logo-float 6s ease-in-out infinite;filter:drop-shadow(0 5px 5px #633c4b20)}.menu-layout{width:min(1080px,90%);margin:auto;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px;padding:8px 0 32px}.teacher{position:relative;text-align:center;align-self:end}.greeting{display:inline-block;margin:0 0 2px;padding:12px 25px;background:#fff9edf2;border:2px solid #fff;border-radius:22px 22px 22px 5px;box-shadow:0 5px 15px #674e3920;font-size:21px;font-weight:bold;transform:rotate(-3deg)}.greeting span{display:block;font-size:13px;font-weight:normal;margin-top:5px}.mascot{display:block;width:min(100%,440px);height:auto;margin:0 auto;filter:drop-shadow(0 12px 9px #5c31402b);animation:bob 5s ease-in-out infinite}.teacher-name{display:inline-block;border:1px solid #fff9;background:#fff9e5e8;padding:8px 24px;border-radius:30px;font-size:20px;font-weight:bold;margin-top:-12px;position:relative}.teacher-name span{display:block;font-size:11px;font-weight:normal;margin-top:3px}.menu-panel{padding:29px 30px 20px;background:#fffaf0ed;border:2px solid #fff6df;border-radius:32px;box-shadow:0 12px 0 #af785c23,0 20px 50px #69463320;backdrop-filter:blur(8px);position:relative}.eyebrow{display:flex;align-items:center;justify-content:center;gap:7px;font-size:8px;letter-spacing:1.5px;font-weight:bold;color:#a17565}.eyebrow span{width:6px;height:6px;background:#a3b98a;border-radius:100%}h1{text-align:center;font-size:25px;letter-spacing:-.7px;margin:12px -10px 8px}.intro{text-align:center;font-size:11px;color:#93766e;margin:0 0 23px}nav{display:grid;gap:13px}.menu-button{display:flex;align-items:center;gap:15px;width:100%;text-align:left;padding:12px 16px;border:2px solid #fff9;border-radius:18px;color:#604550;box-shadow:0 4px 0 var(--shadow),0 6px 9px #7250380d;transition:transform .2s,box-shadow .2s,filter .2s}.menu-button:hover{transform:translateY(-3px);filter:brightness(1.035);box-shadow:0 7px 0 var(--shadow),0 10px 15px #72503818}.menu-button:active{transform:translateY(3px);box-shadow:0 1px 0 var(--shadow)}.menu-button>span:nth-child(2){font-size:18px;font-weight:bold}.menu-button small{display:block;font-size:10px;font-weight:normal;margin-top:5px;color:#806771}.icon{display:grid;place-items:center;flex:0 0 39px;height:39px;border-radius:12px;background:#fff8;font-size:28px;color:#9e706f}.arrow{margin-left:auto;color:#9d7f83;font-size:27px;font-weight:normal}.peach{background:#f9d2bf;--shadow:#d9a997}.cream{background:#f7e7b4;--shadow:#d7c28c}.lavender{background:#e6d8ed;--shadow:#c5afcf}.mint{background:#d9e7cf;--shadow:#afc3a4}.panel-note{text-align:center;font-size:10px;color:#a38878;margin:20px -10px 0}.panel-note span{color:#c58f99;margin-right:5px}footer{display:flex;justify-content:space-between;gap:15px;padding:14px 28px;font-size:9px;letter-spacing:1.1px;color:#654d42;background:linear-gradient(transparent,#fff4dc8c)}.petals{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:-1}.petals i{position:absolute;top:-30px;left:8%;width:12px;height:7px;border-radius:90% 0 90% 0;background:#f6a9a2b3;animation:fall 22s linear infinite}.petals i:nth-child(2){left:28%;animation-delay:-7s;animation-duration:27s}.petals i:nth-child(3){left:49%;animation-delay:-15s;background:#e7ca87b3}.petals i:nth-child(4){left:65%;animation-delay:-3s;animation-duration:30s}.petals i:nth-child(5){left:80%;animation-delay:-19s;background:#c2cc88b3}.petals i:nth-child(6){left:93%;animation-delay:-11s;animation-duration:26s}@keyframes bob{50%{transform:translateY(-9px) rotate(.8deg)}}@keyframes logo-float{50%{transform:translateY(5px) rotate(-.4deg)}}@keyframes fall{to{transform:translate(80px,110vh) rotate(340deg)}}dialog{width:min(430px,calc(100% - 36px));border:2px solid #fff;border-radius:28px;padding:32px 24px;text-align:center;background:#fff9ef;color:#603d50;box-shadow:0 20px 80px #472d4250}dialog::backdrop{background:#43304766;backdrop-filter:blur(5px)}.close-dialog{position:absolute;right:13px;top:10px;border:0;background:transparent;color:#876775;font-size:28px;width:36px;height:36px}.dialog-flower{font-size:50px;color:#d798a6}.dialog-feature{font-size:12px;color:#9d7e76;margin:10px 0}h2{font-size:30px;margin:12px 0}#coming-description{font-size:14px;line-height:1.8}.dismiss{background:#ecd9ec;border:2px solid white;box-shadow:0 3px 0 #c6afcc;border-radius:13px;padding:10px 40px;color:#603d50;font-weight:bold;margin-top:12px}@media(min-width:1500px){.menu-layout{width:1160px;gap:110px}.mascot{width:480px}.menu-panel{padding:35px}.menu-button{padding:15px 18px}}@media(max-height:760px) and (min-width:761px){.brand{height:170px}.menu-layout{width:min(940px,92%);gap:70px;padding-bottom:15px}.mascot{width:340px}.menu-panel{padding:22px 25px 17px}.menu-button{padding:9px 14px}nav{gap:11px}.greeting{font-size:17px}footer{padding-top:5px}}@media(min-width:761px) and (max-width:1100px),(min-width:761px) and (max-aspect-ratio:3/2){.brand{padding-left:24px}.brand img{width:26vw;max-width:320px}}@media(max-width:760px){.brand{height:175px;padding:10px 0 0 4vw}.brand img{width:42vw;max-width:220px}.menu-layout{grid-template-columns:1fr;gap:22px;width:min(440px,90%);padding:0 0 30px}.teacher{display:grid;grid-template-columns:140px 1fr;align-items:center}.mascot{grid-column:1;grid-row:1 / 3;width:150px}.greeting{grid-column:2;font-size:17px;padding:12px 14px;transform:none}.greeting span{font-size:11px}.teacher-name{grid-column:2;font-size:14px;margin:4px auto 0;background:#fff9e5ee;padding:7px 14px}.teacher-name span{font-size:9px}.menu-panel{padding:25px 23px 22px}h1{font-size:23px}footer{font-size:8px;letter-spacing:.4px;padding:12px 18px;flex-wrap:wrap;justify-content:center}.academy{background-position:52% top}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.petals{display:none}}