/* Shared by the in-game introduction and the public /about/ page. */
article.about-content{color:#d9e2f0;font-family:Pretendard,'Malgun Gothic',sans-serif;font-size:15px;line-height:1.85;word-break:keep-all;overflow-wrap:anywhere}
article.about-content *{box-sizing:border-box}
article.about-content>section{margin:0;padding:38px 0;border-bottom:1px solid #ffffff19}
article.about-content>section:first-child{padding-top:0}
article.about-content>section:last-child{padding-bottom:4px;border-bottom:0}
article.about-content h1,article.about-content h2,article.about-content h3{color:#f5f2eb;letter-spacing:-.035em;word-break:keep-all}
article.about-content .about-hero h1{font-size:clamp(29px,4vw,43px);line-height:1.4;margin:18px 0 26px;text-wrap:balance}
article.about-content .about-hero h1 em{color:#efc58e;font-style:normal}
article.about-content h2{font-size:27px;line-height:1.5;margin:11px 0 21px;text-wrap:balance}
article.about-content h3{font-size:16px;line-height:1.65;margin:16px 0 8px}
article.about-content p{margin:0 0 15px;color:#bdcadd;font-size:15px;line-height:1.9}
article.about-content .about-question{color:#e8edf5;font-size:17px;max-width:570px;margin-bottom:14px}
.about-eyebrow,.about-section-index{display:flex;align-items:center;gap:9px;color:#d8b986;font-size:12px;letter-spacing:.04em;font-weight:600;line-height:1.8}
.about-eyebrow i{width:6px;height:6px;background:#efc58e;box-shadow:0 0 12px #efc58e65;border-radius:50%;flex:none}
.about-world{position:relative;margin-top:27px;height:245px;border:1px solid #465166;border-radius:12px;overflow:hidden;background:#162333}
.about-world>img{width:100%;height:100%;object-fit:cover;object-position:50% 53%;display:block}
.about-world::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#101621bb,transparent 75%);pointer-events:none}
.about-world-caption{position:absolute;z-index:1;left:20px;bottom:33px;display:flex;align-items:center;gap:13px;padding:13px 17px;background:#fff8ebf5;border:1px solid #e1cbaa;border-radius:9px;color:#354253;max-width:calc(100% - 40px);font-size:13px;line-height:1.7;box-shadow:0 7px 28px #0003}
.about-world-caption .pixel-person{width:36px;height:40px;flex:none}
.about-world-caption strong{font-weight:700;color:#27374b}
.about-world-label{position:absolute;z-index:1;right:14px;bottom:8px;color:#e6e7e5;font-size:10px;text-shadow:0 1px 5px #000}
article.about-content .about-scale{display:flex;flex-wrap:wrap;gap:6px 20px;margin:0 0 24px;font-size:13px;color:#b7c4d8}
.about-scale>span{white-space:nowrap}
.about-scale strong{font-size:20px;color:#efc58e;font-weight:700;margin-right:3px}
.about-experience-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-bottom:20px}
.about-experience-grid>article{padding:20px 17px;background:#1c2a40;border:1px solid #3a4a62;border-radius:10px}
.about-experience-grid>article>svg{color:#e4bd8c}
.about-experience-grid p{font-size:13px;margin:0;color:#c0ccdc}
article.about-content .about-note{font-size:12px;line-height:1.9;color:#98abc5;margin:0}
article.about-content .about-maker{display:grid;grid-template-columns:.9fr 1.2fr;gap:26px;background:linear-gradient(100deg,#d4ad7210,transparent);padding:32px 25px;margin-top:34px;border:1px solid #d4ad7240;border-radius:11px}
article.about-content .about-maker h2{font-size:23px;margin:12px 0 0}
.about-maker p{font-size:14px}
article.about-content a{color:#e9c89c;text-decoration:none}
article.about-content a:hover{text-decoration:underline;text-underline-offset:4px}
article.about-content .about-contact{display:inline-flex;align-items:center;gap:5px;font-size:13px;word-break:break-word;min-height:34px}
.about-promise dl{margin:0}
.about-promise dl>div{display:grid;grid-template-columns:205px 1fr;gap:12px;padding:17px 0;border-bottom:1px solid #ffffff13}
.about-promise dt{font-size:14px;font-weight:650;color:#e3eaf3}
.about-promise dd{font-size:14px;line-height:1.85;margin:0;color:#bac8dc}
.about-detail-links{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:21px}
.about-detail-links a{display:inline-flex;align-items:center;gap:5px;min-height:40px;font-size:12px}
article.about-content .about-next{text-align:center;padding-top:36px}
.about-next .about-section-index{justify-content:center}
.about-next h2{font-size:26px;margin-bottom:14px}
.about-next p{font-size:14px}
.about-actions{display:flex;justify-content:center;align-items:center;gap:10px 23px;flex-wrap:wrap;margin-top:23px}
article.about-content .about-button{display:inline-flex;justify-content:center;align-items:center;gap:14px;min-height:47px;padding:11px 18px;background:#e9bc84;border:1px solid #f3cd9d;border-radius:7px;color:#1b293b;font-size:14px;font-weight:700;font-family:inherit;line-height:1.6;cursor:pointer;text-decoration:none}
article.about-content .about-button:hover{background:#f4d0a2;text-decoration:none}
.about-feedback-link{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:13px}
article.about-content a:focus-visible,article.about-content button:focus-visible{outline:3px solid #70aaff;outline-offset:4px}
@media(max-width:650px){
 article.about-content>section{padding:29px 0}
 article.about-content .about-hero h1{font-size:30px;line-height:1.45;margin:16px 0 22px}
 article.about-content h2{font-size:24px;margin-bottom:19px}
 article.about-content p{font-size:14px}
 article.about-content .about-question{font-size:15px}
 .about-world{height:220px;margin-top:23px}
 .about-world-caption{left:13px;bottom:31px;padding:11px 12px;gap:9px;max-width:calc(100% - 26px);font-size:12px}
 .about-world-caption .pixel-person{width:29px;height:34px}
 .about-experience-grid{grid-template-columns:1fr;gap:11px}
 .about-experience-grid>article{padding:18px 19px;display:grid;grid-template-columns:24px 1fr;column-gap:12px}
 .about-experience-grid>article>svg{margin-top:2px}
 .about-experience-grid h3{margin:0 0 7px;font-size:15px}
 .about-experience-grid p{grid-column:2;font-size:13px}
 article.about-content .about-maker{grid-template-columns:1fr;gap:16px;padding:24px 20px;margin-top:28px}
 article.about-content .about-maker h2{font-size:23px;margin-top:10px}
 .about-promise dl>div{grid-template-columns:1fr;gap:5px;padding:16px 0}
 .about-promise dd{font-size:13px}
 article.about-content .about-next h2{font-size:23px}
}
@media(max-width:360px){
 article.about-content .about-hero h1{font-size:26px}
 article.about-content h2{font-size:22px}
 article.about-content .about-scale{gap:4px 12px;font-size:12px}
 .about-scale strong{font-size:18px}
 article.about-content .about-contact{font-size:12px}
 .about-world-caption{font-size:11px;padding:10px;gap:7px}
 .about-world-caption .pixel-person{width:25px;height:30px}
 .about-actions{flex-direction:column;gap:9px}
 article.about-content .about-button{width:100%;font-size:13px}
}