.admin-shell{color:#34483f;background:radial-gradient(circle at 50% 0,#fffffff5,#0000 34%),#edf3ee;place-items:center;min-height:100svh;padding:48px 20px;display:grid}.admin-login,.admin-panel{background:#ffffffe6;border:1px solid #d8e0da;width:min(1080px,100%);box-shadow:0 24px 70px #36483e1a}.admin-login{text-align:center;width:min(440px,100%);padding:38px}.admin-login>img{width:92px;margin:0 auto 18px}.admin-kicker{color:#819087;letter-spacing:.14em;margin:0 0 6px;font-size:11px;font-weight:800}.admin-login h1,.admin-panel h1{color:#31473d;margin:0;font:700 clamp(30px,4vw,44px)/1.05 Georgia,serif}.admin-login>p:not(.admin-kicker),.admin-panel-head p{color:#718079;line-height:1.6}.admin-login-form{text-align:left;gap:14px;margin-top:28px;display:grid}.admin-login-form label,.admin-field-grid label{color:#56675f;gap:7px;font-size:12px;font-weight:750;display:grid}.admin-login-form input,.admin-field-grid input{color:#31473d;width:100%;min-height:46px;font:inherit;background:#fbfcfb;border:1px solid #ced8d1;border-radius:9px;outline:none;padding:0 13px}.admin-login-form input:focus,.admin-field-grid input:focus{border-color:#8da591;box-shadow:0 0 0 3px #8da59124}.admin-login-form button,.admin-save-row button,.admin-head-actions button{color:#43584d;cursor:pointer;background:#edf2ec;border:1px solid #aebcaf;border-radius:9px;font-weight:800}.admin-login-form button{min-height:48px;margin-top:4px}.admin-login-form button:hover,.admin-save-row button:hover,.admin-head-actions button:hover{background:#e4ebe4}.admin-login-form button:disabled,.admin-save-row button:disabled{cursor:wait;opacity:.65}.admin-status{margin:16px 0 0;font-size:12px}.admin-status.error{color:#a64d4d}.admin-back{color:#708078;margin-top:22px;font-size:12px;font-weight:700;display:inline-block}.admin-panel{padding:34px}.admin-panel-head{border-bottom:1px solid #e2e8e3;justify-content:space-between;align-items:flex-start;gap:30px;padding-bottom:28px;display:flex}.admin-panel-head>div:first-child{max-width:690px}.admin-head-actions{align-items:center;gap:10px;display:flex}.admin-head-actions a,.admin-head-actions button{align-items:center;min-height:38px;padding:0 13px;display:inline-flex}.admin-head-actions a{color:#586b61;font-size:12px;font-weight:750}.admin-settings-form{margin-top:28px}.admin-field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.admin-save-row{color:#74827a;border-top:1px solid #e2e8e3;justify-content:space-between;align-items:center;gap:20px;margin-top:28px;padding-top:20px;font-size:12px;display:flex}.admin-save-row button{min-height:44px;padding:0 18px}.footer-socials{align-items:center;gap:7px;display:flex}.footer-socials a{color:#728078;border:1px solid #5f706638;border-radius:9px;place-items:center;width:34px;height:34px;display:grid}.footer-socials a:hover{color:#42594d;background:#edf2ece6}.footer-socials svg{width:17px;height:17px}@media (width<=720px){.admin-shell{align-items:start;padding:20px 12px}.admin-login,.admin-panel{padding:24px 18px}.admin-panel-head,.admin-save-row{flex-direction:column}.admin-field-grid{grid-template-columns:1fr}.admin-head-actions{justify-content:space-between;width:100%}}.admin-shell-top{align-items:start}.admin-shell-top .admin-panel{margin:12px auto}.admin-settings-section{border-bottom:1px solid #e2e8e3;padding:30px 0}.admin-section-head{justify-content:space-between;align-items:baseline;gap:24px;margin-bottom:20px;display:flex}.admin-section-head h2{color:#40544a;margin:0;font:700 24px/1.1 Georgia,serif}.admin-section-head p{color:#849088;margin:0;font-size:11px}.admin-field-grid textarea,.admin-field-grid select{color:#31473d;width:100%;min-height:46px;font:inherit;background:#fbfcfb;border:1px solid #ced8d1;border-radius:9px;outline:none;padding:11px 13px}.admin-field-grid textarea{resize:vertical;min-height:92px;line-height:1.5}.admin-field-grid select{padding-block:0}.admin-field-grid textarea:focus,.admin-field-grid select:focus{border-color:#8da591;box-shadow:0 0 0 3px #8da59124}.admin-wide{grid-column:1/-1}.admin-check{align-content:center;align-items:center;grid-template-columns:auto 1fr!important}.admin-check input{width:18px!important;min-height:18px!important}.admin-news-list{gap:18px;display:grid}.admin-news-item{border-top:1px solid #e6ebe7;padding:18px 0 24px}.admin-news-item-head{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.admin-news-item-head strong{color:#53665c;font-size:12px}.admin-news-item-head button,.admin-add-news{color:#66766e;cursor:pointer;background:#f7f9f7;border:1px solid #d0d9d2;border-radius:8px;min-height:36px;padding:0 12px;font-size:11px;font-weight:800}.admin-news-item-head button:hover,.admin-add-news:hover{background:#eef3ee}.admin-add-news{margin-top:18px}.admin-add-news:disabled{opacity:.5;cursor:default}@media (width<=720px){.admin-section-head{flex-direction:column;align-items:flex-start;gap:6px}.admin-wide{grid-column:auto}}:root{color:#17332c;--clover:#247a4b;--leaf:#75b83f;--sky:#72c7ee;--quest-gold:#e7b446;--paper:#fff7e7;--mint:#eef8f0;--forest:#17332c;--coral:#f07867;--ink-soft:#577068;--line:#c9ddcf;--wood:#8b5c2f;--shadow-soft:0 14px 34px #365d4424;background:#eef8f0;font-family:Noto Sans Thai,Prompt,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--mint)}body{background:var(--mint);min-width:320px;color:var(--forest);margin:0;overflow-x:hidden}body,button{font-family:inherit}a{color:inherit;text-decoration:none}button{font:inherit;border:0}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid var(--quest-gold);outline-offset:3px}img{max-width:100%;display:block}::selection{color:var(--forest);background:#ffe08a}.site-header{z-index:40;color:var(--forest);position:absolute;inset:0 0 auto}.header-inner{grid-template-columns:106px 1fr auto;align-items:center;gap:24px;width:min(1420px,100% - 40px);min-height:92px;margin:0 auto;display:grid}.brand{align-self:start;width:98px;padding-top:8px}.brand-badge{filter:drop-shadow(0 8px 12px #2e5b3938);width:100%}.site-header nav{justify-content:center;gap:clamp(16px,2.4vw,36px);display:flex}.site-header nav a{color:#23473a;text-shadow:0 1px #ffffffbf;padding:11px 2px;font-size:13px;font-weight:800;position:relative}.site-header nav a:after{content:"";background:var(--leaf);border-radius:999px;height:3px;transition:left .18s ease-out,right .18s ease-out;position:absolute;bottom:3px;left:50%;right:50%}.site-header nav a:hover:after{left:0;right:0}.header-tools{align-items:center;gap:12px;font-size:12px;font-weight:800;display:flex}.locale-switch{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffb8;border:1px solid #247a4b33;border-radius:999px;align-items:center;gap:5px;padding:7px 9px;display:flex}.locale-switch button{cursor:pointer;color:#6b7c74;background:0 0;padding:2px;font-weight:900}.login-link{padding:10px 4px}.register-button{background:#fff2b8;border:2px solid #f4cd62;border-radius:999px;padding:11px 17px;box-shadow:0 4px #c89b2b}.storybook-hero{isolation:isolate;background:var(--sky);align-items:end;min-height:min(900px,100svh);display:grid;position:relative;overflow:hidden}.storybook-hero-scene{z-index:-3;position:absolute;inset:0}.storybook-hero-scene img{object-fit:cover;object-position:center 48%;width:100%;height:100%}.storybook-hero-wash{z-index:-2;background:linear-gradient(#ffffff1a 0%,#fff0 42%),linear-gradient(#fff7e700 40%,#fff7e754 62%,#fff7e7d4 82%,#fff7e7f5 100%);position:absolute;inset:0}.storybook-hero-content{text-align:center;width:min(1040px,100% - 40px);color:var(--forest);margin:0 auto;padding:150px 0 76px}.storybook-hero-logo{filter:drop-shadow(0 12px 18px #3c623e33);width:clamp(180px,19vw,300px);margin:0 auto 8px}.hero-genre{color:var(--clover);letter-spacing:.13em;margin:6px 0 10px;font-size:12px;font-weight:900}.storybook-hero h1{letter-spacing:-.03em;text-wrap:balance;margin:0;font-family:Kanit,Noto Sans Thai,sans-serif;font-size:clamp(46px,5.8vw,82px);line-height:.98}.storybook-hero h1 span,.storybook-hero h1 strong{display:block}.storybook-hero h1 strong{color:var(--clover);text-shadow:0 3px #ffffff8c;font-weight:800}.hero-intro{color:#50695f;text-wrap:pretty;max-width:720px;margin:20px auto 0;font-size:17px;line-height:1.7}.storybook-actions{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:27px;display:flex}.quest-button{border-radius:12px;justify-content:center;align-items:center;min-width:152px;min-height:54px;padding:0 24px;font-family:Kanit,Noto Sans Thai,sans-serif;font-weight:800;transition:transform .18s ease-out,box-shadow .18s ease-out;display:inline-flex}.quest-button:hover{transform:translateY(-2px)}.scroll-clover{width:38px;height:38px;color:var(--clover);box-shadow:var(--shadow-soft);background:#ffffffb8;border:1px solid #247a4b33;border-radius:50%;place-items:center;font-size:22px;font-weight:900;display:grid;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.section-shell{width:min(1220px,100% - 48px);margin:0 auto}.section-kicker{color:var(--clover);letter-spacing:.12em;margin:0 0 10px;font-size:12px;font-weight:900}.art-led-section{isolation:isolate;position:relative;overflow:hidden}.art-led-section h2,.final-art-cta h2{letter-spacing:-.028em;text-wrap:balance;margin:0;font-family:Kanit,Noto Sans Thai,sans-serif;font-size:clamp(42px,5vw,72px);line-height:1.02}.art-led-section p,.final-art-cta p{text-wrap:pretty;max-width:650px;margin:18px 0 0;font-size:16px;line-height:1.72}.world-art{color:#fff;background-image:url(/assets/clover-monsters-hero.webp);background-position:50% 48%;background-size:cover;align-items:center;min-height:760px;display:grid}.world-art:before{content:"";z-index:-2;background:inherit;background-position:50% 48%;background-size:cover;transition:transform 10s ease-out;position:absolute;inset:-2%;transform:scale(1.02)}.world-art:hover:before{transform:scale(1.045)}.art-led-overlay{z-index:-1;background:linear-gradient(90deg,#0f3127e6 0%,#0f3127ab 32%,#0f31272e 58%,#0f312700 76%),linear-gradient(#0000 60%,#0a281f42);position:absolute;inset:0}.art-led-inner{z-index:1;width:min(1220px,100% - 48px);margin:0 auto;position:relative}.world-art-copy{padding:112px 0}.world-art-copy .section-kicker{color:#d7f7a6}.world-art-copy h2{text-shadow:0 3px 18px #0000002e;max-width:650px}.world-art-copy p{color:#ffffffe0}.class-art{min-height:760px;color:var(--forest);background:#f4fbf6;align-items:center;display:grid}.class-art-backdrop{z-index:-2;opacity:.97;background:linear-gradient(90deg,#f4fbf6fa 0%,#f4fbf6eb 43%,#f4fbf661 72%,#f4fbf61f 100%),url(/assets/clover-monsters-hero.webp) 50% 55%/cover no-repeat;position:absolute;inset:0}.class-art-layout{grid-template-columns:.8fr 1.2fr;align-items:center;gap:clamp(48px,7vw,110px);min-height:760px;padding:100px 0;display:grid}.class-art-copy{max-width:520px}.class-art-copy>p:last-of-type{color:var(--ink-soft)}.class-family-list{border-top:1px solid #247a4b3b;flex-wrap:wrap;gap:0;margin-top:30px;display:flex}.class-family-list span{color:#315d4b;border-bottom:1px solid #247a4b3b;margin-right:18px;padding:12px 18px 12px 0;font-size:13px;font-weight:850}.client-proof{background:#111c25;margin:0;position:relative;overflow:hidden;box-shadow:0 26px 70px #183b342e}.class-client-proof{aspect-ratio:16/10}.client-proof img{object-fit:cover;width:100%;height:100%;display:block}.client-proof figcaption{color:#ffffffdb;background:linear-gradient(#0000,#050e14c7);padding:42px 18px 14px;font-size:11px;font-weight:750;position:absolute;inset:auto 0 0}.adventure-art{color:#fff;background:#102f27;padding:108px 0 0}.adventure-heading{text-align:center}.adventure-heading .section-kicker{color:#b8ed82}.adventure-heading h2{max-width:900px;margin-inline:auto}.adventure-heading>p:last-child{color:#ffffffb8;margin-inline:auto}.gameplay-proof{background:#0b211c;grid-template-columns:1.52fr .72fr;gap:12px;width:min(1500px,100% - 48px);margin:56px auto 0;display:grid}.gameplay-proof figure{background:#071814;min-width:0;margin:0;position:relative;overflow:hidden}.gameplay-proof-main,.gameplay-proof-side{min-height:540px}.gameplay-proof img{object-fit:cover;width:100%;height:100%;transition:transform 6s ease-out}.gameplay-proof figure:hover img{transform:scale(1.018)}.gameplay-proof figcaption{background:linear-gradient(#0000,#05120feb);gap:5px;padding:90px 24px 24px;display:grid;position:absolute;inset:auto 0 0}.gameplay-proof figcaption b{font-family:Kanit,Noto Sans Thai,sans-serif;font-size:24px;line-height:1.15}.gameplay-proof figcaption span{color:#ffffffb8;max-width:540px;font-size:12px;line-height:1.55}.system-line{flex-wrap:wrap;justify-content:center;align-items:center;gap:0;min-height:104px;display:flex}.system-line span{color:#ffffff9e;border-right:1px solid #fff3;padding:0 22px;font-size:12px;font-weight:850}.system-line span:last-child{border-right:0}.community-art{color:#fff;background:#1b4b3c;align-items:center;min-height:740px;display:grid}.community-art-image{z-index:-3;background:url(/assets/clover-monsters-hero.webp) 50% 44%/cover no-repeat;position:absolute;inset:-3%;transform:translate(0,0)scale(1.035)}.community-art-shade{z-index:-2;background:linear-gradient(90deg,#0d30251a 0%,#0d30252e 43%,#0d3025c7 70%,#0d3025f5 100%),linear-gradient(#0000 52%,#0d30257a);position:absolute;inset:0}.community-art-copy{text-align:right;flex-direction:column;align-items:flex-end;padding:110px 0;display:flex}.community-mark{filter:drop-shadow(0 10px 20px #0000002e);width:118px;margin-bottom:12px}.community-art-copy .section-kicker{color:#d5f69d}.community-art-copy h2{max-width:650px}.community-art-copy>p{color:#ffffffd1}.community-art-copy .quest-button{margin-top:26px}.site-footer{color:#fff;background:#15392f}.final-art-cta{isolation:isolate;text-align:center;place-items:center;min-height:660px;display:grid;position:relative;overflow:hidden}.final-art-image{z-index:-3;background:url(/assets/clover-monsters-hero.webp) 50% 56%/cover no-repeat;position:absolute;inset:-3%;transform:scale(1.035)}.final-art-shade{z-index:-2;background:linear-gradient(#0d2e252e 0%,#0d2e2547 42%,#0d2e25b8 72%,#0d2e25ed 100%),radial-gradient(circle at 50% 40%,#ffffff14,#0000002e);position:absolute;inset:0}.final-art-content{flex-direction:column;align-items:center;width:min(760px,100% - 40px);padding:90px 0 72px;display:flex}.final-cta-logo{filter:drop-shadow(0 14px 22px #0000002e);width:170px;margin:0 0 12px}.final-art-content .section-kicker{color:#d9f7a5}.final-art-content p{color:#ffffffd1;margin-inline:auto}.final-art-content .quest-button{margin-top:26px}.footer-bottom{color:#ffffff94;border-top:1px solid #ffffff1f;justify-content:space-between;align-items:center;gap:18px;min-height:84px;font-size:12px;display:flex}@media (width<=980px){.header-inner{grid-template-columns:84px 1fr auto;width:calc(100% - 28px)}.brand{width:78px}.site-header nav{gap:14px}.site-header nav a{font-size:11px}.login-link{display:none}.class-art-layout{grid-template-columns:.9fr 1.1fr;gap:36px}.gameplay-proof{grid-template-columns:1.2fr .8fr}}@media (width<=720px){.site-header{position:absolute}.header-inner{grid-template-rows:70px 44px;grid-template-columns:66px 1fr;width:calc(100% - 28px);min-height:124px}.brand{width:62px;padding-top:7px}.header-tools{justify-self:end}.register-button{display:none}.site-header nav{grid-area:2/1/auto/-1;justify-content:flex-start;padding-bottom:4px;overflow-x:auto}.site-header nav a{white-space:nowrap}.storybook-hero{min-height:820px}.storybook-hero-scene{top:112px;bottom:0}.storybook-hero-scene img{object-position:center 35%}.storybook-hero-wash{background:linear-gradient(#0000 28%,#fff7e747 46%,#fff7e7e6 70%,#fff7e7fa 100%)}.storybook-hero-content{width:calc(100% - 28px);padding:430px 0 64px}.storybook-hero-logo{width:clamp(150px,42vw,220px)}.storybook-hero h1{font-size:clamp(42px,10.5vw,62px)}.hero-intro{font-size:15px}.section-shell,.art-led-inner{width:calc(100% - 32px)}.art-led-section h2,.final-art-cta h2{font-size:clamp(36px,10vw,50px)}.world-art{background-position:67% 48%;min-height:690px}.world-art:before{background-position:67% 48%}.art-led-overlay{background:linear-gradient(#0000 0%,#0c2e2326 32%,#0c2e23b8 64%,#0c2e23ed 100%)}.world-art-copy{padding:360px 0 56px}.class-art{min-height:0}.class-art-backdrop{background:linear-gradient(#f4fbf661,#f4fbf6f5 38%,#f4fbf6 62%),url(/assets/clover-monsters-hero.webp) 58% 24%/155% no-repeat}.class-art-layout{grid-template-columns:1fr;gap:34px;min-height:0;padding:330px 0 72px}.class-art-copy{max-width:none}.class-client-proof{aspect-ratio:16/10}.adventure-art{padding-top:78px}.gameplay-proof{grid-template-columns:1fr;gap:2px;width:100%;margin-top:40px}.gameplay-proof-main,.gameplay-proof-side{aspect-ratio:16/10;min-height:0}.gameplay-proof-side img{object-position:center 42%}.system-line{width:calc(100% - 24px);min-height:92px}.system-line span{border-right:0;padding:6px 10px}.community-art{min-height:690px}.community-art-image{background-position:32% 44%}.community-art-shade{background:linear-gradient(#0000 0%,#0b2c2226 30%,#0b2c22c4 65%,#0b2c22f5 100%)}.community-art-copy{text-align:left;align-items:flex-start;min-height:690px;padding:350px 0 58px}.community-mark{width:94px}.final-art-cta{min-height:630px}.final-art-image{background-position:62% 52%}.final-art-content{padding-top:300px}.footer-bottom{text-align:center;flex-direction:column;justify-content:center;width:calc(100% - 32px);padding:20px 0}}@media (width<=420px){.header-inner{width:calc(100% - 20px)}.locale-switch{padding:6px 8px}.storybook-hero{min-height:760px}.storybook-hero-content{padding-top:405px}.storybook-hero h1{font-size:clamp(38px,12vw,50px)}.storybook-actions{grid-template-columns:1fr 1fr;gap:9px;display:grid}.quest-button{min-width:0;min-height:50px;padding:0 12px;font-size:14px}.section-shell,.art-led-inner{width:calc(100% - 24px)}.world-art{min-height:650px}.world-art-copy{padding-top:340px}.class-art-layout{padding-top:300px}.class-family-list span{margin-right:12px;padding-right:12px}.gameplay-proof figcaption{padding:70px 16px 16px}.gameplay-proof figcaption b{font-size:20px}.community-art-copy{padding-top:330px}.final-art-content{width:calc(100% - 24px);padding-top:285px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.world-art:before,.gameplay-proof img{transform:none!important}}.route-footer{color:#fff;background:#15392f;min-height:96px}.route-footer .footer-bottom{border-top:0;min-height:96px;padding:18px 0}.route-footer-brand{color:#ffffffbd;align-items:center;gap:11px;min-width:190px;font-size:11px;font-weight:750;display:flex}.route-footer-brand img{object-fit:contain;width:58px;max-height:58px}.route-footer nav{flex-wrap:wrap;justify-content:center;gap:8px 16px;display:flex}.route-footer nav a{color:#ffffffb8;font-size:11px;font-weight:800}.route-footer nav a:hover{color:#fff}.route-footer-register{color:#5d431e;background:#fff2b8;border-radius:999px;align-items:center;min-height:42px;padding:0 16px;font-size:11px;font-weight:900;display:inline-flex;box-shadow:0 4px #c89b2b}.route-page{isolation:isolate;color:#fff;background:#1b4b3c;align-items:center;min-height:calc(100svh - 96px);display:grid;position:relative;overflow:hidden}.route-page-art{z-index:-3;background:url(/assets/clover-monsters-hero.webp) 62% 48%/cover no-repeat;position:absolute;inset:-3%;transform:scale(1.03)}.route-page-shade{z-index:-2;background:linear-gradient(90deg,#0c2e23f0 0%,#0c2e23c7 42%,#0c2e2347 72%,#0c2e231f);position:absolute;inset:0}.route-page-copy{padding:160px 0 90px}.route-page-copy .section-kicker{color:#d5f69d}.route-page-copy h1,.route-register h1{letter-spacing:-.028em;text-wrap:balance;max-width:760px;margin:0;font-family:Kanit,Noto Sans Thai,sans-serif;font-size:clamp(44px,5.2vw,76px);line-height:1.02}.route-page-copy>p:last-of-type{color:#ffffffd1;max-width:650px;margin:18px 0 0;font-size:16px;line-height:1.72}.route-page-copy .quest-button{margin-top:28px}.route-register .final-art-content{padding-top:160px}.route-register-panel{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0e34288a;border:1px solid #ffffff2e;border-radius:14px;gap:5px;width:min(560px,100%);margin-top:28px;padding:18px 20px;display:grid}.route-register-panel strong{font-family:Kanit,Noto Sans Thai,sans-serif;font-size:18px}.route-register-panel span{color:#ffffffb8;font-size:12px;line-height:1.55}@media (width<=980px){.route-footer .footer-bottom{flex-wrap:wrap;justify-content:center}.route-footer-brand{min-width:0}}@media (width<=720px){.route-footer .footer-bottom{flex-direction:column;width:calc(100% - 28px);min-height:0;padding:20px 0}.route-footer nav{gap:9px 13px}.route-page{min-height:calc(100svh - 190px)}.route-page-art{background-position:62% 44%}.route-page-shade{background:linear-gradient(#0c2e233d 18%,#0c2e23c2 52%,#0c2e23f5 100%)}.route-page-copy{width:calc(100% - 32px);padding:420px 0 60px}.route-page-copy h1,.route-register h1{font-size:clamp(38px,11vw,52px)}.route-register .final-art-content{padding-top:320px}}.site-header{color:#fff;background:linear-gradient(#052b4eb8,#04314a57 72%,#0000);position:absolute}.header-inner{grid-template-columns:116px 1fr auto;gap:20px;width:min(1480px,100% - 34px);min-height:104px}.brand{width:92px;padding-top:10px}.brand-badge{filter:drop-shadow(0 8px 14px #00000042)}.site-header nav{align-self:stretch;gap:clamp(11px,1.65vw,27px)}.site-header nav a{color:#ffffffe6;text-shadow:0 2px 7px #001a35a8;flex-direction:column;justify-content:center;align-items:center;gap:5px;min-width:58px;padding:15px 2px 12px;font-size:12px;font-weight:700;display:flex}.site-header nav a:after{background:#d7ef66;height:2px;bottom:7px}.site-header nav a.active:after{left:13%;right:13%}.header-tools{color:#fff;gap:11px}.locale-switch{color:#ffffffb8;background:#072f4557;border-color:#ffffff57;box-shadow:inset 0 0 0 1px #0000000d}.register-button{color:#3f2a11;background:linear-gradient(#ffe69c,#e8b64c);border-color:#f8d46a;box-shadow:0 4px #9c721f,0 9px 18px #0003}.storybook-hero{min-height:min(890px,100svh)}.storybook-hero-scene img{object-position:center 47%}.hero-focus-panel{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:radial-gradient(circle at 50% 8%,#fffffffa,#fffdeff0 46%,#f7f4dbe3 100%);border:1px solid #ffe69ccc;border-radius:34px 34px 44px 44px;width:min(760px,100%);margin:0 auto;padding:80px 58px 40px;position:relative;box-shadow:0 24px 70px #0739303d,inset 0 0 0 4px #ffffff73,inset 0 -8px 18px #c1973d14}.hero-focus-panel:before,.hero-focus-panel:after{content:"✦";color:#e5b948;opacity:.78;font-size:20px;position:absolute;top:46%}.hero-focus-panel:before{left:27px}.hero-focus-panel:after{right:27px}.hero-genre{color:#3a7b42;margin-top:4px;margin-bottom:10px}.storybook-hero h1{color:#214c35;text-shadow:0 2px #ffffffe6,0 5px 16px #455e2d14;font-family:Georgia,Times New Roman,Kanit,serif;font-size:clamp(46px,4.8vw,70px);line-height:1.03}.storybook-hero h1 strong{color:#214c35;text-shadow:inherit}.storybook-actions .quest-button{border-radius:999px;min-width:205px;min-height:56px;font-size:17px}.scroll-clover{color:#f0f7ce;background:#0d443799;border-color:#ffffff7a;bottom:18px;box-shadow:0 8px 22px #00000029}.route-footer{background:#073631f5;border-top:1px solid #d8eea92e;min-height:72px}.route-footer .footer-bottom{min-height:72px;padding:8px 0}.route-footer-brand img{width:45px;max-height:45px}.route-footer-brand span{display:none}.route-footer nav{gap:7px 24px}.route-footer nav a{color:#ffffffb3;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-width:42px;min-height:48px;display:flex}.route-footer nav a span{opacity:.75;font-size:9px}.route-footer-register{min-height:38px}@media (width<=1100px){.header-inner{grid-template-columns:88px 1fr auto}.brand{width:74px}.site-header nav{gap:9px}.site-header nav a{min-width:52px;font-size:10px}.site-header nav a .nav-icon-svg{width:19px;height:19px}}@media (width<=820px){.header-inner{grid-template-rows:70px 50px;grid-template-columns:66px 1fr;min-height:126px}.site-header nav{grid-area:2/1/auto/-1;justify-content:flex-start;overflow-x:auto}.site-header nav a{flex:none;min-width:62px;padding:5px 3px 10px}.storyboard-hero-content{padding-top:430px}}@media (width<=720px){.storybook-hero-content{padding:430px 0 54px}.hero-focus-panel{border-radius:26px 26px 32px 32px;padding:66px 22px 28px}.hero-focus-panel:before,.hero-focus-panel:after{display:none}.storybook-hero-logo{width:150px}.storybook-hero h1{font-size:clamp(37px,10vw,50px)}.storybook-actions .quest-button{flex:150px;min-width:0;font-size:14px}.route-footer nav a span{display:none}}@media (width<=420px){.storybook-hero-content{padding-top:405px}.hero-focus-panel{padding-inline:16px}.storybook-actions{grid-template-columns:1fr 1fr;gap:8px}.storybook-actions .quest-button{min-height:48px;padding-inline:8px}}.site-header{color:#44564e;-webkit-backdrop-filter:blur(18px)saturate(.8);backdrop-filter:blur(18px)saturate(.8);background:#fcfdfbd6;border-bottom:1px solid #41524a1a;box-shadow:0 8px 28px #23342d0f}.site-header nav a{color:#58675f;text-shadow:none;font-weight:650}.site-header nav a .nav-icon-svg{opacity:.82;filter:none}.site-header nav a:after{background:#93a78f}.site-header nav a:hover,.site-header nav a.active{color:#6e876c}.header-tools{color:#53635b}.locale-switch{color:#738079;box-shadow:none;background:#ffffffa8;border-color:#4e62582e}.locale-switch button{color:#89938e}.locale-switch button.active{color:#53675d}.login-link{color:#596860;text-shadow:none}.register-button{color:#4f6157;background:#f7f9f6;border:1px solid #cbd4c9;border-radius:10px;box-shadow:0 3px 10px #34433b12}.storybook-hero-wash{background:linear-gradient(#ffffff1a 0%,#0000 28%),radial-gradient(at 50% 73%,#fffffff5 0%,#ffffffc7 20%,#ffffff6b 38%,#ffffff14 57%,#0000 70%),linear-gradient(#0000 64%,#fafcf947 82%,#fafcf9d1 100%)}.storybook-hero-content{width:min(980px,100% - 40px);padding:230px 0 64px}.hero-focus-panel{width:min(820px,100%);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:radial-gradient(at 50% 58%,#ffffffb8 0%,#ffffff6b 42%,#0000 76%);border:0;border-radius:0;margin:0 auto;padding:18px 48px 26px;position:relative}.hero-focus-panel:before,.hero-focus-panel:after{content:none}.storybook-hero-logo{filter:drop-shadow(0 8px 12px #3243391f);width:clamp(165px,14vw,220px);margin:0 auto 8px;position:relative;top:auto;left:auto;transform:none}.hero-genre{display:none}.storybook-hero h1{color:#3f5149;text-shadow:0 1px #ffffffeb,0 4px 14px #3a49410f;font-size:clamp(44px,4.55vw,66px);line-height:1.02}.storybook-hero h1 strong{color:#4a5d54}.hero-intro{color:#64726b;max-width:620px;margin-top:13px;font-size:15px;line-height:1.58}.storybook-actions{gap:10px;margin-top:21px}.quest-button,.storybook-actions .quest-button{min-width:188px;min-height:50px;box-shadow:none;border-radius:10px;font-size:15px;font-weight:700}.quest-button.primary{color:#50634f;background:#edf2ec;border:1px solid #bccaba;box-shadow:0 3px 11px #3e524214}.quest-button.secondary{color:#5f6863;background:#ffffffe0;border:1px solid #d7dcd6;box-shadow:0 3px 11px #3e48420f}.quest-button:hover{transform:translateY(-1px);box-shadow:0 5px 14px #3e52421a}.scroll-clover{color:#71857a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffffb8;border-color:#54685e29;box-shadow:0 4px 14px #35433c12}.route-footer{color:#5d6a63;background:#f8faf8f5;border-top:1px solid #44544c1a}.route-footer nav a{color:#7b8680}.route-footer nav a:hover,.route-footer nav a.active{color:#6d836f}.route-footer-register{color:#5b6a61;box-shadow:none;background:#f5f7f4;border:1px solid #d0d8cf;border-radius:10px}@media (width<=820px){.site-header{background:#fcfdfbe6}.storybook-hero-content{padding-top:420px}.hero-focus-panel{padding:14px 24px 24px}}@media (width<=720px){.storybook-hero-wash{background:radial-gradient(at 50% 73%,#fffffffa 0%,#ffffffd1 26%,#ffffff61 48%,#0000 68%),linear-gradient(#0000 40%,#fafcf95c 68%,#fafcf9eb 100%)}.hero-focus-panel{border-radius:0;padding:10px 18px 22px}.storybook-hero-logo{width:148px}.storybook-actions .quest-button{flex:145px;min-width:0;font-size:14px}}@media (width<=420px){.hero-focus-panel{padding-inline:8px}.storybook-actions .quest-button{min-height:46px}}.hero-wordmark-crop{filter:drop-shadow(0 8px 12px #3243391a);width:clamp(230px,18vw,285px);height:clamp(90px,7vw,112px);margin:0 auto 6px;overflow:hidden}.hero-wordmark-crop .storybook-hero-logo{filter:none;width:100%;max-width:none;margin:0;position:static;transform:translateY(-61%)}.route-footer .footer-bottom{justify-content:space-between}.route-footer nav{margin-left:auto}@media (width<=720px){.hero-wordmark-crop{width:215px;height:86px}.hero-wordmark-crop .storybook-hero-logo{width:100%;transform:translateY(-61%)}}.hero-wordmark-crop .storybook-hero-logo{transform:translateY(-65%)}@media (width<=720px){.hero-wordmark-crop .storybook-hero-logo{transform:translateY(-65%)}}html,body,#root{max-width:100%;overflow-x:hidden}@media (width<=820px){.header-inner{grid-template-columns:66px minmax(0,1fr);min-width:0}.site-header nav{overscroll-behavior-x:contain;scrollbar-width:none;width:100%;min-width:0;max-width:100%;overflow-x:auto}.site-header nav::-webkit-scrollbar{display:none}.header-tools{min-width:0;max-width:100%}.storybook-hero-content{max-width:100%}.hero-focus-panel{box-sizing:border-box;width:100%}.storybook-hero h1,.hero-intro,.storybook-actions{max-width:100%}}@media (width<=420px){.header-inner{grid-template-columns:62px minmax(0,1fr)}.storybook-hero-content{width:calc(100% - 24px)}.storybook-hero h1{font-size:clamp(36px,10vw,43px)}.storybook-actions{width:100%}}.storybook-hero-logo-full{object-fit:contain;filter:drop-shadow(0 8px 14px #3243391f);width:clamp(118px,9.5vw,154px);height:auto;margin:0 auto 6px}@media (width<=720px){.storybook-hero-logo-full{width:132px;margin-bottom:2px}}.route-footer{background:#f8faf8f7;min-height:76px}.route-footer .footer-bottom{color:#748078;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;min-height:76px;display:grid}.route-footer-copy{font-size:11px;font-weight:700}.route-footer small{color:#8c9690;justify-self:end;font-size:10px}.footer-socials{justify-content:center;align-items:center;gap:10px;display:flex}.footer-socials a{background:#ffffffb8;border:1px solid #51635924;border-radius:50%;place-items:center;width:38px;height:38px;transition:transform .16s,background .16s;display:grid}.footer-socials a:hover{background:#fff;transform:translateY(-1px)}.channel-brand-icon{object-fit:contain;filter:grayscale()saturate(0);opacity:.63;width:18px;height:18px}.footer-socials a:hover .channel-brand-icon,.community-channel-list a:hover .channel-brand-icon{filter:none;opacity:1}.portal-page{color:#405149;background:#f5f7f4;min-height:calc(100svh - 76px)}.portal-intro{isolation:isolate;align-items:end;min-height:430px;display:grid;position:relative;overflow:hidden}.portal-intro-art{z-index:-3;opacity:.72;background:url(/assets/clover-monsters-hero.webp) 70% 46%/cover no-repeat;position:absolute;inset:0}.portal-intro-wash{z-index:-2;background:linear-gradient(90deg,#f8faf7fc 0%,#f8faf7f0 42%,#f8faf794 68%,#f8faf72e),linear-gradient(#0000 58%,#f5f7f4f0);position:absolute;inset:0}.portal-intro-copy{padding:148px 0 68px}.portal-intro-copy .section-kicker{color:#7c907f}.portal-title-line{flex-wrap:wrap;align-items:flex-end;gap:18px;display:flex}.portal-title-line h1{color:#3e5148;letter-spacing:-.025em;text-wrap:balance;max-width:780px;margin:0;font:700 clamp(42px,5vw,70px)/1.02 Georgia,Noto Sans Thai,serif}.portal-intro-copy>p:last-child{color:#68766f;max-width:620px;margin:18px 0 0;line-height:1.7}.portal-status{color:#718076;text-transform:uppercase;letter-spacing:.08em;border:1px solid #ced8cf;border-radius:999px;margin-bottom:7px;padding:6px 9px;font-size:10px;font-weight:800}.portal-body{padding:64px 0 90px}.portal-meta-list{border-top:1px solid #dce3dd;max-width:760px;margin:0 0 28px}.portal-meta-list>div{border-bottom:1px solid #dce3dd;grid-template-columns:150px 1fr;align-items:center;min-height:54px;display:grid}.portal-meta-list dt{color:#8a958f;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:800}.portal-meta-list dd{color:#4d5d55;margin:0;font-weight:700}.portal-note{color:#66746c;max-width:720px;margin:0 0 24px;line-height:1.65}.portal-empty{color:#818c86;max-width:720px;margin:0;line-height:1.65}.portal-body .quest-button{margin-top:8px}.portal-text-link{color:#687c6e;margin:24px 0 0 18px;font-size:12px;font-weight:800;display:inline-flex}.news-list{border-top:1px solid #dce3dd}.news-row{border-bottom:1px solid #dce3dd;grid-template-columns:150px minmax(0,1fr) auto;align-items:center;gap:30px;min-height:150px;padding:28px 0;display:grid}.news-meta{color:#89948e;text-transform:uppercase;letter-spacing:.07em;gap:6px;font-size:10px;font-weight:800;display:grid}.news-row h2{color:#405149;margin:0;font:700 clamp(24px,2.4vw,36px)/1.08 Georgia,Noto Sans Thai,serif}.news-row p{color:#6d7a73;max-width:650px;margin:9px 0 0;line-height:1.6}.news-row>a{color:#6a7e70;white-space:nowrap;font-size:12px;font-weight:800}.faq-list{max-width:880px}.faq-list details{border-top:1px solid #dce3dd;padding:0}.faq-list details:last-of-type{border-bottom:1px solid #dce3dd}.faq-list summary{cursor:pointer;color:#4b5c53;padding:20px 0;font-weight:800}.faq-list details p{color:#6d7a73;max-width:720px;margin:-6px 0 22px;line-height:1.65}.community-links-section{color:#43544c;background:#f7f9f6;border-top:1px solid #e1e7e2;padding:70px 0 82px}.community-links-inner{grid-template-columns:1fr 1fr;align-items:center;gap:70px;display:grid}.community-links-inner h2{margin:0;font:700 clamp(34px,4vw,54px)/1.05 Georgia,Noto Sans Thai,serif}.community-links-inner p:last-child{color:#758179;max-width:540px;line-height:1.65}.community-channel-list{flex-wrap:wrap;justify-content:flex-end;gap:12px;display:flex}.community-channel-list a{color:#596960;background:#fffc;border:1px solid #d6ded7;align-items:center;gap:9px;min-width:124px;min-height:48px;padding:0 16px;font-size:12px;font-weight:800;display:inline-flex}.community-channel-list .channel-brand-icon{width:19px;height:19px}@media (width<=720px){.route-footer .footer-bottom{text-align:center;grid-template-columns:1fr;gap:10px;padding:14px 0}.route-footer small{justify-self:center}.portal-intro{min-height:390px}.portal-intro-art{opacity:.5;background-position:60% 42%}.portal-intro-wash{background:linear-gradient(#f8faf77a 0%,#f8faf7eb 42%,#f8faf7fc 100%)}.portal-intro-copy{padding:190px 0 46px}.portal-title-line h1{font-size:clamp(38px,11vw,52px)}.portal-body{padding:42px 0 64px}.portal-meta-list>div{grid-template-columns:110px 1fr}.news-row{grid-template-columns:1fr;gap:12px}.news-row>a{justify-self:start}.community-links-inner{grid-template-columns:1fr;gap:28px}.community-channel-list{justify-content:flex-start}}.announcement-bar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#f7f9f6eb;border-top:1px solid #495b5214;border-bottom:1px solid #495b5214}.announcement-inner{text-align:center;justify-content:center;align-items:center;min-height:34px;display:flex}.announcement-inner a,.announcement-inner span{color:#6c7c73;letter-spacing:.01em;font-size:11px;font-weight:750}.announcement-inner a:hover{color:#4f6559}@media (width<=720px){.announcement-inner{width:calc(100% - 24px);min-height:36px}.announcement-inner a,.announcement-inner span{font-size:10px;line-height:1.35}}.footer-socials .footer-social-disabled{cursor:default;background:#ffffff75;border:1px solid #5163591a;border-radius:50%;place-items:center;width:38px;height:38px;display:grid}.footer-socials .footer-social-disabled .channel-brand-icon{opacity:.32}.class-catalog-section{isolation:isolate;color:#405149;background:#f6f8f5;min-height:100svh;padding:154px 0 92px;position:relative;overflow:hidden}.class-catalog-backdrop{z-index:-1;background:radial-gradient(circle at 82% 12%,#fffffff0,#0000 34%),radial-gradient(circle at 14% 44%,#dce8db6b,#0000 30%),linear-gradient(#f8faf7 0%,#f3f6f2 58%,#f7f9f6 100%);position:absolute;inset:0}.class-catalog-shell{z-index:1;position:relative}.class-catalog-heading{max-width:880px}.class-catalog-heading .section-kicker{color:#7e9281}.class-catalog-heading h1{color:#3e5148;letter-spacing:-.035em;text-wrap:balance;margin:8px 0 0;font:700 clamp(48px,5.8vw,78px)/.98 Georgia,Noto Sans Thai,serif}.class-catalog-heading>p:not(.section-kicker){color:#6e7b74;max-width:760px;margin:20px 0 0;line-height:1.72}.class-catalog-count{color:#6f8274;letter-spacing:.08em;text-transform:uppercase;margin-top:20px;font-size:11px;font-weight:800;display:inline-block}.class-catalog-toolbar{border-top:1px solid #d9e1da;border-bottom:1px solid #d9e1da;grid-template-columns:minmax(0,1fr) 260px;align-items:end;gap:36px;margin-top:46px;padding:0;display:grid}.class-family-rail{scrollbar-width:none;align-items:stretch;gap:26px;min-width:0;display:flex;overflow-x:auto}.class-family-rail::-webkit-scrollbar{display:none}.class-family-rail button{color:#7d8982;cursor:pointer;min-height:54px;font:inherit;letter-spacing:.025em;background:0 0;border:0;flex:none;padding:0;font-size:11px;font-weight:800;position:relative}.class-family-rail button:after{content:"";background:0 0;height:2px;position:absolute;bottom:-1px;left:0;right:0}.class-family-rail button:hover,.class-family-rail button.active{color:#53695d}.class-family-rail button.active:after{background:#819783}.class-search{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px;min-height:54px;display:grid}.class-search span{color:#8a958e;letter-spacing:.08em;text-transform:uppercase;font-size:9px;font-weight:800}.class-search input{color:#4d5f55;width:100%;min-width:0;font:inherit;background:0 0;border:0;outline:0;padding:0;font-size:12px;font-weight:700}.class-search input::placeholder{color:#a0aaa4}.class-catalog-layout{grid-template-columns:minmax(330px,.86fr) minmax(0,1.3fr);align-items:start;gap:clamp(40px,6vw,84px);margin-top:46px;display:grid}.class-feature-stage{background:radial-gradient(circle at 52% 54%,#fffffff5,#ffffff57 48%,#0000 72%);border-top:1px solid #d9e1da;border-bottom:1px solid #d9e1da;min-height:620px;position:sticky;top:108px;overflow:hidden}.class-feature-copy{z-index:2;padding:28px 4px 0;position:relative}.class-feature-copy>span{color:#87958c;letter-spacing:.1em;text-transform:uppercase;font-size:10px;font-weight:850}.class-feature-copy h2{color:#40544a;letter-spacing:-.03em;margin:6px 0 0;font:700 clamp(40px,4.4vw,64px)/1 Georgia,Noto Sans Thai,serif}.class-feature-copy p{color:#89948e;margin:9px 0 0;font-size:10px;font-weight:700}.class-feature-art-wrap{place-items:center;min-height:500px;padding:8px 14px 26px;display:grid}.class-feature-art-wrap img{object-fit:contain;filter:drop-shadow(0 24px 28px #384b4129);width:min(100%,520px);max-height:480px}.class-roster-list{border-top:1px solid #d9e1da;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;display:grid}.class-roster-list>button{color:#53645b;text-align:left;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #d9e1da;grid-template-columns:70px minmax(0,1fr);align-items:center;gap:14px;min-height:94px;padding:8px 4px;transition:background .16s,color .16s;display:grid}.class-roster-list>button:hover,.class-roster-list>button.selected{color:#40574a;background:linear-gradient(90deg,#e2ebe18a,#fff0)}.class-roster-thumb{place-items:end center;width:64px;height:78px;display:grid;overflow:hidden}.class-roster-thumb img{object-fit:contain;filter:drop-shadow(0 7px 8px #4050461f);width:100%;height:100%}.class-roster-text{gap:5px;min-width:0;display:grid}.class-roster-text b{color:inherit;text-overflow:ellipsis;font-size:13px;font-weight:850;line-height:1.2;overflow:hidden}.class-roster-text small{color:#929d96;letter-spacing:.045em;text-transform:uppercase;font-size:9px;font-weight:750}.class-roster-empty{color:#89958e;border-bottom:1px solid #d9e1da;grid-column:1/-1;margin:0;padding:32px 0}.class-catalog-source-note{color:#8b9690;max-width:920px;margin:40px 0 0;font-size:10px;line-height:1.65}@media (width<=980px){.class-catalog-toolbar{grid-template-columns:1fr;gap:0}.class-search{border-top:1px solid #e1e6e2}.class-catalog-layout{grid-template-columns:1fr}.class-feature-stage{min-height:540px;position:relative;top:auto}.class-feature-art-wrap{min-height:410px}}@media (width<=720px){.class-catalog-section{padding:176px 0 68px}.class-catalog-heading h1{font-size:clamp(40px,11vw,52px)}.class-catalog-heading>p:not(.section-kicker){margin-top:16px}.class-catalog-toolbar{margin-top:34px}.class-family-rail{gap:22px}.class-family-rail button{min-height:50px}.class-search{grid-template-columns:92px minmax(0,1fr);min-height:52px}.class-catalog-layout{gap:34px;margin-top:34px}.class-feature-stage{min-height:470px}.class-feature-copy{padding-top:20px}.class-feature-copy h2{font-size:clamp(38px,12vw,52px)}.class-feature-art-wrap{min-height:340px;padding-bottom:18px}.class-feature-art-wrap img{max-height:330px}.class-roster-list{grid-template-columns:1fr}.class-roster-list>button{grid-template-columns:62px minmax(0,1fr);min-height:86px}.class-roster-thumb{width:58px;height:70px}.class-catalog-source-note{margin-top:30px}}