:root {
    --journal-ink: #10233f;
    --journal-muted: #61708a;
    --journal-paper: #f5f8fc;
    --journal-card: #ffffff;
    --journal-line: #d7e0ec;
    --journal-accent: #1e5fa8;
    --journal-accent-dark: #123f78;
    --journal-warm: #6e91c7;
}

.journal-shell {
    min-height: 100vh;
    color: var(--journal-ink);
    background: var(--journal-paper);
    font-family: 'NanumSquareR', sans-serif;
    padding-bottom: 7rem;
}

.journal-shell *, .journal-shell *::before, .journal-shell *::after { box-sizing: border-box; }
.journal-shell a { color: inherit; text-decoration: none; }
.journal-container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.journal-container--narrow { width: min(820px, calc(100% - 40px)); margin-inline: auto; }
.journal-content { padding-top: 4.5rem; }

.journal-hero {
    position: relative;
    overflow: hidden;
    padding: 10.5rem 0 6.5rem;
    color: #f8fbfa;
    background: #0b1f3a;
}

.journal-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: .28;
    background:
        radial-gradient(circle at 75% 10%, rgba(74, 132, 200, .45), transparent 28%),
        repeating-radial-gradient(ellipse at 88% 50%, transparent 0 32px, rgba(255,255,255,.13) 33px 34px);
}

