/* Authoritative type roles. Loaded last on every page, including builds.
   Sizes are in the shared 1670px design canvas, not viewport pixels. */
:root {
 --type-body:18px; --type-small:16px; --type-label:20px;
 --type-card:22px; --type-title:29px;
 --type-medium:600; --type-bold:700;
}
body * { font-family:var(--font-body)!important; font-weight:var(--type-medium)!important; }
body :is(h1,h2,h3,h4,h5,h6,strong,b) { font-weight:var(--type-bold)!important; }
body :is(p,input,textarea,select) { line-height:1.6; }
body :is(.card-desc,.memo-desc,.hero-sub-desc,.hero-sub-desc p,.scrapbook-desc,.sos-heading p,.report-lead-desc,.profile-greeting-text,.room-caption,.dorm-helper,.shop-details,.shop-entry,.shop-mission,.notice-text,.story-row-excerpt) {
 font-size:var(--type-body)!important; font-weight:var(--type-medium)!important; line-height:1.6!important;
}
body :is(.card-date,.card-stats,.postit-card-stats,.postit-date,.story-row-date,.story-row-stats,.history,.home-bgm-caption,.jukebox-track-bar,.visit-stat,.profile-instagram-btn) {
 font-size:var(--type-small)!important; font-weight:var(--type-medium)!important; line-height:1.5!important;
}
body :is(.card-title,.story-row-title,.postit-label) { font-size:var(--type-card)!important; font-weight:var(--type-bold)!important; line-height:1.4!important; }
body :is(.hero-main-title,.scrapbook-title,.sos-heading h1,.blog-hero-heading) { font-size:var(--type-title)!important; font-weight:var(--type-bold)!important; line-height:1.4!important; }
body :is(.memo-title,.cat-title,.sidebar-card-header,.report-lead-title) { font-size:var(--type-label)!important; font-weight:var(--type-bold)!important; line-height:1.4!important; }
body :is(.category-chip,.list-cat-btn,.nav-story-btn,.card-cat-chip,.hot-tag,.retro-btn,.dorm-primary,.dorm-sidebar nav button,.shop-sidebar nav a,.shop-sidebar nav button) { font-size:var(--type-body)!important; font-weight:var(--type-bold)!important; line-height:1.4!important; }
body :is(.dorm-paper,.note-text,.postit-card-content) { font-size:var(--type-label)!important; font-weight:var(--type-medium)!important; line-height:1.5!important; }
/* Common navigation never inherits a page's typography. Geometry stays shared. */
body .shared-header .shared-nav a { font-family:"Pretendard",sans-serif!important; font-size:21px!important; font-weight:700!important; line-height:1.2!important; letter-spacing:0!important; -webkit-text-stroke:0; }
/* Deliberate character fonts: browser chrome and pixel window labels only. */
body :is(.title-bar,.address-bar,.retro-box-title,.on-air-badge,.ribbon-badge),
body :is(.title-bar,.address-bar,.retro-box-title,.on-air-badge,.ribbon-badge) *,
body .dorm-sidebar>h2,body .dorm-sign { font-family:var(--font-pixel)!important; font-weight:400!important; -webkit-text-stroke:0; }
body :is(.diary-story-heading,.diary-story-body,.diary-reply-body,.diary-author-sign) { font-family:'KyoboHandwriting2019',var(--font-body)!important; font-weight:400!important; -webkit-text-stroke:.12px currentColor; }
body :is(.diary-story-body,.diary-reply-body) { font-size:25px!important; line-height:1.5!important; }
@media(orientation:landscape) and (max-width:1100px) { body .shared-header .shared-nav a {font-size:17px!important;} }
@media(orientation:portrait) {
 :root {--type-body:16px;--type-small:14px;--type-label:18px;--type-card:20px;--type-title:24px;}
 body .shared-header .shared-nav a {font-size:13px!important;}
 body :is(.diary-story-body,.diary-reply-body) {font-size:21px!important;}
}

