:root {
    --site-navy: #102a43;
    --site-navy-deep: #071b2d;
    --site-blue: #176b87;
    --site-mint: #42b8a5;
    --site-lime: #d8f36a;
    --site-cream: #f7f8f2;
    --site-white: #fff;
    --site-ink: #172b3a;
    --site-muted: #647783;
    --site-line: #dce5e7;
    --site-shadow: 0 24px 70px rgba(16, 42, 67, .12);
}

html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--site-ink);
    background: var(--site-cream) !important;
    font-family: 'Noto Sans KR', sans-serif !important;
    line-height: 1.65;
    word-break: keep-all;
}
body.site-menu-open { overflow: hidden; }
.site-shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }

.site-subpage-header {
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    color: var(--site-navy);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 10px 35px rgba(16, 42, 67, .08);
    backdrop-filter: blur(14px);
}
.site-nav { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.site-brand { display: inline-flex; align-items: center; flex: 0 0 auto; padding: 7px 11px; background: var(--site-white); border-radius: 10px; }
.site-brand img { display: block; width: 168px; height: auto; }
.site-nav-links { display: flex; align-items: center; gap: 25px; font-size: 14px; font-weight: 600; }
.site-nav-links a { position: relative; color: var(--site-navy); opacity: .86; text-decoration: none; }
.site-nav-links a::after { content: ''; position: absolute; right: 0; bottom: -8px; left: 0; height: 2px; background: var(--site-mint); transform: scaleX(0); transition: transform .2s ease; }
.site-nav-links a:hover::after { transform: scaleX(1); }
.site-account-links { display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 700; }
.site-account-links a { color: var(--site-navy); text-decoration: none; }
.site-account-pill { padding: 9px 15px; border: 1px solid var(--site-navy); border-radius: 10px; }
.site-account-pill.primary { color: var(--site-white); border-color: var(--site-navy); background: var(--site-navy); }
.site-menu-toggle { display: none; width: 44px; height: 44px; color: var(--site-navy); border: 1px solid var(--site-navy); border-radius: 10px; background: transparent; }
.site-mobile-panel { display: none; }

body > main { min-height: calc(100vh - 310px); margin-top: 0 !important; padding-top: 128px !important; padding-bottom: 72px !important; }
main > .max-w-md,
main > .bg-white,
main form.bg-white,
main .max-w-md > .bg-white {
    border: 1px solid var(--site-line) !important;
    border-radius: 20px !important;
    box-shadow: var(--site-shadow) !important;
}
main h1, main h2 { color: var(--site-navy-deep) !important; letter-spacing: -.035em; }
main input:not([type='checkbox']):not([type='radio']),
main textarea,
main select {
    border-color: var(--site-line) !important;
    border-radius: 10px !important;
    background: var(--site-white) !important;
}
main input:focus, main textarea:focus, main select:focus {
    border-color: var(--site-mint) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(66, 184, 165, .18) !important;
}
main .bg-blue-600, main .bg-blue-500,
main .bg-primary-600, main .bg-primary-500,
main button[type='submit'] {
    color: var(--site-white) !important;
    background: var(--site-navy) !important;
    border-color: var(--site-navy) !important;
}
main .hover\:bg-blue-700:hover, main .hover\:bg-blue-600:hover,
main .hover\:bg-primary-700:hover { background: var(--site-blue) !important; }
main .text-blue-600, main .text-blue-500,
main .text-primary-600, main .text-primary-500 { color: var(--site-blue) !important; }
main .bg-blue-100, main .bg-primary-100 { background: #e8f5f2 !important; }
main .post-card { border: 1px solid var(--site-line); border-radius: 20px; box-shadow: 0 12px 35px rgba(16, 42, 67, .08); }
main .post-card:hover { box-shadow: var(--site-shadow); }
main .post-card-title a { color: var(--site-navy) !important; text-decoration: none; }
main .post-card-title a:hover { color: var(--site-blue) !important; }
main .post-card-id { color: var(--site-blue); background: #e8f5f2; }
.modal-container { border: 1px solid var(--site-line); border-radius: 20px !important; box-shadow: var(--site-shadow) !important; }
.modal-title { color: var(--site-navy-deep) !important; }
.page-title-container { color: var(--site-white) !important; background: var(--site-navy) !important; border-radius: 20px !important; box-shadow: var(--site-shadow) !important; }
.page-title-container .page-title-text { color: var(--site-white) !important; }
.message-box { margin-top: 132px !important; border: 1px solid var(--site-line); background: var(--site-white) !important; color: var(--site-ink) !important; box-shadow: var(--site-shadow) !important; }
.message-box a { color: var(--site-white) !important; background: var(--site-navy) !important; }

.site-subpage-footer { padding: 54px 0; color: #8da2ae; background: #061623; font-size: 13px; }
.site-footer-grid { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }
.site-footer-brand { width: fit-content; margin-bottom: 14px; }
.site-footer-copy p { margin: 4px 0; }
.site-footer-links { display: flex; gap: 20px; color: #c7d2d8; font-weight: 600; }
.site-footer-links a, .site-footer-qr { color: inherit; text-decoration: none; }
.site-footer-qr { margin-top: 34px; padding-top: 28px; display: flex; align-items: center; justify-content: center; gap: 18px; border-top: 1px solid rgba(255, 255, 255, .12); }
.site-footer-qr img { width: 112px; height: 112px; padding: 6px; object-fit: contain; background: var(--site-white); border-radius: 10px; }
.site-footer-qr span { color: #c7d2d8; }
.site-footer-qr strong { display: block; margin-top: 4px; color: var(--site-white); font-size: 17px; }

@media (max-width: 1080px) {
    .site-nav-links, .site-account-links { display: none; }
    .site-menu-toggle { display: grid; place-items: center; }
    .site-mobile-panel.open { display: grid; max-height: calc(100vh - 84px); padding: 18px 24px 28px; overflow-y: auto; background: var(--site-white); border-top: 1px solid var(--site-line); }
    .site-mobile-panel a { padding: 12px 0; color: var(--site-navy); border-bottom: 1px solid var(--site-line); font-weight: 700; text-decoration: none; }
}

@media (max-width: 640px) {
    .site-shell { width: min(100% - 28px, 1180px); }
    .site-nav { min-height: 72px; }
    .site-brand img { width: 142px; }
    body > main { padding-top: 104px !important; padding-bottom: 52px !important; }
    .site-footer-grid { align-items: flex-start; flex-direction: column; }
    .site-footer-qr { justify-content: flex-start; }
    .message-box { width: calc(100% - 28px); margin-top: 112px !important; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}
