/* One shared height for both the snap viewport and the contained artwork.
   visualViewport supplies pixels when available; CSS remains the fallback. */
:root{--brochure-height:100vh}
@supports(height:100svh){:root{--brochure-height:100svh}}
@supports(height:100dvh){:root{--brochure-height:100dvh}}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#eaf3fa;color:#08134e;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid #bd6500;outline-offset:2px}[hidden]{display:none!important}.book{position:absolute;top:var(--brochure-top,0px);left:0;width:100%;height:var(--brochure-height);overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none}.book::-webkit-scrollbar{display:none}.page{height:100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center;overflow:hidden}.art{position:relative;width:min(100%,calc(var(--brochure-height) * 0.5555555556));aspect-ratio:935/1683;flex-shrink:0;container-type:inline-size}.poster{display:block;width:100%;height:100%;object-fit:contain;user-select:none}.field,.choices,.submit,.local-note{position:absolute}.field{left:26.63%;width:61.39%;height:3.8%;padding:0 2.2%;border:1px solid #dce0e7;border-radius:6px;background:#fcfdfe;color:#08134e;font-size:16px;font-size:max(16px,2.55cqw);min-width:0}.field::placeholder{color:#98999f;font-size:2.55cqw}.score{top:57.932%}.student{top:67.202%}.phone{top:71.658%}.choices{margin:0;padding:0;border:0;left:26.63%;top:62.507%;width:61.39%;height:3.743%;display:flex;gap:1.05%}.choices label{flex:1;position:relative;min-width:0}.choices input{position:absolute;opacity:0;width:100%;height:100%;margin:0}.choices span{height:100%;display:flex;justify-content:center;align-items:center;white-space:nowrap;background:#fcfdfe;border:1px solid #dce0e7;border-radius:6px;font-size:2.7cqw;color:#08134e}.choices input:checked+span{border-color:#bd6500;background:#fff0d8;box-shadow:inset 0 0 0 1px #bd6500}.choices input:focus-visible+span{outline:2px solid #bd6500}.submit{left:11.12%;top:76.292%;width:77.754%;height:5.288%;border:0;border-radius:999px;background:transparent}.submit:active{background:#ffffff26}.local-note{left:0;top:97.3%;width:100%;height:2.7%;margin:0;display:flex;justify-content:center;align-items:center;background:#fffaf0ed;font-size:2.25cqw;white-space:nowrap;color:#586080}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.toast{position:fixed;z-index:20;left:50%;top:max(24px,env(safe-area-inset-top));transform:translateX(-50%);width:max-content;max-width:90%;padding:14px 18px;color:#fff;background:#102149f2;border-radius:12px;font-size:15px;text-align:center;box-shadow:0 6px 24px #0002}.error-page{display:grid;place-items:center;padding:24px;text-align:center}.error-page h1{font-size:24px}.error-page a{color:#a65300}



/* The mini-program's edge-strip treatment, generated from the H5 posters.
   Page-specific declarations below select assets only; all geometry is shared. */