/* Shared navigation has one rendering rule, independent of page text effects. */
body .shared-header .shared-nav a,
body .shared-header .shared-nav a * {
 font-family:"Pretendard",sans-serif!important;
 font-weight:700!important;
 font-style:normal!important;
 font-variation-settings:"wght" 700!important;
 font-synthesis:none!important;
 text-shadow:none!important;
 -webkit-text-stroke:0!important;
 letter-spacing:0!important;
 text-rendering:optimizeLegibility!important;
 -webkit-font-smoothing:antialiased!important;
}

/* Smooth body text as well as navigation: inherited smoothing:none made
   the correct Gothic font look like a bitmap font on WebKit. */
html, body, body * { -webkit-font-smoothing:antialiased!important; }
body :is(.hero-sub-desc,.scrapbook-desc) {
 font-family:"Pretendard",sans-serif!important;
 font-size:var(--type-body)!important;
 font-weight:600!important;
 font-variation-settings:"wght" 600!important;
 text-rendering:optimizeLegibility!important;
 text-shadow:none!important;
 -webkit-text-stroke:0!important;
}

body.home-page .home-bgm-caption,body.home-page .home-bgm-caption * {
 font-family:var(--font-pixel)!important;font-weight:400!important;
 font-size:17px!important;line-height:1.2!important;-webkit-text-stroke:0!important;
}
body.home-page .home-bgm-caption span {font-size:12px!important;}
@media(orientation:portrait) {body.home-page .home-bgm-caption{font-size:14px!important;}}

/* One sidebar memo design for dorm and shop; only the copy differs. */
body .dorm-sidebar .dorm-paper,
body.shop-page .shop-sidebar .dorm-paper {
 font-family:"Pretendard",sans-serif!important;
 font-size:var(--type-label)!important;font-weight:600!important;line-height:1.5!important;
 color:var(--brand-ink);background:#fff3d4;border:1px solid #c9ad77;
 box-shadow:2px 3px #c0c9dc;transform:rotate(-1deg);
 padding:14px 12px;box-sizing:border-box;flex:0 0 auto;
 height:auto;min-height:0;white-space:normal;overflow-wrap:break-word;
}
/* Equal notebook heading labels. */
body #diaryDetailView .ribbon-badge,
body #diaryDetailView .reply-tape-label {
 display:inline-flex;align-items:center;justify-content:center;
 box-sizing:border-box;width:218px;min-height:42px;padding:9px 14px;
 flex-shrink:0;line-height:1.2;white-space:nowrap;
 border-radius:8px;clip-path:none;letter-spacing:0;
}
body #diaryDetailView .ribbon-badge,
body #diaryDetailView .ribbon-badge *,
body #diaryDetailView .reply-tape-label,
body #diaryDetailView .reply-tape-label * {
 font-family:Pretendard,sans-serif!important;font-size:19px!important;
 font-weight:700!important;line-height:1.2!important;
}
/* Writing and story navigation use the same button typography. */
body #diaryDetailView .diary-bottom-nav :is(.nav-story-btn,.diary-write-inline){
 font-family:var(--font-body)!important;
 font-size:var(--type-body)!important;
 font-weight:var(--type-bold)!important;
 font-style:normal!important;
 line-height:1.4!important;
 letter-spacing:0!important;
 text-shadow:none!important;
 -webkit-text-stroke:0!important;
}

/* Inner pages use precisely the dorm header's dimensions on the shared stage. */
@media(orientation:landscape){
 body:not(.home-page) .shared-header{position:absolute;inset:103px 0 auto;height:120px;pointer-events:none}
 body:not(.home-page) .shared-logo{position:absolute;top:8px;left:75px;width:280px;height:112px;transform:none;pointer-events:auto}
 body:not(.home-page) .shared-nav{position:absolute;top:28px;right:25px;left:auto;bottom:auto;width:638px;display:grid;grid-template-columns:52px 65px 90px 125px 73px 108px 78px;gap:6px;pointer-events:auto}
 body:not(.home-page) .shared-header .shared-nav a{height:46px;min-width:0;padding:0 8px;font-size:16px!important}
 body:not(.home-page) .diary-canvas,body.sos-page .sos-container{top:226px!important;bottom:22px}
 body:not(.home-page) .diary-canvas{bottom:22px!important}
}
