/*
Theme Name: Rune Origin
Description: Rune Origin fantasy homepage with 18 jobs and 36 character looks.
Version: 1.0.0
Author: Rune Origin
Text Domain: rune-origin
Requires at least: 6.3
Requires PHP: 7.4
*/
:root{--ink:#224b65;--muted:#627e88;--teal:#078aaa;--gold:#bb9555;--line:#dce4d9;--font:'Sarabun',sans-serif;--rune-primary:url('assets/rune-button-primary.png');--rune-pearl:url('assets/rune-button-pearl.png');--rune-orb:url('assets/rune-button-orb.png')}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:#fffdf4;color:var(--ink);font:15px/1.8 var(--font)}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.35}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}button,a,summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}img{display:block;max-width:100%}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #08accc;outline-offset:5px}::selection{background:#b9eff2}.skip-link{position:absolute;top:-100px;background:white;padding:12px;left:12px;z-index:200}.skip-link:focus{top:10px}.concept-bar{height:29px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(90deg,#147f9b,#38a9ad,#72bba9);color:white;font-size:9px;letter-spacing:1.8px}.concept-bar>span:last-child{font-size:10px;letter-spacing:.3px}.bar-separator{margin:0 12px;color:#ffe19b}.site-header{height:94px;padding:0 4.5%;display:flex;justify-content:space-between;align-items:center;gap:20px;position:sticky;top:0;z-index:20;background:#fffcf2f2;backdrop-filter:blur(14px);box-shadow:0 1px #ccae6780,0 5px 18px #438ca513}.brand{display:block;flex-shrink:0}.brand img{width:190px;height:70px;object-fit:contain}.site-header nav{display:flex;gap:6px;align-items:center}.rune-link,.class-jumps a,.world-tabs button{background:var(--rune-pearl) center/100% 165% no-repeat;display:flex;align-items:center;justify-content:center;min-height:47px;padding:8px 25px;font-size:13px;font-weight:600;color:#416576;white-space:nowrap;border:0;transition:filter .2s,transform .2s}.rune-link:hover,.class-jumps a:hover,.world-tabs button:hover{filter:brightness(1.08) drop-shadow(0 0 6px #51e0e9a0);transform:translateY(-1px)}.button,.text-button{background:var(--rune-primary) center/100% 125% no-repeat;min-width:225px;min-height:67px;padding:17px 34px;display:inline-flex;align-items:center;justify-content:center;gap:15px;font-size:15px;font-weight:600;line-height:1.4;text-align:center;color:#fffdf0;white-space:nowrap;text-shadow:0 1px 3px #154759;transition:filter .2s,transform .2s}.button:hover,.text-button:hover{filter:brightness(1.12) drop-shadow(0 3px 7px #1bbbb677);transform:translateY(-2px)}.button-light,.text-button{background-image:var(--rune-pearl);background-size:100% 165%;color:#295367;text-shadow:0 1px #fff7}.button-small{min-width:208px;min-height:57px;padding:14px 26px;font-size:12px;gap:7px}.button>span,.text-button>span{font-size:18px}.rune-orb{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;min-width:48px;padding:0;background:var(--rune-orb) center/100% 100% no-repeat;color:#174965;border:0;border-radius:50%;font-size:24px;line-height:1;font-weight:600;text-shadow:0 1px #eeffffa8;transition:filter .2s,transform .2s}.rune-orb:hover{filter:brightness(1.1) drop-shadow(0 0 6px #37d9d3);transform:scale(1.04)}.menu-toggle{display:none}.hero{position:relative;height:700px;isolation:isolate;overflow:hidden;background:#a7e8fa}.hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 60%;z-index:-3}.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#e8faffd9 0%,#e8faff8c 29%,transparent 57%);z-index:-2}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#fffdf5b3,transparent 19%);z-index:-1}.hero-copy{width:min(1220px,88%);margin:auto;padding:125px 0 0;position:relative}.eyebrow{font:600 10px/1.6 var(--font);letter-spacing:2.5px;color:#a68a4f}.hero .eyebrow{font-size:10px;letter-spacing:2.8px;color:#317593}.hero h1{font-size:70px;font-weight:700;line-height:1.3;letter-spacing:-2px;margin:18px 0 15px;color:#2e506e;text-shadow:0 2px 18px #fff9}.hero h1 span{color:#058eb2}.hero-description{font-size:18px;line-height:1.9;color:#3c6681;text-shadow:0 1px 8px white}.hero-actions{display:flex;gap:12px;margin-top:25px}.hero-actions .button{min-width:228px}.hero-footnote{font-size:11px;color:#3e768d;margin:12px 0 0 18px}.art-caption{position:absolute;bottom:20px;right:28px;font-size:10px;color:#335c74;padding:3px 10px;background:#ffffffe0;border:1px solid #e8d9b4;border-radius:2px}.scroll-cue{position:absolute;bottom:23px;left:6%;font:9px var(--font);letter-spacing:2.5px;color:#3a6c81;display:flex;align-items:center;gap:15px}.scroll-cue span{font-size:21px}.welcome-strip{min-height:80px;background:linear-gradient(90deg,#e6f9fa,#fff7db,#eaf9e8);border-top:1px solid #fff;border-bottom:1px solid #dbc98b75;display:flex;align-items:center;justify-content:center;gap:18px;padding:15px 5%;font-size:14px}.strip-star{font-size:26px;color:#c2a352}.strip-line{height:20px;width:1px;background:#d1d8bd;margin:0 12px}.status-dot{width:6px;height:6px;border-radius:50%;background:#74b895;margin-right:-10px}.development{font-size:12px;color:#5e8a79}.welcome-strip a{font-size:12px;margin-left:45px}.welcome-strip a span{margin-left:22px}.section-wrap{width:min(1220px,88%);margin:auto}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:38px}.section-heading .eyebrow{margin-bottom:12px}h2{font-size:37px;font-weight:600;letter-spacing:-.6px}.section-intro{font-size:14px;color:#68888d;line-height:1.9}.world{padding-top:90px;padding-bottom:95px}.world-layout{display:grid;grid-template-columns:1.4fr 1fr;gap:59px;align-items:center}.world-visual{height:395px;border:3px solid #f3e2ad;box-shadow:0 0 0 1px #d4c38c,0 12px 30px #569fa324;position:relative;overflow:hidden;border-radius:7px}.world-visual>img{width:100%;height:100%;object-fit:cover}.world-visual:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#174c70a8);pointer-events:none}.image-bottom{position:absolute;bottom:18px;left:21px;right:18px;display:flex;align-items:center;justify-content:space-between;color:white;z-index:2;font-size:11px;letter-spacing:.6px}.corner-mark{position:absolute;top:13px;left:18px;font-size:28px;color:#fff9d9;text-shadow:0 0 10px #35c9f3}.location-index{font:9px var(--font);letter-spacing:1.8px;color:#6c969d;display:flex;justify-content:space-between}.location-index span{color:#b99b51}.world-tabs{display:flex;gap:7px;margin-top:15px}.world-tabs button{min-width:106px;padding:10px 19px;min-height:47px;font-size:12px}.world-tabs button.active{background-image:var(--rune-primary);background-size:100% 125%;color:#fffde9;text-shadow:0 1px #165a6b}.location-kicker{font:10px var(--font);letter-spacing:2px;color:#ab9352;margin-top:29px}.world-copy h3{font-size:28px;font-weight:600;margin:12px 0 17px}.world-copy #location-text{font-size:14px;line-height:1.95;color:#6a8288;min-height:83px}.location-tags{display:flex;gap:9px;margin:18px 0}.location-tags span{font-size:10px;border:1px solid #d6dab8;padding:4px 11px;border-radius:20px;background:#f4f8e8;color:#688975}.text-button{min-width:198px;min-height:54px;padding:13px 28px;font-size:13px;gap:14px}.heroes{background:radial-gradient(ellipse at 5% 20%,#e1f8d6,transparent 40%),radial-gradient(ellipse at 95% 40%,#dfe6ff,transparent 40%),linear-gradient(#e4f8ff,#e7f7ef 65%,#fafce8);position:relative;border-top:1px solid #cae4da;border-bottom:1px solid #d8dfbc;overflow:hidden}.heroes:before{content:'✧';position:absolute;top:65px;right:7%;font:130px/1 Georgia;color:#81d2d840;pointer-events:none}.heroes:after{content:'✦';position:absolute;left:3%;bottom:60px;color:#d4bb7035;font-size:180px;pointer-events:none}.heroes-inner{padding:77px 0 55px;position:relative;z-index:1}.classes-heading{text-align:center}.classes-heading .eyebrow{color:#6e98aa}.classes-heading h2{font-size:43px;color:#217791;margin:16px 0 18px}.classes-heading>p:not(.eyebrow){font-size:14px;color:#6c8792;line-height:1.95}.section-flourish{display:block;color:#c3a358;font-size:18px;letter-spacing:9px;margin-top:20px}.class-jumps{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:25px 0 36px}.class-jumps a{font:15px var(--font);min-height:54px;padding:13px 23px}.class-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.class-card{position:relative;padding:25px 26px 22px;border:1px solid #d5b66c;border-radius:10px;background:linear-gradient(135deg,#fffef8e6,#ffffffe3);box-shadow:inset 0 0 0 5px #fcf7e680,0 9px 24px #497a8a12;text-align:center;scroll-margin-top:120px}.class-card:before,.class-card:after{content:'✧';position:absolute;color:#cda95b;font-size:26px;line-height:1;top:3px}.class-card:before{left:5px}.class-card:after{right:5px}.class-card-heading{display:flex;align-items:center;gap:14px;text-align:left;padding:0 2px 16px;border-bottom:1px solid #d8d5bf7d}.class-symbol{display:flex;align-items:center;justify-content:center;background:var(--class-tint);border:1px solid #d4ba7d;width:47px;height:47px;min-width:47px;transform:rotate(45deg);border-radius:9px;color:var(--class-accent);font:26px var(--font)}.class-card-heading>div{margin-left:2px}.class-card-heading p{font-size:11px;color:var(--class-accent)}.class-card-heading h3{font:27px/1.3 var(--font);color:#37566c;margin-top:3px}.class-index{font:38px var(--font);color:#d9cfaa;margin-left:auto}.pair-art-button{display:block;position:relative;width:100%;height:330px;padding:0;margin-top:15px;border-radius:45% 45% 18% 18%;isolation:isolate;background:radial-gradient(ellipse at 50% 64%,var(--class-tint),#ffffff00 71%)}.pair-art-button img{position:relative;width:100%;height:100%;object-fit:contain;z-index:1;filter:drop-shadow(0 9px 8px #315c7110);transition:transform .3s}.pair-art-button:hover img{transform:translateY(-3px) scale(1.018)}.pair-orbit{position:absolute;width:260px;height:260px;max-width:80%;top:32px;left:50%;transform:translateX(-50%);border:1px solid #c8c39875;border-radius:50%;z-index:0}.pair-orbit:after{content:'';position:absolute;inset:12px;border:1px dashed #c8c39870;border-radius:50%}.pair-zoom{position:absolute;right:0;bottom:0;width:38px;height:38px;min-width:38px;font-size:20px;z-index:2;opacity:.7}.pair-art-button:hover .pair-zoom{opacity:1}.gender-labels{display:grid;grid-template-columns:1fr 1fr;gap:15px;text-align:center;margin:2px 0 11px;font-size:12px;color:#638692}.gender-labels small{margin-left:7px;letter-spacing:1.5px;font:8px var(--font);color:#ac9f70}.class-outfit{font-size:12px;color:#87928a;margin:12px 0 4px}.class-card .text-button{margin-top:7px}.classes-note{font-size:11px;color:#758f8c;text-align:center;margin-top:32px}.journal{padding:88px 0 80px}.sample-label{font-size:10px;color:#8e9273;border:1px solid #dddcc0;border-radius:20px;padding:4px 11px}.journal-grid{display:grid;grid-template-columns:1fr 1fr .82fr;gap:27px}.journal-card{text-align:left;display:block;padding:0;align-self:start}.journal-image{height:210px;position:relative;overflow:hidden;border:2px solid #dfcd97;border-radius:7px;background:#edf7f1}.journal-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.journal-card:hover .journal-image img{transform:scale(1.03)}.journal-image>span{position:absolute;left:14px;bottom:14px;font:8px var(--font);letter-spacing:1.1px;color:#4b7b82;background:#fffdf1ec;padding:7px 11px;border:1px solid #e1d3a0;border-radius:20px}.character-journal{background:radial-gradient(#c8ecfc,#fff9de)}.character-journal img{object-fit:contain}.journal-meta{display:flex;justify-content:space-between;align-items:center;margin-top:10px;color:#7d9ca1;font-size:11px}.journal-meta .rune-orb{width:32px;height:32px;min-width:32px;font-size:17px}.journal-card h3{font-size:20px;font-weight:600;line-height:1.6;margin-top:6px}.journal-card p{font-size:12px;color:#839292;margin-top:8px}.journal-note{padding:30px 25px;border:1px solid #d2c180;border-radius:7px;background:linear-gradient(145deg,#edfce9,#fff8da);position:relative;overflow:hidden}.note-rune{position:absolute;right:-5px;top:-18px;color:#d9db9980;font-size:138px;line-height:1}.journal-note .eyebrow{font-size:8px;position:relative;letter-spacing:1.4px}.journal-note h3{font-size:29px;font-weight:500;line-height:1.5;margin:21px 0 15px}.journal-note>p:not(.eyebrow){font-size:12px;color:#7a977a}.journal-note .text-button{margin-top:24px;min-width:100%;font-size:12px;padding:15px 20px}.faq{border-top:1px solid #e0debd;display:grid;grid-template-columns:.75fr 1.3fr;gap:75px;padding:60px 0 85px}.faq h2{font-size:30px;margin:12px 0}.faq>div>p:last-child{font-size:13px;color:#839d96}.faq-list details{border-bottom:1px solid #dce7d5}.faq-list summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 0;font-size:14px}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary .rune-orb{width:35px;height:35px;min-width:35px;font-size:20px}.faq-list details[open] summary span{transform:rotate(45deg)}.faq-list p{font-size:13px;line-height:1.95;color:#69848d;padding:0 40px 22px 0}.follow{background:radial-gradient(ellipse at 10% 60%,#d7f4be9c,transparent 60%),linear-gradient(110deg,#cdf3f8,#e0f1ff,#ede6ff);border-top:1px solid #c3ddd3;border-bottom:1px solid #d9d8b9;text-align:center;padding:69px 5% 55px;position:relative;overflow:hidden}.follow-decoration{position:absolute;right:6%;top:-115px;font-size:440px;color:#98c5c32e;line-height:1;pointer-events:none}.follow .eyebrow{color:#609cb4}.follow h2{font-size:39px;margin:17px 0 12px;color:#237895;position:relative}.follow>p:not(.eyebrow){font-size:14px;color:#7295a6}.follow .button{margin-top:25px;min-width:265px;min-height:74px}.follow small{display:block;font-size:11px;color:#71969e;margin-top:14px}footer{min-height:125px;padding:25px 5%;display:flex;align-items:center;gap:30px;font-size:10px;color:#819590;background:#fffdf2}.footer-brand img{width:153px;height:56px}footer>p{padding-left:25px;border-left:1px solid #d6d9b6}footer>span{margin-left:auto}.footer-divider{margin:0 8px;color:#b4a274}footer .back-top{width:42px;height:42px;min-width:42px;font-size:20px}dialog{padding:0;border:2px solid #d7be7c;border-radius:10px;background:#fffdf4;color:var(--ink);max-width:92vw;width:950px;max-height:91vh;box-shadow:0 20px 100px #05486566}dialog::backdrop{background:#174861b8;backdrop-filter:blur(10px)}.dialog-close{position:absolute;top:12px;right:12px;z-index:5;font-size:26px}.dialog-image{width:100%;max-height:70vh;object-fit:contain;background:#eaf2e7}.dialog-footer{padding:17px 25px;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:12px;color:#658797}.gallery-control{display:flex;align-items:center;gap:9px;flex-shrink:0;font-size:12px}.gallery-control button{width:43px;height:43px;min-width:43px;font-size:23px}.dialog-copy{padding:50px 38px 35px}.dialog-copy h2{font-size:28px;margin:13px 0 18px}.dialog-copy p{font-size:14px;line-height:1.95;color:#738b91}.dialog-copy .eyebrow{font-size:10px;color:#b1985a}.channel-example{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}.channel-example span{border:1px solid #dacda5;padding:8px 15px;font-size:12px;border-radius:20px;background:#f5faea}.draft-note{border-top:1px solid #dfdfc7;padding-top:17px;margin-top:20px;font-size:12px!important}.pair-dialog{width:1040px}.pair-dialog-head{padding:25px 68px 12px;text-align:center}.pair-dialog-head .eyebrow{font-size:9px;color:#b2945d}.pair-dialog-head h2{font:34px/1.3 var(--font);margin:8px 0 7px}.pair-dialog-head>p:last-child{font-size:12px;color:#719299}.pair-dialog-art{background:radial-gradient(ellipse at 50% 45%,var(--class-tint),#fffdf4 72%);padding:0 8% 8px}.pair-dialog-art>img{width:100%;height:52vh;object-fit:contain}.pair-dialog-art .gender-labels{margin:0}.pair-dialog-info{padding:16px 28px 10px;display:flex;gap:22px;align-items:center;justify-content:space-between}.pair-dialog-info>p{font-size:13px;line-height:1.8;color:#6c858f;max-width:620px}.pair-disclaimer{font-size:10px;text-align:center;padding:8px 25px 19px;color:#99a598}
@media(min-width:1600px){.hero{height:760px}.hero-copy{padding-top:145px}.hero h1{font-size:79px}}
@media(max-width:1150px){.site-header{padding:0 3%;gap:10px}.brand img{width:163px}.rune-link{padding:9px 19px;font-size:12px}.button-small{min-width:180px;font-size:11px;padding:14px 23px}.hero-copy{padding-top:125px}.hero h1{font-size:60px}.hero{height:660px}.hero-description{font-size:17px}.world-layout{gap:30px}.world-tabs{gap:3px}.world-tabs button{min-width:93px;padding:11px 17px;font-size:11px}.world-visual{height:360px}.class-card{padding:22px 20px}.pair-art-button{height:295px}.class-card-heading h3{font-size:23px}.class-index{font-size:32px}.journal-grid{gap:22px}.journal-note{padding:27px 20px}.journal-note h3{font-size:26px}.journal-card h3{font-size:18px}.class-jumps{gap:8px}.class-jumps a{font-size:13px;padding:12px 19px}.welcome-strip a{margin-left:20px}}
@media(max-width:900px){html{scroll-padding-top:95px}.site-header{height:80px;padding:0 5%;gap:12px}.brand img{width:170px;height:63px}.header-cta{margin-left:auto;min-width:190px}.menu-toggle{display:flex;flex-direction:column;gap:5px;order:3;width:44px;height:44px;min-width:44px}.menu-toggle span{height:2px;width:17px;background:#225769;box-shadow:0 1px #b8ffff}.site-header nav{display:none;position:absolute;left:0;right:0;top:80px;background:#fffdf4f9;padding:18px 5%;box-shadow:0 10px 20px #2d83861c;grid-template-columns:1fr 1fr;gap:10px;border-bottom:1px solid #ddc38b}.site-header nav.open{display:grid}.rune-link{min-height:50px;font-size:14px}.hero{height:650px}.hero-copy{padding-top:115px}.hero h1{font-size:56px}.hero-actions{gap:7px}.hero-actions .button{min-width:207px;font-size:13px;padding:17px 28px}.hero:before{background:linear-gradient(90deg,#e8faffea,#e8faff88 45%,transparent 82%)}.world-layout{grid-template-columns:1fr;gap:30px}.world-visual{height:390px}.world{padding:70px 0}.section-heading{display:block;margin-bottom:28px}.section-heading h2{font-size:32px}.section-intro{margin-top:18px;font-size:13px}.world-tabs{gap:9px}.world-tabs button{min-width:130px;font-size:13px}.world-copy #location-text{min-height:0;max-width:550px}.world-copy h3{font-size:29px}.class-grid{gap:20px}.class-card{padding:21px 16px 18px}.class-card-heading{gap:11px}.class-symbol{width:36px;height:36px;min-width:36px;font-size:21px}.class-card-heading h3{font-size:21px}.class-card-heading p{font-size:10px}.class-index{display:none}.pair-art-button{height:250px}.pair-orbit{width:205px;height:205px;top:18px}.class-jumps{grid-template-columns:repeat(3,1fr);gap:10px}.class-jumps a{font-size:16px}.classes-heading h2{font-size:35px}.heroes-inner{padding:60px 0 40px}.journal-grid{grid-template-columns:1fr 1fr;gap:30px 22px}.journal-note{grid-column:1/-1;padding:30px}.journal-note h3 br{display:none}.journal-note h3{margin:16px 0 10px}.journal-note .text-button{min-width:220px;max-width:250px;margin-top:17px}.sample-label{display:inline-block;margin-top:17px}.journal{padding:68px 0 62px}.faq{grid-template-columns:1fr;gap:20px;padding:45px 0 63px}.welcome-strip{flex-wrap:wrap;gap:12px;font-size:12px}.welcome-strip a{margin-left:15px;font-size:11px}.development{font-size:11px}.strip-line{margin:0 5px}.follow h2{font-size:33px}footer{gap:20px}footer>p{display:none}.pair-dialog-head h2{font-size:30px}}
@media(max-width:600px){.concept-bar{font-size:7px;letter-spacing:1px;padding:0 5%;height:27px}.concept-bar>span:last-child{font-size:8px}.bar-separator{margin:0 6px}.site-header{padding:0 4%;gap:6px;height:76px}.brand img{width:132px;height:55px}.header-cta{min-width:165px;min-height:51px;font-size:10px;padding:14px 18px;gap:3px}.header-cta span{font-size:13px}.menu-toggle{width:38px;height:38px;min-width:38px}.menu-toggle span{width:15px}.site-header nav{top:76px}.hero{height:660px}.hero-art{object-position:65% bottom}.hero:before{background:linear-gradient(180deg,#effbffe8,#e8faffb0 40%,#e8faff17 80%)}.hero-copy{text-align:center;width:94%;padding-top:46px}.hero .eyebrow{font-size:8px;letter-spacing:2px}.hero h1{font-size:49px;letter-spacing:-1px;line-height:1.28;margin:20px 0 13px}.hero-description{font-size:14px;line-height:1.9}.hero-actions{justify-content:center;margin-top:18px;gap:6px}.hero-actions .button{min-width:0;width:48%;max-width:210px;font-size:12px;min-height:60px;padding:16px 19px;gap:5px}.hero-actions .button span{font-size:13px}.hero-footnote{font-size:10px;margin:9px 0 0;color:#477c96}.scroll-cue{font-size:8px;letter-spacing:1.3px;left:18px;bottom:18px;gap:8px}.art-caption{font-size:8px;right:14px;bottom:16px;padding:3px 7px}.welcome-strip{padding:15px 5%;gap:10px;justify-content:center}.welcome-strip a{width:100%;text-align:center;margin:0}.strip-star{font-size:22px}.strip-line{margin:0;height:16px}.status-dot{width:5px;height:5px;margin-right:-5px}.development{font-size:10px}.welcome-strip>p:first-of-type{font-size:11px}.section-wrap{width:89%}.world{padding:55px 0 62px}.section-heading h2{font-size:28px}.section-heading .eyebrow{font-size:8px;letter-spacing:1.7px}.section-intro{font-size:12px;line-height:1.9}.section-intro br{display:none}.world-visual{height:278px}.image-bottom{left:15px;right:12px;bottom:13px;font-size:9px}.image-bottom .rune-orb{width:39px;height:39px;min-width:39px;font-size:22px}.world-tabs{gap:5px}.world-tabs button{min-width:0;flex:1;font-size:11px;padding:12px 16px;min-height:47px}.world-copy h3{font-size:27px}.world-copy #location-text{font-size:13px}.location-kicker{margin-top:24px}.text-button{min-height:56px;min-width:215px}.heroes-inner{padding:53px 0 36px}.classes-heading .eyebrow{font-size:8px;letter-spacing:1.8px}.classes-heading h2{font-size:30px;margin:14px 0}.classes-heading>p:not(.eyebrow){font-size:12px}.section-flourish{font-size:16px;margin-top:15px}.class-jumps{margin:20px 0 27px;gap:7px}.class-jumps a{min-height:45px;font-size:12px;padding:12px 14px}.class-grid{grid-template-columns:1fr;gap:24px}.class-card{padding:22px 17px 19px}.class-card-heading{padding:0 4px 14px;gap:16px}.class-card-heading p{font-size:11px}.class-card-heading h3{font-size:26px}.class-symbol{width:41px;height:41px;min-width:41px;font-size:24px}.class-index{display:block;font-size:33px}.pair-art-button{height:270px;margin-top:12px}.pair-orbit{width:230px;height:230px;top:19px}.pair-zoom{width:34px;height:34px;min-width:34px;font-size:18px}.gender-labels{font-size:12px;margin:0 0 10px;gap:10px}.gender-labels small{font-size:7px;margin-left:5px}.class-outfit{font-size:11px}.class-card .text-button{min-height:54px;font-size:12px;min-width:205px}.classes-note{font-size:9px;max-width:290px;margin:25px auto 0}.journal{padding:57px 0 50px}.journal-grid{grid-template-columns:1fr;gap:30px}.journal-image{height:225px}.journal-card h3{font-size:21px}.journal-card p{font-size:13px}.journal-meta{font-size:11px}.journal-note{padding:28px}.journal-note h3{font-size:29px}.journal-note p{font-size:13px!important}.journal-note .eyebrow{font-size:8px!important}.faq{padding:42px 0 55px;gap:16px}.faq h2{font-size:28px}.faq-list summary{font-size:12px;gap:14px}.faq-list summary .rune-orb{width:32px;height:32px;min-width:32px;font-size:19px}.faq-list p{font-size:12px;padding-right:15px}.follow{padding:52px 5% 45px}.follow .eyebrow{font-size:9px;letter-spacing:1.6px}.follow h2{font-size:27px}.follow>p:not(.eyebrow){font-size:12px}.follow .button{min-width:252px;font-size:14px;min-height:70px}.follow-decoration{right:-85px;top:-30px;font-size:330px}footer{padding:22px 5%;gap:15px;flex-wrap:wrap}.footer-brand img{width:138px;height:52px}footer>span{order:3;margin:0;width:100%;font-size:9px}footer .back-top{margin-left:auto;width:38px;height:38px;min-width:38px}.dialog-copy{padding:55px 25px 28px}.dialog-copy h2{font-size:25px}.dialog-copy p{font-size:13px}.dialog-close{width:40px;height:40px;min-width:40px;font-size:23px;top:9px;right:9px}.dialog-footer{padding:15px;font-size:10px;gap:10px}.gallery-control{gap:6px}.gallery-control button{width:38px;height:38px;min-width:38px}.pair-dialog-head{padding:47px 20px 15px}.pair-dialog-head .eyebrow{font-size:7px;letter-spacing:1.2px}.pair-dialog-head h2{font-size:29px}.pair-dialog-art{padding:0 4%}.pair-dialog-art>img{height:34vh;min-height:210px}.pair-dialog-info{display:block;padding:18px 23px 10px}.pair-dialog-info>p{font-size:12px;text-align:center}.pair-dialog-info .gallery-control{justify-content:center;margin-top:15px;gap:15px}.pair-disclaimer{font-size:9px;padding:8px 20px 18px}.pair-dialog-art .gender-labels{font-size:11px}}
@media(max-width:370px){.brand img{width:112px}.header-cta{min-width:150px;font-size:9px}.site-header{gap:3px}.hero h1{font-size:43px}.hero-actions .button{font-size:10px;padding:16px 17px}.class-card-heading h3{font-size:23px}.class-symbol{width:36px;height:36px;min-width:36px}.class-card-heading{gap:12px}.pair-art-button{height:236px}.class-jumps a{font-size:11px}.concept-bar{letter-spacing:.3px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* V2 class tiers: keep the existing bright theme and generated rune controls. */
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.class-section-inner{position:relative;z-index:1;padding:77px 0 55px}.class-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;text-align:left}.class-section-heading h2{font-size:40px;margin:15px 0}.class-section-heading .heroes-intro{font-size:14px;line-height:1.9;color:#668590}.class-count{text-align:right;flex-shrink:0;padding-bottom:4px}.class-count strong{display:block;font-size:16px;font-weight:500;color:#4b7280}.class-count strong span{color:#b5995e;margin:0 4px}.class-count>span{display:block;font-size:11px;color:#729097;margin-top:8px}.tier-toolbar{display:flex;justify-content:space-between;align-items:center;gap:25px;border-top:1px solid #bdcfc5;border-bottom:1px solid #bdcfc5;padding:18px 0;margin:31px 0 29px}.tier-toolbar>p{font-size:13px;color:#69818c}.tier-tabs{display:flex;gap:9px}.tier-tabs button{display:flex;align-items:center;justify-content:center;gap:9px;min-width:160px;min-height:67px;padding:13px 22px;background:var(--rune-pearl) center/100% 165% no-repeat;border:0;color:#456573;text-shadow:0 1px #fff9;transition:filter .2s,transform .2s}.tier-tabs button:hover{filter:brightness(1.06);transform:translateY(-2px)}.tier-tabs button.selected{background-image:var(--rune-primary);background-size:100% 125%;color:#fffcec;text-shadow:0 1px 3px #154759;filter:drop-shadow(0 3px 8px #3ca6b23d)}.tier-tabs button>span:last-child{font-size:14px;font-weight:600;line-height:1.35;text-align:left}.tier-tabs button small{display:block;font-size:10px;font-weight:400;margin-top:3px}.tier-rune{font:22px var(--font)}.class-section .class-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.class-section .class-card{padding:25px 25px 16px;text-align:left}.class-section .class-card-heading{display:flex;align-items:center;gap:15px;padding:0 2px 17px;border:0}.class-emblem{display:grid;place-items:center;flex-shrink:0;width:46px;height:46px;border:1px solid #cfb778;border-radius:50%;background:linear-gradient(135deg,#e5f8ff,#fff8d9);font:27px var(--font);color:#5298a8}.class-section .class-card-heading .class-card-index{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:1px;color:#82a0a6}.class-card-index span{padding-left:11px;border-left:1px solid #c4d5d2;color:#a18a4b}.class-section .class-card-heading h3{font-family:var(--font);font-size:27px;font-weight:500;color:#315b70;line-height:1.4;margin:5px 0 2px}.class-section .class-card-heading .class-english{font:14px/1.5 var(--font);color:#7395a2}.class-progression{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:0;margin:0;border:1px solid #cec9ad;border-radius:4px;overflow:hidden}.class-progression li{min-width:0;padding:10px 5px 12px;text-align:center;background:#f1f8f5;color:#758f95;border-right:1px solid #d2d7c6}.class-progression li:last-child{border-right:0}.class-progression li.current{background:linear-gradient(135deg,#d9f3ed,#f5efd3);color:#225f77;box-shadow:inset 0 -3px #c6aa62}.step-label{display:block;font-size:10px;color:#93a6a4;margin-bottom:5px}.class-progression li.current .step-label{color:#a18945}.class-progression strong{display:block;font-size:12px;font-weight:500;line-height:1.5;overflow-wrap:anywhere}.step-name{display:block;font:11px/1.45 var(--font);color:#8b9d9f;margin-top:4px;overflow-wrap:anywhere}.class-progression li.current .step-name{color:#507889}.class-image-button{display:block;width:100%;padding:0;text-align:left;background:none;border:0}.class-image-frame{position:relative;display:block;aspect-ratio:3/2;margin-top:17px;background:radial-gradient(ellipse at center,#e5f5fa,#fafffd00 70%)}.class-pair{width:100%;height:100%;object-fit:contain}.class-pair[hidden],.pair-pending[hidden]{display:none!important}.class-expand{position:absolute;right:0;top:8px}.pair-labels{display:grid;grid-template-columns:1fr 1fr;text-align:center;font-size:11px;color:#6b8f9b;letter-spacing:1.2px;padding:0 15px 13px}.class-card-action{display:flex;align-items:center;justify-content:center;gap:18px;margin:0 auto;min-height:53px;width:225px;max-width:100%;padding:14px 25px;background:var(--rune-pearl) center/100% 165% no-repeat;color:#3d6c7e;font-size:12px}.class-card-action>span{font-size:18px}.class-image-button:hover .class-card-action{filter:brightness(1.07)}.class-source-note{display:flex;justify-content:space-between;gap:12px;margin-top:26px;font-size:10px;color:#739297;line-height:1.8}.pair-pending{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px;text-align:center;color:#4e7a89;font-size:13px}.pair-pending small{font-size:11px;color:#82999c}.image-pending{background:radial-gradient(ellipse at center,#e4f5fa,#f9fcf6)}#class-panel:focus-visible,#modal-class-panel:focus-visible{outline:3px solid #50b5cf;outline-offset:7px}
.is-class-dialog{width:960px;max-width:94vw;background:linear-gradient(145deg,#f5fcff,#fffdef);border-color:#c6b273;color:#375d6d}.class-dialog-header{padding:34px 70px 20px 34px}.class-dialog-header .eyebrow{font-family:var(--font);font-size:10px;letter-spacing:1px;color:#a18c58}.class-dialog-header h2{font-size:28px;line-height:1.4;margin:9px 0}.class-dialog-header h2 span{font:21px/1.4 var(--font);color:#6d94a5;margin-left:10px;white-space:nowrap}.class-dialog-header>p:last-child{font-size:12px;color:#8a9f9c}.modal-tier-tabs{padding:0 27px 18px}.modal-tier-tabs button{min-width:145px;min-height:54px;padding:12px 24px}.modal-tier-tabs button>span:last-child{font-size:12px}.modal-tier-tabs .tier-rune{font-size:20px}.modal-progression{max-width:680px;padding:0 25px;margin:0 auto}.modal-progression .class-progression strong{font-size:13px}.class-modal-image{position:relative;width:100%;aspect-ratio:3/2;max-height:56vh;background:radial-gradient(ellipse at center,#e6f3ff9c,#f8ffff00 70%)}.modal-pair-labels{font-size:12px;max-width:850px;margin:0 auto;padding-bottom:24px}.class-dialog-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid #d5decc;padding:15px 23px}.class-dialog-footer button{display:flex;align-items:center;justify-content:center;gap:4px;width:165px;min-width:0;height:56px;min-height:56px;padding:12px 20px;border:0;border-radius:0;background:var(--rune-pearl) center/100% 165% no-repeat;color:#3a6b80;font-size:18px;white-space:nowrap}.class-dialog-footer button span{font-size:12px;margin:0 5px}.class-dialog-footer p{font-size:10px;color:#8a9f9e;text-align:center}
@media(max-width:1050px){.class-section-heading{display:block;text-align:center}.class-section-heading h2{font-size:36px}.class-count{text-align:center;padding:0;margin-top:22px}.class-count strong{font-size:15px}.tier-tabs button{min-width:145px}.class-section .class-grid{gap:24px}.class-section .class-card{padding:23px 19px 15px}.class-section .class-card-heading h3{font-size:25px}.class-progression strong{font-size:11px}.step-name{font-size:10px}.class-source-note{display:block;text-align:center}.class-source-note p+p{margin-top:4px}}
@media(max-width:800px){.class-section-inner{padding:60px 0 42px}.class-section-heading h2{font-size:32px}.class-section-heading .heroes-intro{font-size:13px}.tier-toolbar{display:block;margin-top:25px;padding:15px 0}.tier-toolbar>p{text-align:center;margin-bottom:9px;font-size:12px}.tier-tabs{justify-content:center;gap:8px}.tier-tabs button{flex:1;min-width:0;max-width:170px;min-height:64px;padding:12px 18px;gap:7px}.tier-tabs button>span:last-child{font-size:13px}.tier-tabs button small{font-size:9px}.class-section .class-grid{gap:20px}.class-section .class-card{padding:22px 15px 15px}.class-section .class-card-heading{gap:11px}.class-section .class-card-heading h3{font-size:22px}.class-emblem{width:36px;height:36px;font-size:22px}.class-section .class-card-heading .class-english{font-size:12px}.class-progression strong{font-size:10px}.step-name{font-size:9px}.class-dialog-header{padding:30px 67px 17px 25px}.class-dialog-header h2{font-size:25px}.class-dialog-header h2 span{display:block;font-size:18px;margin:4px 0 0}.modal-tier-tabs{padding:0 21px 18px}.modal-tier-tabs button{flex:0 1 145px;min-height:56px}.class-modal-image{max-height:none}.class-dialog-footer{padding:13px 17px;gap:7px}.class-dialog-footer button{width:145px;min-height:52px;height:52px;padding:12px 18px}.class-dialog-footer button span{font-size:11px;margin:0 3px}.class-dialog-footer p{font-size:9px;max-width:140px}}
@media(max-width:600px){.class-section-inner{padding:52px 0 38px}.class-section-heading h2{font-size:29px;line-height:1.5}.class-section-heading .heroes-intro{font-size:12px}.class-count strong{font-size:14px}.class-count>span{font-size:10px}.tier-tabs{gap:0}.tier-tabs button{padding:11px 14px;gap:5px;min-height:61px}.tier-tabs button>span:last-child{font-size:12px}.tier-tabs button small{font-size:8px}.tier-rune{font-size:18px}.class-section .class-grid{grid-template-columns:1fr;gap:24px}.class-section .class-card{padding:22px 19px 16px}.class-section .class-card-heading{gap:15px}.class-section .class-card-heading h3{font-size:27px}.class-emblem{width:43px;height:43px;font-size:26px}.class-section .class-card-heading .class-english{font-size:14px}.class-progression strong{font-size:12px}.step-label{font-size:10px}.step-name{font-size:11px}.class-card-action{font-size:12px}.pair-labels{font-size:11px}.class-source-note{font-size:9px}.class-dialog-header{padding:29px 60px 16px 20px}.class-dialog-header h2{font-size:24px}.class-dialog-header h2 span{font-size:17px}.class-dialog-header>p:last-child{font-size:11px}.modal-tier-tabs{padding:0 12px 15px;gap:0}.modal-tier-tabs button{flex:1;min-width:0;min-height:56px;gap:5px;padding:12px 16px}.modal-tier-tabs button>span:last-child{font-size:11px}.modal-tier-tabs .tier-rune{font-size:17px}.modal-progression{padding:0 15px}.modal-progression .class-progression strong{font-size:11px}.modal-progression .step-name{font-size:10px}.modal-pair-labels{font-size:11px;padding-bottom:18px}.class-dialog-footer{flex-wrap:wrap;padding:12px 10px;gap:0}.class-dialog-footer button{width:150px;max-width:48%;font-size:17px;min-height:55px;height:55px;padding:12px 17px}.class-dialog-footer button span{font-size:11px;margin:0 3px}.class-dialog-footer p{order:3;max-width:none;width:100%;font-size:9px;margin-top:8px}.class-dialog-footer button:last-child{margin-left:auto}}
body.admin-bar .site-header{top:32px}@media(max-width:782px){body.admin-bar .site-header{top:46px}}

/* Shared Sarabun typography, 2026-10-13. */
body{font-size:16px;line-height:1.8}
input,select,textarea,button{font-family:var(--font)}
h1,h2,h3,h4,h5,h6{font-family:var(--font);letter-spacing:0;font-weight:600}
.hero h1{letter-spacing:0;font-weight:700}
.class-section .class-card-heading h3{font-weight:600}
.rune-link,.world-tabs button{font-size:14px}
.hero-footnote,.art-caption,.classes-note,.class-source-note,.class-count>span,.class-section .class-card-heading .class-card-index,.class-dialog-header>p:last-child,.class-dialog-footer p,.pair-disclaimer,.draft-note,.sample-label,.journal-note>p:not(.eyebrow),footer,footer>span{font-size:12px;line-height:1.8}
.class-progression strong{font-size:13px;line-height:1.6}
.step-name,.step-label,.pair-labels,.class-outfit,.class-section .class-card-heading .class-english,.class-card-action{font-size:13px;line-height:1.6;letter-spacing:0}
.hero-description{line-height:1.85}
.section-intro,.world-copy #location-text,.classes-heading>p:not(.eyebrow),.class-section-heading .heroes-intro,.journal-card p,.faq-list p,.follow>p:not(.eyebrow){font-size:16px;line-height:1.85}
.faq-list summary{font-size:16px;line-height:1.7}
body.single-post main.section-wrap>article>h1{margin-inline:auto;line-height:1.45;font-weight:700;letter-spacing:0}
.rune-guide{font-family:var(--font);font-size:18px;line-height:1.9;letter-spacing:0;text-align:left}
.rune-guide h2,.rune-guide h3{font-weight:600;letter-spacing:0}
.rune-guide h2{line-height:1.5}.rune-guide h3{line-height:1.6}
.rune-guide p{margin-bottom:1.25em}
.rune-guide-breadcrumbs,.rune-guide-byline,.rune-guide-figure figcaption,.rune-guide-credit{font-size:14px!important;line-height:1.8}
.rune-guide-toc li{font-size:16px;line-height:1.8}
.rune-knowledge-card h3{font-weight:600;line-height:1.55}
.rune-knowledge-card p{font-size:16px;line-height:1.8}
@media(max-width:600px){
 body{font-size:16px}
 .hero h1{font-size:46px;line-height:1.35;letter-spacing:0}
 .hero-description{font-size:16px}
 .hero-actions .button{font-size:13px}
 .rune-link{font-size:14px}
 .world-tabs button{font-size:12px}
 .section-intro,.world-copy #location-text,.class-section-heading .heroes-intro,.journal-card p,.faq-list p,.follow>p:not(.eyebrow){font-size:15px}
 .faq-list summary{font-size:15px}
 .class-progression strong,.step-name,.step-label{font-size:12px}
 .class-source-note,.classes-note,.art-caption,.hero-footnote,.class-count>span,.class-dialog-footer p,.pair-disclaimer,footer>span{font-size:12px}
 .rune-guide{font-size:17px;line-height:1.9}
 .rune-guide-toc li{font-size:16px}
 .rune-knowledge-card p{font-size:15px}
}
@media(max-width:370px){.hero h1{font-size:40px}.hero-actions .button{font-size:12px}.class-progression strong{font-size:11px}}

/* Text legibility only: preserve the original rune artwork, borders and button shapes. */
body{color:#173e52}
main h1,main h2,main h3,dialog h2,dialog h3{color:#173e52}
main p,main li,main time,main figcaption,footer p,footer span,.section-intro,.world-copy #location-text,.heroes-intro,.class-count>span,.class-card-index,.class-card-index span,.class-english,.step-label,.step-name,.pair-labels,.class-source-note,.journal-meta,.faq-list p,.follow small,.dialog-footer,.class-dialog-footer p,.pair-disclaimer,.rune-knowledge-card p,.rune-knowledge-card time,.rune-guide-byline,.rune-guide-breadcrumbs,.rune-guide-figure figcaption,.rune-guide-credit{color:#344f5c!important}
main .eyebrow,dialog .eyebrow,.location-kicker{color:#6e4c16!important}
.class-progression strong,.class-count strong,.class-count strong span,.location-index,.location-index span,.location-tags span{color:#344f5c!important}
.hero-copy{padding-top:70px}.hero-reading-panel{max-width:620px;width:fit-content;padding:30px 32px;background:#fffdf4;border:1px solid #bca36c;border-radius:14px;box-shadow:0 12px 35px #143e522b}
.hero h1{font-size:64px;line-height:1.25;text-shadow:none;margin:15px 0}.hero h1 span{color:#006477}.hero-description{color:#173e52!important;text-shadow:none}.hero-footnote{margin-left:0;font-size:13px!important}
.rune-link,.class-jumps a,.world-tabs button,.tier-tabs button,.class-card-action,.class-dialog-footer button,.button-light,.text-button,.rune-orb{color:#173e52!important;font-weight:700;text-shadow:0 1px 1px #fff,1px 0 1px #fff,-1px 0 1px #fff,0 -1px 1px #fff}
.button:not(.button-light),.world-tabs button.active,.tier-tabs button.selected{color:#fff!important;font-weight:700;text-shadow:0 1px 2px #003344,1px 0 1px #003344,-1px 0 1px #003344,0 -1px 1px #003344}
.button:not(.button-light) span,.tier-tabs button.selected span,.tier-tabs button.selected small{color:#fff!important}
.image-bottom{background:#102f40;border-radius:7px;padding:10px 12px;gap:15px}.image-bottom #world-image-label{color:#fff!important;font-size:13px}
.scroll-cue{background:#fffdf4;color:#173e52;border:1px solid #bca36c;border-radius:6px;padding:7px 12px;font-size:12px;letter-spacing:1px}
.journal-image>span{background:#fffdf4;color:#173e52!important}.dialog-copy p,.class-dialog-header>p:last-child,.class-dialog-header h2 span,.dialog-footer,.class-dialog-footer p{color:#344f5c!important}
@media(min-width:1600px){.hero-copy{padding-top:85px}.hero h1{font-size:70px}}
@media(max-width:1150px){.hero h1{font-size:56px}.hero-reading-panel{max-width:570px}}
@media(max-width:900px){.hero-copy{padding-top:60px}.hero-reading-panel{max-width:540px}.hero h1{font-size:52px}}
@media(max-width:600px){.hero-copy{padding-top:28px;width:92%}.hero-reading-panel{width:100%;padding:22px 16px;margin-inline:auto;border-radius:12px}.hero h1{font-size:42px;line-height:1.3}.hero-description{font-size:16px}.hero-footnote{font-size:12px!important}.hero-actions{gap:8px;flex-wrap:wrap}.hero-actions .button{width:100%;max-width:none;min-height:60px;padding:16px 24px;font-size:14px}.hero{height:720px}.scroll-cue{left:4%;bottom:18px;font-size:10px;padding:7px 9px}.image-bottom{left:10px;right:10px;bottom:10px;padding:8px 10px}.image-bottom #world-image-label{font-size:12px}}
@media(max-width:370px){.hero h1{font-size:38px}.hero-reading-panel{padding:20px 13px}}

@media(max-width:370px){.site-header{padding-inline:3%;gap:4px}.site-header .brand img{width:100px}.site-header .header-cta{min-width:140px}}
