/* Shared typography and the public homepage. Component styles live in renewal.css. */
:root {
  --ink: #24282d;
  --blue: #24282d;
  --blue-dark: #24282d;
  --blue-bg: #eef1f4;
  --sub: #626a74;
  --line: #e1e5e9;
  --bg: #f4f5f7;
  --paper: #fff;
  --coral: #ed8a73;
  --teal: #467466;
  --warm-bg: #fff3d9;
  --header-height: 130px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-height); }
#top,#boards,#contact { scroll-margin-top: 24px; }
body { font-family: 'Pretendard','Malgun Gothic','맑은 고딕','Apple SD Gothic Neo',sans-serif; font-size: 16px; line-height: 1.75; letter-spacing: 0; word-break: keep-all; color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased; padding-top: var(--header-height); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button,input,textarea,select { font: inherit; letter-spacing: normal; }
button,a,input,textarea,select { touch-action: manipulation; }
button { cursor: pointer; }
button:disabled { opacity: .55; cursor: wait; }
a:focus-visible,button:focus-visible { outline: 2px solid #c9674f; outline-offset: 5px; }
h1,h2,h3,h4,b,strong { font-weight: 700; }
h1,h2,h3,h4 { letter-spacing: 0; line-height: 1.4; overflow-wrap: anywhere; }
.wrap { width: min(100%, 1920px); margin-inline: auto; padding-inline: clamp(40px, 4vw, 80px); }
@media(min-width:901px) { .board-page .boards>.wrap { max-width: 1200px; padding-inline: 40px; } }
header { position: fixed; inset: 0 0 auto; z-index: 50; background: #fff; box-shadow: 0 1px 0 #18202b12; }
.nav { display: grid; grid-template-columns: auto minmax(0,1fr); grid-template-areas: 'logo account' 'menu menu'; align-items: center; column-gap: 32px; padding-top: 20px; }
.logo { grid-area: logo; width: 280px; max-width: 100%; }
.logo img { width: 100%; height: auto; }
.member-actions { grid-area: account; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 10px 20px; font-size: 14px; line-height: 1.5; }
.member-actions>a { white-space: nowrap; padding-block: 8px; }
.authbox { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 14px; }
.authbox button { padding: 8px 0; border: 0; background: transparent; color: var(--ink); font-size: 14px; white-space: nowrap; }
.authbox .who { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.authbox .grade { border-radius: 5px; background: var(--bg); padding: 3px 8px; color: var(--sub); font-size: 12px; }
.menu { grid-area: menu; display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); column-gap: 20px; width: 100%; margin-top: 10px; }
.menu a { padding: 14px 0 16px; color: #343a42; font-size: 16px; font-weight: 600; text-align: center; white-space: nowrap; }
.menu a:hover { color: #b04d35; }
.hero { --hero-pad-start: 64px; --hero-pad-end: 56px; --hero-gutter: 40px; --hero-outset: max(var(--hero-gutter), calc((100vw - 1200px) / 2 + var(--hero-gutter))); background: #f1f2f3; color: var(--ink); padding: var(--hero-pad-start) 0 var(--hero-pad-end); overflow: hidden; }
.hero-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; min-height: 340px; }
.hero-photo { position: relative; min-width: 0; margin: calc(-1 * var(--hero-pad-start)) calc(-1 * var(--hero-outset)) calc(-1 * var(--hero-pad-end)) 0; align-self: stretch; overflow: hidden; border-radius: 0; background: #f1f2f3; }
.hero-photo::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,#f1f2f3 0%,rgba(241,242,243,.45) 9%,transparent 28%),linear-gradient(0deg,rgba(241,242,243,.3),transparent 28%); }
.hero-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: 0; }
.hero-photo figcaption { display: flex; justify-content: space-between; gap: 12px; margin-top: 10px; font-size: 12px; color: var(--sub); }
.hero-copy { max-width: 960px; }
.hero-eyebrow { display: block; margin-bottom: 12px; color: #656d76; font-size: 15px; font-weight: 500; }
.hero h1 { font-size: clamp(30px,3.3vw,44px); font-weight: 700; line-height: 1.3; letter-spacing: 0; word-spacing: .06em; }
.hero h1 span,.hero h1 em { display: inline-block; }
.hero h1 em { font-style: normal; color: #59626c; }
.hero-description { margin-top: 20px; max-width: 760px; color: #56606b; font-size: 15px; line-height: 1.9; }
.hero-description span { display: inline; }
.hero-engagement { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; margin-top: 22px; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; font-size: 14px; font-weight: 600; }
.hero-join { display: inline-flex; justify-content: center; align-items: center; min-width: 136px; min-height: 46px; padding: 10px 24px; border-radius: 8px; background: #f7ac66; color: #24282d; font-weight: 700; }
.hero-join:hover { background: #ee9a4d; }
.hero-about { display: inline-flex; align-items: center; gap: 20px; min-height: 44px; color: #46515e; }
.hero-bottom { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 20px; }
.hero-topics { display: flex; flex-wrap: wrap; list-style: none; gap: 8px 22px; color: #626c78; font-size: 14px; }
.hero-motto { color: #737b84; font-size: 14px; white-space: nowrap; }
.sec-label { display: block; color: var(--sub); font-size: 12px; font-weight: 500; letter-spacing: .08em; }
.latest-section { padding: 46px 0 60px; }
.latest-heading,.section-heading { margin-bottom: 24px; }
.latest-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.latest-heading h2,.section-heading h2 { margin-top: 7px; font-size: 25px; line-height: 1.5; }
.latest-heading>a { padding-block: 8px; font-size: 14px; color: var(--sub); white-space: nowrap; }
.latest-feed { display: grid; grid-template-columns: 1.1fr 1fr; gap: 36px; align-items: stretch; }
.latest-feed>.content-empty,.latest-feed>.feed-empty { grid-column: 1 / -1; }
.feed-feature { min-width: 0; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #dfe3e8; border-radius: 14px; background: #f4f5f7; }
#albumSlide { flex: 1; }
.feed-slide { display: grid; align-items: center; min-height: 350px; padding: 30px 32px 24px; }
.feed-slide.has-cover { grid-template-columns: 1fr; gap: 20px; }
.feed-copy { min-width: 0; }
.feed-meta { display: flex; align-items: center; gap: 16px; color: var(--sub); font-size: 14px; }
.feed-meta>span { border-radius: 5px; padding: 5px 10px; background: #e6e9ed; color: #3e4751; font-size: 13px; font-weight: 600; }
.feed-copy h3 { max-width: 950px; margin-top: 18px; font-size: 23px; line-height: 1.5; word-break: keep-all; }
.feed-copy p { max-width: 800px; margin-top: 12px; font-size: 16px; color: var(--sub); line-height: 1.8; overflow-wrap: anywhere; }
.feed-facts { list-style: none; margin-top: 12px; color: #46505b; font-size: 15px; line-height: 1.8; }
.feed-copy>button { margin-top: 24px; border: 0; border-radius: 8px; padding: 12px 20px; background: #252a31; color: #fff; font-size: 14px; font-weight: 600; }
.feed-cover { height: 220px; overflow: hidden; border-radius: 10px; background: #fff; }
.feed-cover img { width: 100%; height: 100%; object-fit: contain; }
.feed-bottom { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; padding: 0 32px 26px; }
.slide-dots { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.slide-dots button { width: 10px; height: 10px; border: 0; border-radius: 50%; background: #c1c7cf; padding: 0; }
.slide-dots button[aria-current=true] { width: 26px; border-radius: 8px; background: #3b424c; }
.slide-controls { display: flex; gap: 10px; align-items: center; color: var(--sub); font-size: 13px; }
.slide-controls button { width: 36px; height: 36px; border: 1px solid #cbd0d7; border-radius: 50%; color: #3b424c; background: transparent; }
.slide-controls button:last-child { width: auto; padding-inline: 12px; border-radius: 20px; font-size: 12px; }
.feed-empty { min-height: 310px; padding: 42px; display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.feed-empty h3 { font-size: 28px; }
.recent-panel { min-width: 0; padding-block: 6px; }
.recent-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.recent-heading h3 { font-size: 20px; }
.recent-heading>a { color: var(--sub); font-size: 13px; }
.recent-posts { display: grid; gap: 10px; list-style: none; }
.recent-posts button { position: relative; display: block; width: 100%; padding: 16px 42px 16px 18px; border: 0; border-radius: 8px; background: #f7f8f9; color: var(--ink); text-align: left; }
.recent-posts button:hover { background: #edf0f3; }
.recent-meta { display: flex; align-items: center; gap: 14px; margin-bottom: 6px; color: var(--sub); font-size: 12px; line-height: 1.5; }
.recent-meta>span { color: #855040; font-weight: 600; }
.recent-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 16px; font-weight: 600; line-height: 1.7; overflow-wrap: anywhere; }
.recent-arrow { position: absolute; right: 18px; top: 50%; transform: translateY(-50%); color: #929aa4; }
.boards { padding: 52px 0 64px; background: #fafafa; }
.board-nav { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.board { min-width: 0; padding: 26px; background: #fff; border: 1px solid #e2e6eb; border-radius: 12px; }
.board:hover { border-color: #9ba5b1; }
.board-number { display: flex; justify-content: space-between; align-items: center; gap: 8px; color: #78828e; font-size: 13px; }
.board-number small { padding: 3px 8px; background: #f0f2f4; border-radius: 5px; color: #66717d; font-size: 12px; }
.board b { display: block; font-size: 20px; line-height: 1.5; margin-top: 20px; }
.board p { font-size: 14px; line-height: 1.7; color: var(--sub); margin-top: 8px; }
.board-arrow { display: none; }
.contact { background: #f7ce54; padding: 48px 0 36px; }
.contact-row { display: flex; justify-content: space-between; align-items: center; gap: 36px; }
.contact h2 { margin-top: 10px; font-size: 28px; line-height: 1.65; }
.contact-actions { display: flex; gap: 12px; }
.contact-button { display: flex; justify-content: space-between; align-items: center; gap: 26px; padding: 18px 22px; background: #252a31; color: #fff; border-radius: 10px; font-size: 15px; font-weight: 600; white-space: nowrap; }
.contact-button span { font-size: 20px; }
.contact-secondary { background: #ffe59c; color: #252a31; }
.social-links { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px 24px; margin-top: 26px; font-size: 13px; }
.social-links>span { color: #665e48; }
.social-links a:hover { text-decoration: underline; text-underline-offset: 4px; }
.hero-social { justify-content: flex-start; gap: 12px 24px; margin: 0; font-size: 13px; }
.hero-social a { color: #37424f; }
.hero-social>span { color: #737d88; }
footer { padding: 36px 0; background: #fff; }
.footer-row { display: flex; justify-content: space-between; align-items: center; gap: 28px; }
.footer-logo { display: block; width: 280px; max-width: 100%; flex-shrink: 0; }
.footer-logo img { width: 100%; height: auto; }
.footer-row p { color: var(--sub); font-size: 14px; }
.footer-row small { color: var(--sub); font-size: 12px; }
.about-intro { max-width: 830px; margin: 0 0 32px; }
.about-intro h2 { margin: 12px 0 20px; font-size: 32px; line-height: 1.6; }
.about-intro p { color: var(--sub); font-size: 17px; line-height: 1.9; }
.about-practices { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.about-practices article { border-radius: 10px; padding: 26px; background: #f3f5f7; }
.about-practices article>span { color: #b3634f; font-size: 14px; }
.about-practices h3 { font-size: 22px; margin: 10px 0; }
.about-practices p { color: var(--sub); font-size: 16px; line-height: 1.85; }
.about-values { margin-top: 24px; background: #f3f5f7; padding: 26px; border-radius: 10px; }
.about-values h3 { font-size: 21px; }
.about-values ul { padding-left: 22px; margin-top: 14px; line-height: 2; }
@media(max-width:900px) {
  .hero-layout { gap: 28px; grid-template-columns: 1.2fr 1fr; }
  .hero-bottom { flex-wrap: wrap; }
  .wrap { padding-inline: 28px; }
  .nav { padding-top: 16px; }
  .logo { width: 250px; }
  .menu { column-gap: 12px; }
  .menu a { font-size: 15px; }
  .hero { --hero-pad-start: 48px; --hero-pad-end: 48px; --hero-gutter: 28px; }
  .hero h1 { font-size: 36px; }
  .hero-description { font-size: 15px; }
  .latest-feed { gap: 24px; }
  .feed-slide { padding: 26px 24px 22px; }
  .feed-bottom { padding: 0 24px 22px; }
  .feed-slide.has-cover { grid-template-columns: 1fr; }
  .feed-copy h3 { font-size: 23px; }
  .board { padding: 22px; }
  .contact-row { align-items: flex-start; flex-direction: column; gap: 24px; }
  .social-links { justify-content: flex-start; }
  .footer-row { flex-wrap: wrap; }
}
@media(max-width:600px) {
  .hero-layout { grid-template-columns: 1fr; min-height: 0; }
  .hero-photo { margin: 0 calc(-1 * var(--hero-gutter)) calc(-1 * var(--hero-pad-end)); }
  .hero-photo img { position: relative; aspect-ratio: 4 / 3; height: auto; }
  .hero-photo::after { background: linear-gradient(180deg,rgba(241,242,243,.6),transparent 22%); }
  :root { --header-height: 156px; }
  .wrap { padding-inline: 20px; }
  .nav { padding-top: 12px; column-gap: 14px; }
  .logo { width: 205px; }
  .member-actions { font-size: 12px; gap: 5px 10px; }
  .authbox { gap: 4px 9px; }
  .authbox button { font-size: 12px; padding-block: 4px; }
  .authbox .who { display: none; }
  .authbox .grade { font-size: 11px; padding: 2px 6px; }
  .menu { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 8px; margin-top: 10px; padding-bottom: 7px; }
  .menu a { padding: 8px 2px; font-size: 14px; line-height: 1.5; }
  .hero { --hero-pad-start: 36px; --hero-pad-end: 36px; --hero-gutter: 20px; }
  .hero-eyebrow { font-size: 14px; margin-bottom: 14px; }
  .hero h1 { font-size: 30px; line-height: 1.4; }
  .hero-description { margin-top: 18px; font-size: 15px; line-height: 1.85; }
  .hero-engagement { margin-top: 20px; gap: 20px; }
  .hero-actions { gap: 22px; font-size: 13px; }
  .hero-join { min-width: 122px; min-height: 44px; }
  .hero-bottom { display: block; margin-top: 20px; }
  .hero-topics { font-size: 13px; gap: 6px 17px; }
  .hero-motto { display: block; margin-top: 16px; font-size: 13px; }
  .latest-section { padding: 32px 0 40px; }
  .latest-heading { gap: 14px; align-items: flex-start; flex-direction: column; margin-bottom: 18px; }
  .latest-heading h2,.section-heading h2 { font-size: 24px; }
  .latest-heading>a { padding: 0; font-size: 13px; }
  .sec-label { font-size: 11px; }
  .latest-feed { grid-template-columns: 1fr; gap: 28px; }
  .feed-slide,.feed-slide.has-cover { padding: 26px 24px 22px; min-height: 330px; gap: 22px; }
  .feed-meta { font-size: 13px; gap: 12px; }
  .feed-meta>span { font-size: 12px; }
  .feed-copy h3 { font-size: 25px; line-height: 1.55; margin-top: 16px; }
  .feed-copy p { font-size: 15px; }
  .feed-facts { font-size: 14px; }
  .feed-copy>button { margin-top: 20px; font-size: 14px; }
  .feed-cover { height: 220px; }
  .feed-bottom { padding: 0 24px 22px; gap: 16px; flex-wrap: wrap; }
  .slide-controls { margin-left: auto; }
  .feed-empty { padding: 26px 24px; }
  .feed-empty h3 { font-size: 24px; }
  .recent-heading { margin-bottom: 14px; }
  .recent-heading h3 { font-size: 19px; }
  .recent-title { font-size: 15px; }
  .boards { padding: 36px 0 42px; }
  .board-nav { grid-template-columns: 1fr 1fr; gap: 12px; }
  .board { padding: 18px 16px; }
  .board-number { font-size: 12px; flex-wrap: wrap; gap: 6px; }
  .board-number small { font-size: 11px; padding: 2px 5px; }
  .board b { font-size: 19px; margin-top: 16px; }
  .board p { font-size: 13px; }
  .contact { padding: 34px 0 30px; }
  .contact h2 { font-size: 25px; line-height: 1.65; }
  .contact-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 10px; }
  .contact-button { padding: 16px 13px; gap: 10px; font-size: 13px; }
  .contact-button span { font-size: 17px; }
  .social-links { font-size: 12px; gap: 12px 20px; }
  .hero-social { margin: 0; gap: 10px 14px; }
  .footer-row { display: block; }
  .footer-logo { width: 260px; }
  .footer-row p { display: none; }
  .footer-row small { display: block; margin-top: 20px; font-size: 12px; }
  .about-intro h2 { font-size: 25px; }
  .about-intro p { font-size: 16px; }
  .about-practices { grid-template-columns: 1fr; }
  .about-practices article,.about-values { padding: 22px; }
}
@media(max-width:360px) {
  .wrap { padding-inline: 16px; }
  .hero { --hero-gutter: 16px; }
  .logo { width: 180px; }
  .hero h1 { font-size: 28px; }
  .board-nav { grid-template-columns: 1fr; }
  .contact-actions { grid-template-columns: 1fr; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }
.app-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; list-style:none; padding:0; margin:0; }
.app-gallery-card { min-width:0; overflow:hidden; border:1px solid #e1e4e7; border-radius:14px; background:#fff; }
.app-gallery-card[hidden] { display:none; }
.app-gallery-preview { position:relative; aspect-ratio:16/11; overflow:hidden; background:#f0f2f4; }
.app-gallery-preview iframe { position:absolute; top:0; left:0; width:200%; height:200%; border:0; transform:scale(.5); transform-origin:top left; pointer-events:none; }
.app-gallery-preview img { width:100%; height:100%; object-fit:contain; display:block; }
.app-preview-open { position:absolute; inset:0; border:0; background:transparent; cursor:pointer; }
.app-preview-open:focus-visible { outline:3px solid var(--blue); outline-offset:-4px; }
.app-preview-fallback { display:grid; place-items:center; height:100%; color:#65717d; font-size:14px; }
.app-gallery-copy { padding:23px; }
.app-gallery-copy time { font-size:12px; color:#68727c; }
.app-gallery-copy h3 { font-size:19px; line-height:1.55; margin:10px 0; letter-spacing:0; }
.app-gallery-copy h3 button { font:inherit; color:inherit; text-align:left; background:none; border:0; padding:0; cursor:pointer; }
.app-gallery-copy p { font-size:14px; line-height:1.75; color:#57636e; min-height:3.5em; margin:0 0 20px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media(max-width:1000px){.app-gallery{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:620px){.app-gallery{grid-template-columns:1fr;gap:22px;}.app-gallery-copy{padding:20px;}}
.hero-social.social-links { gap:10px 18px; align-items:center; flex-wrap:wrap; }
.hero-social>[data-social] { display:inline-flex; align-items:center; gap:7px; font-size:12px; line-height:1.5; padding:5px 0; }
.hero-social img { width:17px; height:17px; opacity:.7; }
.hero-social>a img { opacity:1; }
.hero-social>a:hover img { opacity:1; }
.hero-social>span { color:#727b85; }
.hero-social>span img { opacity:.42; }
.about-business { margin:36px 0 20px; }
.about-business h3 { font-size:20px; margin-bottom:14px; }
.about-business ul { display:flex; flex-wrap:wrap; gap:10px; padding:0; list-style:none; }
.about-business li { padding:7px 15px; background:#f0f2f3; border-radius:6px; font-size:14px; color:#535f69; }
.research-groups { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:28px; }
.research-groups>a { position:relative; padding:28px; border:1px solid #e1e5e8; border-radius:12px; color:inherit; text-decoration:none; background:#fafbfc; }
.research-groups span { color:#79828c; font-size:13px; }
.research-groups h3 { margin:20px 0 12px; font-size:21px; line-height:1.65; word-break:keep-all; }
.research-groups p { color:#67727d; font-size:14px; margin-right:14px; }
.research-groups b { display:block; margin-top:22px; text-align:right; }
.membership-guides { margin:25px 0; }
.membership-guides details { border-bottom:1px solid #dfe4e8; padding:16px 0; }
.membership-guides summary { cursor:pointer; font-size:15px; font-weight:600; }
.membership-guides img { display:block; width:100%; max-width:720px; height:auto; margin:22px auto 4px; }
@media(max-width:760px){.research-groups{grid-template-columns:1fr;}.research-groups>a{padding:22px;}.research-groups h3{font-size:20px;margin-top:12px;}}
.footer-info { text-align:right; font-size:12px; }
.footer-info nav { display:flex; justify-content:flex-end; gap:18px; margin-bottom:12px; }
.footer-info a { color:#5d6670; text-decoration:none; }
.footer-info a:hover { text-decoration:underline; }
.footer-info .footer-email { display:block; margin-bottom:8px; }
.policy-copy { max-width:800px; font-size:15px; line-height:1.95; color:#54606b; }
.policy-copy h3 { margin:28px 0 10px; color:#27313c; font-size:20px; }
.policy-copy ul { padding-left:22px; }
@media(max-width:600px){.footer-info{text-align:left;margin-top:22px;}.footer-info nav{justify-content:flex-start;}.footer-info small{line-height:1.8;}}
.board-nav .board { padding:0; overflow:hidden; position:relative; }
.board-main { display:block; color:inherit; text-decoration:none; }
.board-main:focus-visible { outline:3px solid #526679; outline-offset:-3px; }
.board-preview { aspect-ratio:16/10; position:relative; overflow:hidden; background:#eef1f4; }
.board-preview>img { width:100%; height:100%; object-fit:contain; display:block; }
.board-preview>iframe { position:absolute; inset:0; width:200%; height:200%; transform:scale(.5); transform-origin:top left; border:0; pointer-events:none; }
.board-preview-caption { position:absolute; bottom:0; left:0; right:0; padding:10px 14px; font-size:12px; background:rgba(255,255,255,.92); color:#394550; }
.board-preview-text { height:100%; display:flex; flex-direction:column; justify-content:center; padding:26px; gap:14px; }
.board-preview-text>b { font-size:20px; line-height:1.6; margin:0; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.board-preview-text>span { font-size:13px; line-height:1.75; color:#63717e; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.board-summary { padding:22px 24px 26px; position:relative; }
.board-summary>b { font-size:22px; margin-top:13px; }
.board-summary>p { font-size:14px; }
.board-summary .board-arrow { right:24px; bottom:26px; }
.preview-message { min-height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:24px; font-size:13px; line-height:1.8; color:#697680; }
.preview-message>b { font-size:18px; margin:0 0 10px; color:#485460; }
.preview-message small { display:block; margin-top:12px; }
.board-preview-controls { display:flex; justify-content:center; align-items:center; gap:20px; padding:0 24px 16px; font-size:12px; color:#77828b; }
.board-preview-controls[hidden] { display:none; }
.board-preview-controls button { border:0; background:none; padding:6px 10px; color:#3d4b56; cursor:pointer; }
.board-preview-options { text-align:right; margin-top:18px; font-size:12px; }
@media(max-width:600px){.board-nav{grid-template-columns:1fr;}.board-preview{aspect-ratio:16/9;}.board-summary{padding:20px;}.board-summary>b{font-size:21px;}}
body[data-security="checking"]>header,body[data-security="checking"]>main,body[data-security="checking"]>footer,
body[data-security="closed"]>header,body[data-security="closed"]>main,body[data-security="closed"]>footer,body[data-security="closed"]>.modal-bg { display:none!important; }
body[data-security="checking"]::before { content:'안전한 연결을 확인하고 있습니다.'; display:block; padding:25vh 24px; text-align:center; color:#62707b; font-size:15px; }
#securityNotice { max-width:640px; margin:20vh auto; padding:32px; text-align:center; }
#securityNotice h1 { font-size:26px; line-height:1.6; }
#securityNotice p { margin:20px 0; font-size:15px; color:#62707b; line-height:1.8; }
#securityNotice button { padding:12px 22px; border:1px solid #b4bcc4; border-radius:8px; background:#fff; cursor:pointer; }
.board-page .board-preview-options { display:none; }