/* Original Dilmun crest: silver, charcoal, vermilion and aged gold. */
:root{--ink:#394044;--muted:#85817b;--line:#dedbd5;--red:#a5483c;--gold:#a58b58;--paper:#f7f6f3}
body{color:var(--ink);background:var(--paper)}
.topline{background:#eceae6;color:#77736e;border-bottom:1px solid #dedbd5}
header{min-height:177px;padding:8px 0;background:#fff}
body:before{content:'';position:absolute;top:37px;left:0;right:0;height:177px;background:#fff;z-index:-1}
.brand{display:flex;color:var(--ink);line-height:1}
.brand-logo{display:block;width:230px;height:161px;object-fit:contain}
nav{gap:30px;color:#53575a}
nav a:hover,nav a.active{color:var(--red);border-color:var(--red)}
.hero{background:#ede9e2;border:1px solid #d7d1c6;border-radius:2px;box-shadow:inset 0 0 0 4px #ffffff70}
.hero-copy{border-top:3px solid #a5483c}
.hero h1{color:#414548}
.hero p{color:#81766b}
.hero-art{background-image:linear-gradient(90deg,#ede9e2 0%,transparent 28%),url('/assets/hero-community.png')}
.eyebrow{color:#a3814d}
.button{background:#a5483c;border-color:#923e34;color:#fff;border-radius:2px}
.button:hover{background:#863a31}
.button.secondary{background:#fff;color:#646363;border-color:#d5d1ca}
.button.secondary:hover{background:#f1eeea}
.button.danger{background:#fff8f6;color:#a5483c;border-color:#d9b9af}
.stats,.panel,.table-wrap,.article{border-color:var(--line);border-radius:2px}
.stat{border-color:#e9e5df}.stat strong{color:#9c7843}.stat span{color:#89837c}
.panel-heading h2,.section-title h2,.aside-note h3{color:#4c4f51}
.post-row,.mini-rank{border-color:#ece9e4}
.post-row:hover .post-title,.plain-link:hover{color:var(--red)}
.more,.date,.note,.sub,.count,.page-head p,.breadcrumb{color:var(--muted)}
.tag{background:#f3e7e2;color:#a35443;border-radius:2px}
.tag.update{background:#eee9dc;color:#91784a}
.guide{background:linear-gradient(120deg,#f7f6f4,#e5e6e4);border-color:#d9d9d3;border-radius:2px}
.guide.sand{background:linear-gradient(120deg,#f8f3ed,#eee1d5);border-color:#dfd0c1}
.guide h3{color:#4b5052}.guide p{color:#8b8175}.guide .arrow{color:#a5814f}
.mini-rank b{color:#a17b42}.mini-rank small{color:#8c8276}
.aside-note{background:#ede8df;border:1px solid #ded5c8;border-radius:2px}.aside-note p{color:#8c7f70}
.page-head{border-color:#dcd7cf}.page-head h1{color:#4a4e50}
.toolbar input,.toolbar select,.field{border-color:#d8d3cb;color:#505354;border-radius:2px}
input:focus,select:focus,textarea:focus{border-color:#a97d61}
.tab{border-color:#d9d3ca;color:#82786b;border-radius:2px}
.tab.active{background:#a5483c;border-color:#923e34;color:#fff}
th{background:linear-gradient(#f1f0ec,#e8e7e2);color:#77766f;border-bottom:1px solid #d4d2ca}
td{border-color:#eeebe5}tbody tr:hover{background:#fcf9f5}
.item-icon{background:#efefeb;border-color:#d8d9d1;border-radius:2px}
.item-name{color:#525a5c}.options{color:#646461}
.pager button{border-color:#d8d1c6;color:#877450}.pager span{color:#8c8276}
.empty{color:#91867a}.empty strong{color:#81715b}
.map-card{background:linear-gradient(125deg,#fff,#eeeae3);border-color:#dbd5cb;border-radius:2px}
.map-card:hover{border-color:#b29263}.map-card h2{color:#555b5c}.map-card p{color:#918577}.map-card .map-number{color:#a68a60}
.drop{background:#f0ece4;color:#716655}.drop:hover{background:#eae0d2}
details summary{color:#9a6448}
.article-body{border-color:#e6e0d7}.admin-form label{color:#7d6e5d}
.rank-num{color:#a67d42}.rank-top{background:#f9f5ec}
footer{background:#e8e7e3;border-top:2px solid #b6a17b;color:#8c8880}
.footer-brand{color:#6a7274;text-shadow:0 1px #fff}
#toast{background:#8e493d;border:1px solid #ac7464}
@media(max-width:850px){header{gap:8px;padding:10px 0 20px}.brand-logo{width:200px;height:140px}body:before{height:227px}nav{gap:23px}}
@media(max-width:560px){nav{gap:15px}.hero-art{background-image:linear-gradient(180deg,#ede9e2 0%,transparent 30%),url('/assets/hero-community.png')}.stat{border-color:#e9e5df}}

/* Keep the established text sizes; the shared UI family supplies real regular/bold faces. */
body{font-size:18px;line-height:1.75;font-weight:400}
.topline{font-size:14px}
nav{font-size:18px}
.hero h1{font-size:42px}.hero p{font-size:18px}
.eyebrow,.breadcrumb{font-size:14px}
.button,.tab{font-size:17px}
.stat strong{font-size:30px}.stat span{font-size:16px}
.panel-heading h2{font-size:23px}.section-title h2{font-size:25px}
.post-title{font-size:18px}.date,.tag{font-size:14px}
.more,.note,.count,.section-title p{font-size:16px}
.guide h3{font-size:24px}.guide p{font-size:17px;max-width:240px}
.guide{min-height:200px}
.mini-rank b{font-size:26px}.mini-rank span{font-size:18px}.mini-rank small{font-size:16px}
.aside-note h3{font-size:22px}.aside-note p{font-size:17px}
.page-head h1{font-size:36px}.page-head p{font-size:18px}
.toolbar input,.toolbar select,.field{font-size:18px}
table{min-width:780px}th{font-size:16px}td{font-size:18px;line-height:1.8}
.item-cell{min-width:190px}.item-name{font-size:19px}
.item-icon{width:54px;height:60px;flex-shrink:0}
.sub{font-size:15px;line-height:1.8;color:#77736e}
.options{min-width:230px;line-height:1.9}
.pager button,.pager span{font-size:17px}
.empty{font-size:18px}.empty strong{font-size:24px}
.map-card h2{font-size:25px}.map-card p{font-size:17px}.map-card .map-number{font-size:14px}
details summary{font-size:17px}.drop{font-size:16px}.drop .sub{font-size:14px}
.article h1{font-size:32px}.article-body{font-size:19px;line-height:2}
.admin-form label{font-size:17px}
.rank-num{font-size:29px}
footer{font-size:14px}.credits{font-size:13px}
@media(max-width:850px){nav{font-size:17px;gap:20px}.hero h1{font-size:35px}.stat strong{font-size:27px}.home-grid aside{grid-template-columns:1fr}}
@media(max-width:560px){nav{font-size:16px;gap:8px;flex-wrap:wrap;justify-content:center}.topline{font-size:12px}.hero h1{font-size:33px}.page-head h1{font-size:30px}.date{font-size:14px}.post-row{flex-wrap:wrap}.post-title{white-space:normal;min-width:160px}.stat span{font-size:15px}}

.hero-art{background-position:center center;background-size:cover}

.monster-cell{display:flex;align-items:center;gap:18px;min-width:240px}.monster-image{width:110px;height:110px;object-fit:contain;flex-shrink:0;background:#f7f6f3;border:1px solid #e6e0d7;border-radius:3px}
@media(max-width:560px){.monster-image{width:88px;height:88px}.monster-cell{gap:12px;min-width:210px}}

.actor-missing{width:110px;height:110px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:#f0eeea;border:1px dashed #d2cbbf;color:#978b7a;font-size:14px;text-align:center;border-radius:3px}
.actor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.actor-card{background:#fff;border:1px solid #dedbd5;border-radius:3px;overflow:hidden;display:flex;flex-direction:column}
.actor-portrait{padding:15px;text-align:center;background:linear-gradient(#faf9f6,#eeeae3)}
.actor-portrait .monster-image{width:180px;height:180px;border:0;background:transparent}
.actor-portrait .actor-missing{width:180px;height:180px;margin:auto}
.actor-info{padding:22px;display:flex;flex-direction:column;flex:1}
.actor-info h2{font-size:24px;margin:8px 0}.actor-info p{font-size:16px;line-height:1.85;color:#80786d;margin:4px 0 18px}
.actor-info>.tag{align-self:flex-start}.actor-locations{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}
.actor-locations a{font-size:15px;color:#9a5844;background:#f5ede7;padding:3px 8px;border-radius:2px}
.actor-locations a:hover{background:#ead6c8}
.skill-intro{display:flex;justify-content:space-between;align-items:center;gap:25px;background:linear-gradient(120deg,#eee8dd,#f9f7f2);border:1px solid #d9cec0;border-left:4px solid #a5483c;padding:28px 32px;margin-bottom:25px}
.skill-intro h2{font-size:30px;margin:0}.skill-intro p{font-size:18px;color:#837567;margin:5px 0}
.skill-special{text-align:right;min-width:150px}.skill-special span{display:block;font-size:14px;color:#9c8a74}.skill-special strong{display:block;font-size:23px;color:#a07845}
.skill-card .panel-heading h2{font-size:25px;margin-top:10px}.skill-card .panel-heading{align-items:center}
.skill-table{min-width:890px}.skill-table .options{min-width:245px}.skill-table td{vertical-align:top}
.proficiency-table{min-width:760px}.proficiency-table td:last-child{min-width:350px}
.skill-explanation{margin:0;font-size:18px;color:#6e6153}.learning-note{margin-top:28px;background:#f2eee6}
.learning-note h2{font-size:23px}.learning-note p{font-size:17px;color:#837767}
.skill-exp{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:1050px){nav{gap:20px;font-size:17px}.actor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.skill-intro{padding:22px;align-items:flex-start}.skill-special{min-width:100px}.skill-special strong{font-size:18px}.skill-card{padding:16px}.skill-card .panel-heading{align-items:flex-start;flex-wrap:wrap}}
@media(max-width:560px){nav{gap:12px;font-size:16px}.actor-grid{grid-template-columns:1fr}.skill-intro{flex-direction:column;gap:15px}.skill-special{text-align:left}.actor-missing{width:88px;height:88px}.skill-groups .tab{padding:9px 13px}}

.monster-stats-table{min-width:1080px}.monster-stats-table th,.monster-stats-table td{padding-left:12px;padding-right:12px}.monster-stats-table>tbody>tr>td:not(:first-child){white-space:nowrap}.monster-stats-table .monster-cell{min-width:230px}

.skill-title{display:flex;align-items:center;gap:18px}.skill-icon{width:64px;height:64px;object-fit:contain;image-rendering:pixelated;border:1px solid #bca888;border-radius:3px;background:#e9e5dc;flex-shrink:0}.skill-added-effect{margin-top:12px;padding:10px 12px;border-left:3px solid #a5483c;background:#f6ede5;color:#90533e;white-space:normal}.skill-added-effect b{display:block;font-size:14px;color:#a27e50;margin-bottom:4px}

/* Compact vertical rhythm; preserve the requested readable font sizes. */
body{line-height:1.55}
header{min-height:145px;padding-top:4px;padding-bottom:4px}
.brand-logo{width:196px;height:137px}body:before{height:145px}
main{margin-bottom:36px}
.page-head{padding:20px 0 16px}.page-head h1{margin:2px 0 5px}
.hero{min-height:300px}.hero-copy{padding:30px 38px}.hero-art{min-height:300px}
.hero h1{margin-bottom:10px;line-height:1.3}.hero p{margin-bottom:16px}
.eyebrow{margin-bottom:8px}.stats{margin:12px 0 20px}.stat{padding-top:11px;padding-bottom:11px}
.panel{padding:17px 22px;margin-bottom:14px}.panel-heading{margin-bottom:12px}
.section-title{margin:19px 0 11px}.section-title p{margin-top:3px}
.post-row{padding-top:10px;padding-bottom:10px}.mini-rank{padding-top:8px;padding-bottom:8px}
.guide{padding:18px 22px;min-height:155px}.guide p{margin:6px 0;line-height:1.55}
.aside-note{padding:18px 22px}.aside-note p{margin-bottom:8px}
.tabs{margin-bottom:13px}.tab{padding-top:7px;padding-bottom:7px}.toolbar{margin-bottom:12px}
th{padding-top:9px;padding-bottom:9px}
td{padding-top:10px;padding-bottom:10px;line-height:1.5}
.options{line-height:1.55}.sub{line-height:1.5;margin-top:3px}
.monster-stats-table th,.monster-stats-table td{padding-top:8px;padding-bottom:8px}
.pager{margin:14px}.empty{padding:25px 18px}
.skill-intro{padding:18px 25px;margin-bottom:15px}.skill-intro p{margin:3px 0}
.skill-card{padding:16px 20px;margin-bottom:14px}.skill-card .panel-heading{margin-bottom:12px}
.skill-card .panel-heading h2,.passive-title h2{margin:4px 0 0;font-size:25px}
.skill-card .skill-icon,.passive-title .skill-icon{width:54px;height:54px}
.skill-title{gap:14px}.passive-title{margin-bottom:10px}
.skill-table td,.proficiency-table td{padding-top:10px;padding-bottom:10px;line-height:1.5}
.skill-added-effect{margin-top:6px;padding:6px 10px;line-height:1.5}
.skill-added-effect b{display:inline;font-size:14px;margin-right:10px;margin-bottom:0}
.learning-note{margin-top:16px}.learning-note h2{margin:4px 0 8px}.learning-note p{margin:8px 0;line-height:1.6}
.actor-grid{gap:14px}.actor-portrait{padding:9px}.actor-info{padding:16px 20px}
.actor-info h2{margin:5px 0}.actor-info p{margin:3px 0 12px;line-height:1.6}
.article{padding:25px}.article h1{margin:10px 0}.article-body{margin-top:16px;padding-top:19px;line-height:1.75}
.article-actions{margin-top:15px}.rank-top td{padding-top:13px;padding-bottom:13px}
footer{padding-top:24px;padding-bottom:22px}
@media(max-width:850px){header{padding:6px 0 12px;gap:5px}body:before{height:207px}}
@media(max-width:560px){.hero-copy{padding:23px 24px}.hero-art{min-height:175px}.panel,.skill-card{padding:14px}.skill-intro{padding:16px 20px;gap:10px}.guide{min-height:145px}.page-head{padding-top:16px}.skill-added-effect b{margin-right:7px}}

.map-grid{gap:14px}.map-card{padding:16px 22px}.map-card h2{margin:8px 0}.map-card p{margin:5px 0}
.monster-stats-table{table-layout:fixed;min-width:1040px}
.monster-name-column{width:255px}.monster-drop-column{width:140px}
.monster-stats-table .monster-cell{min-width:0;gap:12px}
.monster-stats-table .monster-cell>div{min-width:0;overflow-wrap:anywhere}
.monster-stats-table .monster-image,.monster-stats-table .actor-missing{width:88px;height:88px}
.monster-stats-table th,.monster-stats-table td{padding-left:9px;padding-right:9px}
.monster-stats-table th:not(:first-child),.monster-stats-table td:not(:first-child){text-align:center}
.monster-drop-button{font:inherit;font-size:16px;color:#a5483c;background:#f5ece6;border:1px solid #decec1;border-radius:3px;padding:7px 10px;white-space:nowrap}
.monster-drop-button:hover,.monster-drop-button[aria-expanded="true"]{background:#ead8cb;border-color:#b68a6b}
.monster-drop-row>td{background:#fbf8f3;padding:12px 16px}
.monster-drop-row .drop-list{max-width:none;margin-top:0}

/* Two compact lines per region card, without reducing type sizes. */
.map-grid{gap:9px 14px}
.map-card{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title number" "level count";align-items:center;gap:7px 12px;padding:12px 16px}
.map-card .map-number{grid-area:number;letter-spacing:1px;white-space:nowrap}
.map-card h2{grid-area:title;margin:0;line-height:1.3}
.map-card>.tag{grid-area:level;justify-self:start;padding:2px 6px;line-height:1.5}
.map-card p{grid-area:count;margin:0;white-space:nowrap;font-size:16px;line-height:1.5}
@media(min-width:851px) and (max-width:1120px){.map-card{grid-template-areas:"title number" "level level" "count count";gap:4px 8px}}
@media(max-width:560px){.map-card{padding:11px 14px;gap:6px 8px}}

/* Use the available screen width and keep long pages easy to navigate. */
header,main{max-width:1180px;width:auto;margin-left:auto;margin-right:auto}
.topline{padding-left:max(24px,calc((100% - 1180px)/2));padding-right:max(24px,calc((100% - 1180px)/2))}
.back-to-top{position:fixed;right:22px;bottom:22px;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:64px;min-height:64px;padding:8px 12px;border:1px solid #923e34;border-radius:6px;background:#a5483c;color:#fff;box-shadow:0 3px 12px #0003;font:inherit;font-size:15px;line-height:1.3;cursor:pointer}
.back-to-top[hidden]{display:none}
.back-to-top:hover{background:#863a31}
.back-to-top:focus-visible{outline:3px solid #a58b58;outline-offset:3px}
.back-to-top .top-arrow{font-size:25px;line-height:1}
@media(max-width:560px){header,main{margin-left:12px;margin-right:12px}.topline{padding-left:12px;padding-right:12px}.back-to-top{right:12px;bottom:16px;min-width:56px;min-height:56px;font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* PvP follows the map setting; named beginner/town cards use calm green. */
.map-card-safe{background:linear-gradient(120deg,#f1f7ef,#e2eddf);border-color:#b6ccb0;border-left:4px solid #7a9f70}
.map-card-safe:hover{border-color:#71966a}
.map-card-safe h2{color:#496844}
.map-card-safe>.tag{background:#dbe9d6;color:#52714a}
.map-card-safe .map-number{color:#708569}
.map-card .map-number{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:5px 8px}
.pvp-badge{display:inline-flex;align-items:center;white-space:nowrap;padding:2px 7px;border-radius:3px;font-size:14px;font-weight:normal;line-height:1.5;letter-spacing:0}
.pvp-allowed{background:#f3ded8;color:#9d4033;border:1px solid #ddb4a9}
.pvp-blocked{background:#e4eddf;color:#4e7045;border:1px solid #c4d5ba}
.pvp-unknown{background:#ece9e3;color:#79736b;border:1px solid #d7d1c8}
.map-detail-meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.map-detail-safe{background:#eaf2e6;border-left:4px solid #7a9f70;padding:7px 12px}
@media(max-width:560px){.map-card .map-number{flex-direction:column;align-items:flex-end;gap:3px}.map-card .map-number>span:last-child{font-size:12px}}

/* Restore the centered content width while preserving compact rows. */
@media(max-width:1240px){header,main{margin-left:24px;margin-right:24px}}
@media(max-width:560px){header,main{margin-left:12px;margin-right:12px}}

/* Stronger safe-region colors and five compact encyclopedia cards per row. */
.map-card-safe{background:linear-gradient(120deg,#d4eacb,#b8d9ab);border-color:#79a468;border-left:5px solid #497c35}
.map-card-safe h2{color:#305821}.map-card-safe .map-number,.map-card-safe p{color:#4e6c40}
.map-card-safe>.tag{background:#a8cd98;color:#2c5220}
.map-detail-safe{background:#d4eacb;border-color:#497c35}
.actor-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.actor-grid .actor-portrait{padding:8px}
.actor-grid .actor-portrait .monster-image,.actor-grid .actor-portrait .actor-missing{width:132px;height:132px;max-width:100%;margin:auto}
.actor-grid .actor-info{padding:10px 12px}
.actor-grid .actor-info h2{font-size:20px;line-height:1.35;margin:6px 0;overflow-wrap:anywhere}
.actor-grid .actor-locations{gap:4px}.actor-grid .actor-locations a{padding:2px 5px;font-size:14px}
.monster-drop-trigger{display:block;width:100%;border:0;border-bottom:1px solid #dedbd5;color:inherit;font:inherit;cursor:pointer}
.monster-drop-trigger:hover,.monster-drop-trigger:focus-visible{background:#e8e1d4}
.portrait-hint{display:block;font-size:13px;color:#8d6b50;line-height:1.4}
.aggression{font-size:14px;color:#5d7850;line-height:1.4}.aggression.hostile{color:#ad4030}
.monster-attributes{margin:8px 0 12px;font-size:16px;line-height:1.5}
.monster-attributes>div{display:flex;justify-content:space-between;gap:5px;border-bottom:1px solid #f0ede7;padding:1px 0}
.monster-attributes dt{color:#847c70}.monster-attributes dd{margin:0;text-align:right;overflow-wrap:anywhere}
.monster-drop-popup{position:fixed;z-index:50;width:min(500px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;padding:14px;background:#fffdf7;border:1px solid #b99872;border-radius:5px;box-shadow:0 6px 28px #0004;font-size:16px}
.monster-drop-popup[hidden]{display:none}
.drop-popup-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;color:#715035}
.drop-popup-heading button{border:0;background:transparent;font:inherit;font-size:25px;min-width:32px;line-height:1.2;color:#715035}
.monster-drop-popup .drop-list{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.monster-drop-popup .drop{font-size:14px;padding:5px;align-items:center;min-width:0;overflow-wrap:anywhere}
.monster-drop-popup .drop small{display:block;font-size:12px;color:#8a7d6e}
.monster-drop-popup .drop img{flex-shrink:0}
@media(max-width:1100px){.actor-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:850px){.actor-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.actor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:380px){.actor-grid{grid-template-columns:1fr}.monster-drop-popup .drop-list{grid-template-columns:1fr}}

/* Warm ivory safe-region cards with charcoal text. */
.map-card-safe{background:linear-gradient(120deg,#fff8dd,#f3e8bd);border-color:#d6c997;border-left:4px solid #c2ad6f}
.map-card-safe:hover{border-color:#bba369}
.map-card-safe h2,.map-card-safe p,.map-card-safe .map-number,.map-card-safe .more{color:#444440}
.map-card-safe>.tag{background:#eadeb4;color:#4b4941}
.map-card-safe .pvp-blocked,.map-detail-safe .pvp-blocked{background:#fff9e6;border-color:#d8cba1;color:#49483f}
.map-detail-safe{background:#f8efcf;border-color:#c2ad6f;color:#444440}
.map-detail-safe .more{color:#444440}

/* Clear Korean UI text: avoid the former single light webfont for every weight.
   Keep native browser text rasterization; pixelated rendering belongs to sprites only. */
:root{--ink:#30383c;--muted:#62696d}
.page-head h1,.hero h1{font-weight:700}
th{font-weight:700;color:#555d61}
.item-name{color:#343e43}
.options{color:#424a4e}
.sub{color:#62696d}
.toolbar input,.toolbar select,.field{font-weight:400;color:#30383c}
input::placeholder,textarea::placeholder{color:#687176;opacity:1}

/* Keep all menu labels intact, including the external download link. */
header .brand{flex-shrink:0}
header nav{gap:7px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
header nav a{white-space:nowrap;padding:8px 11px;border:1px solid #e1e5dc;border-radius:4px;background:#f9faf7;line-height:1.5;transition:background .15s,border-color .15s}
header nav a:hover,header nav a:focus-visible,header nav a.active{background:#eaf1e5;border-color:#a9bea0;color:#41643b}
@media(max-width:1100px){
    header{flex-direction:column;gap:8px;padding:8px 0 14px}
    header nav{width:100%;justify-content:center;gap:8px}
}
@media(max-width:560px){
    header nav{font-size:13px;gap:7px}
    header nav a{padding:7px 9px}
}

/* Self-host the notice font so Korean lettering stays consistent across PCs. */
@font-face{
    font-family:"Dilmun Notice";
    src:url('/assets/fonts/Pretendard-SemiBold.woff2') format('woff2');
    font-style:normal;
    font-weight:600;
    font-display:swap;
}

/* Project notice between the home banner and the statistics. */
.project-notice{
    margin:14px 0 0;
    padding:20px 24px;
    border:1px solid var(--line);
    border-radius:2px;
    background:#f0ede7;
    color:#394044;
    text-align:center;
    font-family:"Dilmun Notice",var(--font-ui);
    font-size:18px;
    font-weight:600;
    line-height:1.8;
    letter-spacing:-.015em;
    word-break:keep-all;
    overflow-wrap:break-word;
}
.project-notice p{margin:0;font:inherit;color:inherit;letter-spacing:inherit}
.project-notice p+p{margin-top:4px}
.project-notice strong{color:#934337;font-weight:inherit}
@media(max-width:560px){
    .project-notice{padding:16px;font-size:16px;line-height:1.75}
    .project-notice p+p{margin-top:7px}
}

.item-sources{min-width:120px;white-space:nowrap}
.item-source-button{border:1px solid #d7dfd2;border-radius:4px;background:#f6f8f3;color:#4c6748;padding:6px 9px;font-size:12px;white-space:nowrap}
.item-source-button:hover,.item-source-button:focus-visible,.item-source-button[aria-expanded="true"]{border-color:#8da984;background:#edf4e9}
.item-source-button span{margin-left:5px}
.item-source-popover{position:fixed;z-index:50;max-height:min(420px,70vh);overflow:auto;padding:14px 16px;background:#fffdf9;border:1px solid #cbd8c5;border-radius:7px;box-shadow:0 12px 36px #26332838;color:#30383c;white-space:normal}
.item-source-popover[hidden]{display:none}
.item-source-heading{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding-bottom:9px;border-bottom:1px solid #e6e9e0}
.item-source-heading strong{font-size:14px}
.item-source-heading span{font-size:11px;color:#798477;white-space:nowrap}
.item-source-section{margin-top:12px}
.item-source-section h3{margin:0 0 7px;font-size:12px;color:#596b53}
.item-source-section h3 small{font-size:11px;font-weight:400;color:#899388}
.item-source-list{display:flex;flex-wrap:wrap;gap:6px}
.item-source{display:inline-block;border-radius:4px;padding:4px 7px;font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.item-source-monster{color:#765331;background:#f4eadd;border:1px solid #ead8bf}
.item-source-box{color:#26647a;background:#e5f1f5;border:1px solid #c5dfe8}
.item-source-box:hover,.item-source-box:focus-visible{background:#d2e8f0;border-color:#8fbdce}