.journal-hero__inner { position: relative; display: flex; align-items: flex-end; justify-content: space-between; gap: 3rem; }
.journal-eyebrow { margin: 0 0 1rem; color: var(--journal-accent); font-family: 'NanumSquareEB', sans-serif; font-size: .75rem; letter-spacing: .18em; }
.journal-hero .journal-eyebrow { color: #75aee8; }
.journal-hero h1 { margin: 0; font-family: 'NanumSquareEB', sans-serif; font-size: clamp(3rem, 7vw, 6.2rem); letter-spacing: -.055em; line-height: 1; }
.journal-hero__lead { margin: 2rem 0 0; color: #d7e4f4; font-size: clamp(1rem, 2vw, 1.25rem); line-height: 1.8; }
.journal-hero__mark { display: flex; gap: 9px; align-items: flex-end; height: 90px; margin-bottom: .8rem; }
.journal-hero__mark span { width: 8px; border-radius: 8px; background: #75aee8; }
.journal-hero__mark span:nth-child(1) { height: 38%; opacity: .55; }
.journal-hero__mark span:nth-child(2) { height: 100%; }
.journal-hero__mark span:nth-child(3) { height: 62%; opacity: .72; }

.journal-messages { display: grid; gap: .65rem; margin-bottom: 2rem; }
.journal-message { padding: .9rem 1rem; border: 1px solid #b9cde5; border-radius: .6rem; background: #edf4fc; }
.journal-message--error { border-color: #e7b9b9; background: #fff0f0; color: #8a2424; }
.journal-message--success { color: #164f89; }

.journal-local-mode { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; padding: 1.5rem 1.75rem; border: 1px solid #c8d8ec; border-radius: .75rem; background: #eaf2fb; }
.journal-local-mode h2 { margin: 0; font-family: 'NanumSquareEB', sans-serif; font-size: 1.35rem; }
.journal-local-mode p:last-child { margin: .65rem 0 0; color: var(--journal-muted); }
.journal-local-mode form { flex: 0 0 auto; margin: 0; }

.journal-manager { margin-bottom: 5rem; padding: 2rem; border: 1px solid #c8d8ec; border-radius: 1rem; background: #edf3fa; }
.journal-manager__header, .journal-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; }
.journal-manager h2, .journal-section-heading h2 { margin: 0; font-family: 'NanumSquareEB', sans-serif; font-size: clamp(1.6rem, 4vw, 2.4rem); letter-spacing: -.035em; }
.journal-actions { display: flex; gap: .65rem; flex-wrap: wrap; align-items: center; }
.journal-actions form { margin: 0; }
.journal-button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: .75rem 1.15rem; border: 1px solid var(--journal-accent); border-radius: .35rem; color: #fff !important; background: var(--journal-accent); font-family: 'NanumSquareB', sans-serif; cursor: pointer; }
.journal-button:hover { border-color: var(--journal-accent-dark); background: var(--journal-accent-dark); }
.journal-button--ghost { color: var(--journal-accent-dark) !important; background: transparent; }
.journal-button--danger { border-color: #b64b4b; background: #b64b4b; }
.journal-manager__list { display: grid; margin-top: 1.5rem; border-top: 1px solid #c8d8ec; }
.journal-manager__item { display: grid; grid-template-columns: 72px 1fr auto; gap: 1rem; align-items: center; padding: .9rem 0; border-bottom: 1px solid #c8d8ec; }
.journal-manager__item time { color: var(--journal-muted); font-size: .82rem; }
.journal-status { display: inline-flex; width: fit-content; padding: .22rem .48rem; border-radius: 99px; color: #174f88; background: #dceaf8; font-size: .72rem; font-family: 'NanumSquareB', sans-serif; }
.journal-status--draft { color: #7a5a1c; background: #f3e7c7; }
.journal-manager__empty { margin: 1.5rem 0 0; color: var(--journal-muted); }

.journal-featured { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .8fr); min-height: 470px; overflow: hidden; margin-bottom: 7rem; border-radius: .35rem; background: var(--journal-ink); color: #fff; }
.journal-featured__media { min-height: 420px; overflow: hidden; }
.journal-featured__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.journal-featured:hover .journal-featured__media img { transform: scale(1.025); }
.journal-featured__copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(2rem, 5vw, 4.5rem); }
.journal-featured__copy .journal-eyebrow { color: #75aee8; }
.journal-featured__copy h2 { margin: 0; font-family: 'NanumSquareEB', sans-serif; font-size: clamp(1.8rem, 3.6vw, 3.1rem); line-height: 1.25; letter-spacing: -.045em; }
.journal-featured__copy > p:not(.journal-eyebrow) { color: #cbd8e8; line-height: 1.75; margin: 1.4rem 0; }
.journal-meta { display: flex; gap: .55rem; align-items: center; color: #9bb0ca; font-size: .82rem; }
.journal-text-link { display: inline-flex; gap: .7rem; width: fit-content; margin-top: 2rem; padding-bottom: .35rem; border-bottom: 1px solid currentColor; font-family: 'NanumSquareB', sans-serif; }

.journal-library { padding-bottom: 1rem; }
.journal-section-heading { margin-bottom: 2.2rem; padding-bottom: 1.2rem; border-bottom: 1px solid var(--journal-ink); }
.journal-section-heading > p { margin: 0; color: var(--journal-muted); font-size: .84rem; }
.journal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3.4rem 1.7rem; }
.journal-card { min-width: 0; }
.journal-card__media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #dce7f3; }
.journal-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.journal-card:hover .journal-card__media img { transform: scale(1.035); }
.journal-card__fallback { display: grid; place-items: center; width: 100%; height: 100%; background: linear-gradient(145deg, #dce9f7, #a9c3e2); }
.journal-card__fallback span { color: rgba(16,35,63,.64); font-family: 'NanumSquareEB', sans-serif; font-size: .68rem; letter-spacing: .22em; }
.journal-card__body { padding-top: 1.2rem; }
.journal-card time, .journal-related time { color: var(--journal-muted); font-size: .78rem; }
.journal-card h3 { margin: .65rem 0 .75rem; font-family: 'NanumSquareEB', sans-serif; font-size: 1.35rem; line-height: 1.4; letter-spacing: -.025em; }
.journal-card p { min-height: 4.6em; margin: 0; color: var(--journal-muted); font-size: .92rem; line-height: 1.65; }
.journal-card__link { display: inline-flex; gap: .5rem; margin-top: 1.2rem; color: var(--journal-accent) !important; font-family: 'NanumSquareEB', sans-serif; font-size: .7rem; letter-spacing: .08em; }
.journal-empty { padding: 5rem 2rem; text-align: center; border: 1px solid var(--journal-line); background: rgba(255,255,255,.45); }
.journal-empty h3 { margin: .5rem 0 1rem; font-family: 'NanumSquareEB', sans-serif; font-size: 1.8rem; }
.journal-empty p:last-child { color: var(--journal-muted); }
.journal-pagination { display: flex; justify-content: center; gap: 2rem; margin-top: 4rem; }
.journal-pagination a { color: var(--journal-accent); font-family: 'NanumSquareB', sans-serif; }

.journal-shell--article { padding-top: 9.5rem; }
.journal-article__header { text-align: center; }
.journal-back { display: inline-flex; margin-bottom: 4.5rem; color: var(--journal-muted) !important; font-size: .86rem; }
.journal-article__header h1 { margin: 1rem 0 1.6rem; font-family: 'NanumSquareEB', sans-serif; font-size: clamp(2.3rem, 6vw, 4.5rem); letter-spacing: -.055em; line-height: 1.18; }
.journal-article__lead { margin: 0 auto 1.6rem; color: var(--journal-muted); font-size: 1.15rem; line-height: 1.8; }
.journal-meta--article { justify-content: center; color: var(--journal-muted); }
.journal-actions--article { justify-content: center; margin-top: 2rem; }
.journal-article__cover { margin-top: 4.5rem; }
.journal-article__cover img { display: block; width: 100%; max-height: 680px; object-fit: cover; }
.journal-prose { margin-top: 5rem; color: #263852; font-family: 'NanumSquareR', sans-serif; font-size: 1.05rem; line-height: 2; overflow-wrap: anywhere; }
.journal-prose > *:first-child { margin-top: 0; }
.journal-prose h2, .journal-prose h3, .journal-prose h4 { margin: 2.7em 0 .8em; color: var(--journal-ink); font-family: 'NanumSquareEB', sans-serif; line-height: 1.4; letter-spacing: -.03em; }
.journal-prose h2 { font-size: 1.8rem; }
.journal-prose h3 { font-size: 1.45rem; }
.journal-prose p { margin: 1.35em 0; }
.journal-prose img { display: block; max-width: 100%; height: auto; margin: 2.5rem auto 1rem; }
.journal-prose figure { margin: 2.8rem 0; }
.journal-prose figcaption { margin-top: .8rem; color: var(--journal-muted); font-size: .82rem; line-height: 1.6; text-align: center; }
.journal-prose blockquote { margin: 2.5rem 0; padding: .5rem 0 .5rem 1.5rem; border-left: 3px solid var(--journal-accent); color: #3d5270; font-size: 1.16rem; }
.journal-prose a { color: var(--journal-accent); text-decoration: underline; text-underline-offset: .2em; }
.journal-prose table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; }
.journal-prose th, .journal-prose td { padding: .75rem; border: 1px solid var(--journal-line); }
.journal-article__footer { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; margin-top: 5rem; padding: 2rem 0; border-top: 1px solid var(--journal-line); border-bottom: 1px solid var(--journal-line); }
.journal-article__footer strong { font-family: 'NanumSquareEB', sans-serif; font-size: 1.25rem; }
.journal-article__footer p:not(.journal-eyebrow) { margin: .4rem 0 0; color: var(--journal-muted); }
.journal-related { margin-top: 7rem; padding: 5rem 0; background: #eaf0f7; }
.journal-related__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #ccd9e9; }
.journal-related__grid a { display: grid; min-height: 170px; padding: 1.5rem; background: #f5f8fc; }
.journal-related__grid strong { margin-top: .65rem; line-height: 1.5; }
.journal-related__grid span { align-self: end; color: var(--journal-accent); }

.journal-shell--editor { padding-top: 9rem; }
.journal-editor__header { margin-bottom: 2.5rem; }
.journal-editor__header .journal-back, .journal-import .journal-back { margin-bottom: 3rem; }
.journal-editor h1, .journal-import h1 { margin: 0 0 .9rem; font-family: 'NanumSquareEB', sans-serif; font-size: clamp(2.2rem, 5vw, 3.8rem); letter-spacing: -.045em; }
.journal-editor__header > div > p:last-child, .journal-import__lead { color: var(--journal-muted); line-height: 1.75; }
.journal-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; padding: clamp(1.3rem, 4vw, 2.5rem); border: 1px solid var(--journal-line); background: #fff; }
.journal-form__field { display: grid; gap: .55rem; align-content: start; }
.journal-form__field--wide { grid-column: 1 / -1; }
.journal-form label, .journal-import label { font-family: 'NanumSquareB', sans-serif; }
.journal-input { width: 100%; min-height: 46px; padding: .75rem .85rem; border: 1px solid #bccbdd; border-radius: .25rem; color: var(--journal-ink); background: #fff; }
textarea.journal-input { resize: vertical; }
.journal-input:focus { outline: 3px solid rgba(30,95,168,.15); border-color: var(--journal-accent); }
.journal-form small, .journal-import small { color: var(--journal-muted); line-height: 1.5; }
.journal-form .errorlist, .journal-import .errorlist { margin: 0; padding: 0; list-style: none; color: #a33131; font-size: .85rem; }
.journal-form__content iframe { max-width: 100%; border-color: #bccbdd !important; }
.journal-form__check { display: flex; gap: .7rem; align-items: flex-start; }
.journal-form__check input { width: 18px; height: 18px; margin-top: .1rem; accent-color: var(--journal-accent); }
.journal-form__actions { display: flex; justify-content: flex-end; gap: .75rem; padding-top: 1rem; border-top: 1px solid var(--journal-line); }

.journal-import { padding-top: 1rem; }
.journal-import__form { display: grid; gap: 1.5rem; margin-top: 2.5rem; padding: clamp(1.3rem, 4vw, 2.5rem); border: 1px solid var(--journal-line); background: #fff; }
.journal-upload-zone { display: grid; place-items: center; min-height: 230px; padding: 2rem; border: 1px dashed #8da5c3; background: #f3f7fc; text-align: center; }
.journal-upload-zone input { width: min(100%, 420px); margin: 1.2rem 0 .5rem; }
.journal-upload-zone p { margin: 0; color: var(--journal-muted); font-size: .85rem; }
.journal-import__notice { padding: 1rem 1.1rem; border-left: 3px solid var(--journal-warm); background: #eef4fb; }
.journal-import__notice p { margin: .35rem 0 0; color: #4b607d; line-height: 1.6; }

@media (max-width: 900px) {
    .journal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .journal-featured { grid-template-columns: 1fr; }
    .journal-featured__media { min-height: auto; aspect-ratio: 16 / 9; }
    .journal-related__grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    .journal-container, .journal-container--narrow { width: min(100% - 28px, 1180px); }
    .journal-hero { padding: 8.5rem 0 4.5rem; }
    .journal-hero__mark, .journal-desktop-only { display: none; }
    .journal-content { padding-top: 2.5rem; }
    .journal-manager { padding: 1.2rem; }
    .journal-local-mode { align-items: flex-start; flex-direction: column; }
    .journal-manager__header, .journal-section-heading, .journal-article__footer { align-items: flex-start; flex-direction: column; }
    .journal-manager__item { grid-template-columns: 68px 1fr; }
    .journal-manager__item time { grid-column: 2; }
    .journal-featured { margin-bottom: 4.5rem; }
    .journal-featured__copy { padding: 2rem 1.4rem; }
    .journal-grid { grid-template-columns: 1fr; gap: 2.8rem; }
    .journal-card p { min-height: auto; }
    .journal-shell--article, .journal-shell--editor { padding-top: 7.5rem; }
    .journal-back { margin-bottom: 3rem; }
    .journal-prose { margin-top: 3.5rem; font-size: 1rem; line-height: 1.9; }
    .journal-form { grid-template-columns: 1fr; }
    .journal-form__field--wide { grid-column: auto; }
    .journal-form__actions { flex-direction: column-reverse; }
    .journal-form__actions .journal-button { width: 100%; }
}