:root{--poster-optical-y:8px}
.page{
 position:relative;
 isolation:isolate;
 --page-safe-gap:max(env(safe-area-inset-top,0px),env(safe-area-inset-bottom,0px));
 --poster-width:min(100vw,calc((var(--brochure-height) - var(--page-safe-gap) * 2) * 0.5555555556));
 --poster-height:calc(var(--poster-width) * 1.8);
 --poster-gap:calc((var(--brochure-height) - var(--poster-height)) / 2);
 --poster-shift:min(var(--poster-optical-y),max(0px,calc(var(--poster-gap) - var(--page-safe-gap))));
 --poster-top:calc(var(--poster-gap) - var(--poster-shift));
 margin:0;
 padding:0;
}
.page::before,.page::after{
 content:"";
 position:absolute;
 inset:0;
 pointer-events:none;
 background-repeat:no-repeat;
}
/* Exact edge colour at the join, increasingly soft towards the screen edge. */
.page::before{
 z-index:1;
 background-image:var(--edge-top),var(--edge-bottom);
 background-position:center top,center bottom;
 background-size:var(--poster-width) calc(var(--poster-top) + 3px),var(--poster-width) calc(var(--brochure-height) - var(--poster-top) - var(--poster-height) + 3px);
}
/* Short/wide screens use the matching side edges, including the corners. */
.page::after{
 z-index:0;
 inset:-10px;
 background-image:var(--edge-left),var(--edge-right);
 background-position:left center,right center;
 background-size:calc((100% - var(--poster-width)) / 2 + 8px) 100%;
 filter:blur(6px);
}
.art{
 z-index:2;
 width:var(--poster-width);
 margin:0;
 transform:translateY(calc(0px - var(--poster-shift)));
}
.poster{
 object-fit:contain;
 object-position:center center;
 /* Blend only the outermost pixels; interactive controls stay unmasked. */
 -webkit-mask-image:linear-gradient(to bottom,transparent,#000 3px,#000 calc(100% - 3px),transparent);
 mask-image:linear-gradient(to bottom,transparent,#000 3px,#000 calc(100% - 3px),transparent);
}
#page-01{--edge-top:url("../assets/edges/page-01-top.png");--edge-bottom:url("../assets/edges/page-01-bottom.png");--edge-left:url("../assets/edges/page-01-left.png");--edge-right:url("../assets/edges/page-01-right.png");}
#page-02{--edge-top:url("../assets/edges/page-02-top.png");--edge-bottom:url("../assets/edges/page-02-bottom.png");--edge-left:url("../assets/edges/page-02-left.png");--edge-right:url("../assets/edges/page-02-right.png");}
#page-03{--edge-top:url("../assets/edges/page-03-top.png");--edge-bottom:url("../assets/edges/page-03-bottom.png");--edge-left:url("../assets/edges/page-03-left.png");--edge-right:url("../assets/edges/page-03-right.png");}
#page-04{--edge-top:url("../assets/edges/page-04-top.png");--edge-bottom:url("../assets/edges/page-04-bottom.png");--edge-left:url("../assets/edges/page-04-left.png");--edge-right:url("../assets/edges/page-04-right.png");}
#page-05{--edge-top:url("../assets/edges/page-05-top.png");--edge-bottom:url("../assets/edges/page-05-bottom.png");--edge-left:url("../assets/edges/page-05-left.png");--edge-right:url("../assets/edges/page-05-right.png");}
#page-06{--edge-top:url("../assets/edges/page-06-top.png");--edge-bottom:url("../assets/edges/page-06-bottom.png");--edge-left:url("../assets/edges/page-06-left.png");--edge-right:url("../assets/edges/page-06-right.png");}
#page-07{--edge-top:url("../assets/edges/page-07-top.png");--edge-bottom:url("../assets/edges/page-07-bottom.png");--edge-left:url("../assets/edges/page-07-left.png");--edge-right:url("../assets/edges/page-07-right.png");}
#page-08{--edge-top:url("../assets/edges/page-08-top.png");--edge-bottom:url("../assets/edges/page-08-bottom.png");--edge-left:url("../assets/edges/page-08-left.png");--edge-right:url("../assets/edges/page-08-right.png");}
#page-09{--edge-top:url("../assets/edges/page-09-top.png");--edge-bottom:url("../assets/edges/page-09-bottom.png");--edge-left:url("../assets/edges/page-09-left.png");--edge-right:url("../assets/edges/page-09-right.png");}

/* Page 07 only. Original poster/title and shared page/edge geometry stay intact.
   Cover the baked-in placeholder cards locally without editing the poster. */
#page-07 .teachers{position:absolute;left:0;top:35.8%;width:100%;height:46%;isolation:isolate}
#page-07 .teachers::before{content:"";position:absolute;inset:0 0 9%;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,transparent 0%,#eaf5fc 5%,#f3f9fd 70%,#edf7ff 93%,transparent 100%)}
/* Swiper owns wrapper translation, slide geometry, touch handling and looping. */
#page-07 .teacher-swiper{position:absolute;inset:0 0 6.5%;margin:0;overflow:hidden;touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
#page-07 .swiper-wrapper{align-items:center;transition-timing-function:cubic-bezier(.22,.7,.25,1)}
#page-07 .swiper-slide{width:43%;height:auto;z-index:1}
#page-07 .teacher-card{width:100%;aspect-ratio:935/1683;transform:scale(.82);transform-origin:center center;transition:transform 400ms cubic-bezier(.22,.7,.25,1);box-shadow:0 5px 14px #13264024}
#page-07 .swiper-slide-active,#page-07 .swiper-slide-duplicate-active{z-index:2}
#page-07 .swiper-slide-active .teacher-card,#page-07 .swiper-slide-duplicate-active .teacher-card{transform:scale(1)}
#page-07 .teacher-card img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
#page-07 .teacher-nav{position:absolute;left:0;bottom:0;width:100%;height:7%;display:flex;align-items:center;justify-content:center;gap:3%;touch-action:pan-y pinch-zoom}
#page-07 .teacher-nav button{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;padding:0;border:0;background:transparent;color:#a75b08;font-size:28px;line-height:1}
#page-07 .teacher-dots{display:flex;align-items:center}
#page-07 .teacher-nav .teacher-dot{width:26px;height:32px}
#page-07 .teacher-dot::before{content:"";width:6px;height:6px;border-radius:50%;background:#dec5a1;transition:background-color 380ms,transform 380ms}
#page-07 .teacher-dot[aria-current="true"]::before{background:#ad620b;transform:scale(1.35)}
@media(prefers-reduced-motion:reduce){#page-07 .teacher-card,#page-07 .teacher-dot::before{transition:none}}
