/* 검정 틀 (대표 결정 2026-10-12, 설계서 docs/frame-design-20261012.html · A-1 한 줄 검정 머리 · B-1 폰 위·아래 검정 · C-1 노랑 기본안)
   색 이름표는 여기서만 정한다. 다른 CSS 의 갈색·살색 값은 ops/frame-codemod.mjs 가 var(--fr-*) 로 바꿔 두었다.
   이 파일은 모든 CSS 다음에 불러온다. 이 파일과 codemod 를 되돌리면 이전 색으로 돌아간다. */
:root{
 --fr-bg:#F5F5F4;--fr-surface:#FFFFFF;--fr-subtle:#F0F0EF;--fr-line:#E4E4E2;--fr-line-strong:#C9C9C6;
 --fr-t1:#141414;--fr-t2:#454545;--fr-t3:#767676;--fr-t4:#A6A6A6;
 --fr-frame:#161616;--fr-frame-2:#202020;--fr-frame-3:#2A2A2A;--fr-frame-line:#333333;
 --fr-on-frame:#FFFFFF;--fr-on-frame-2:#BDBDBD;--fr-on-frame-3:#8C8C8C;
 --fr-yellow:#FFD466;--fr-yellow-press:#F5C343;--fr-ok:#1C7A3D;--fr-ok-bg:#E8F5EC;--fr-danger:#C0281C;--fr-danger-bg:#FCEDEB;
 --fr-shadow:0 1px 2px rgba(0,0,0,.05),0 0 0 1px rgba(0,0,0,.045);
 --v3-grid:transparent;
}

/* ── 바탕: 모눈 무늬 없앰, 단색 ── */
html[data-palette] body,html body.design-account,body{background-color:var(--fr-bg)!important;background-image:none!important}

/* ── 머리: 지금 모양 그대로, 색만 검정(대표 수정 2026-10-12: 메뉴는 원래 자리) ── */
html[data-palette] header.topbar{background:var(--fr-frame)!important;border-bottom:0!important;box-shadow:none!important}
html[data-palette] header.topbar .top-actions .avatar,html[data-palette] header.topbar .top-actions .avatar *{background:rgba(255,255,255,.10)!important;color:var(--fr-on-frame)!important;border-color:transparent!important;box-shadow:none!important}
html[data-palette] header.topbar .top-actions .avatar:hover{background:rgba(255,255,255,.16)!important}
html[data-palette] header.topbar .access-login,html[data-palette] header.topbar .access-login *{background:var(--fr-yellow)!important;color:var(--fr-t1)!important;border-color:var(--fr-yellow)!important;box-shadow:none!important}
html[data-palette] header.topbar .access-login:active{background:var(--fr-yellow-press)!important}

/* ── 폰: 아래 탭 검정 ── */
html[data-palette] nav.mobile-nav{background:var(--fr-frame)!important;border-top:1px solid var(--fr-frame)!important;box-shadow:none!important}
html[data-palette] nav.mobile-nav a{color:var(--fr-on-frame-3)!important;background:transparent!important}
html[data-palette] nav.mobile-nav a svg{color:inherit!important;stroke:currentColor}
html[data-palette] nav.mobile-nav a :is(span,small,b,em){color:inherit!important}
html[data-palette] nav.mobile-nav a:is(.active,[aria-current="page"]){color:var(--fr-yellow)!important;font-weight:800}
html[data-palette] nav.mobile-nav a:is(.active,[aria-current="page"])::before{background:var(--fr-yellow)!important}

/* ── 바닥글: 검정으로 틀을 닫음 ── */
html[data-palette] footer.page-footer,html[data-palette] footer.footer{background:var(--fr-frame)!important;color:var(--fr-on-frame-3)!important;border-top:0!important}
html[data-palette] footer.page-footer :is(p,small,span,div){color:var(--fr-on-frame-3)!important}
html[data-palette] footer.page-footer :is(strong,b){color:var(--fr-on-frame)!important}
html[data-palette] footer.page-footer .brand-wordmark{mix-blend-mode:normal!important}
html[data-palette] footer.page-footer{width:auto!important;max-width:none!important;margin-left:0!important;margin-right:0!important;border-radius:0!important;padding-left:max(24px,calc((100% - 1336px)/2))!important;padding-right:max(24px,calc((100% - 1336px)/2))!important}
html[data-palette] footer.page-footer a{color:var(--fr-on-frame)!important}

/* ── 우측 칸: 검정 카드는 틀 카드색, 광고는 흰 카드 ── */
html[data-palette] .right-rail :is(.v3-starcard,#deadline-calendar,.deadline-calendar){background:var(--fr-frame-2)!important;border:0!important;box-shadow:none!important}
html[data-palette] .right-rail .v3-starcard :is(b,.v3-star-count,[class*="count"]){color:var(--fr-yellow)}
html.v3-rail-open[data-palette] .right-rail{background:var(--fr-bg)!important;background-image:none!important}

/* ── 밝은 면: 카드는 선 대신 옅은 그림자, 위쪽 갈색 줄 없앰 ── */
html[data-palette] #main :is(.notice-card,.adgrid-card,.detail-card){border:0!important;border-top:0!important;box-shadow:var(--fr-shadow)!important;background:var(--fr-surface)!important}
html[data-palette] #main .notice-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.05)!important}
html[data-palette] #main .notice-card:has(.save-button.saved){background:var(--fr-t1)!important}

/* ── 버튼(C-1): 밝은 면 주 버튼 = 검정, 노랑은 틀 위 로그인·별만 ── */
html[data-palette] #main :is(a.primary,button.primary){background:var(--fr-t1)!important;color:#fff!important;border-color:var(--fr-t1)!important}
html[data-palette] #main :is(a.primary,button.primary):hover{background:#000!important}
html[data-palette] #main :is(a.secondary,button.secondary){background:var(--fr-surface)!important;color:var(--fr-t1)!important;border-color:var(--fr-line-strong)!important}
html[data-palette] #main form button[type="submit"]{background:var(--fr-t1)!important;color:#fff!important;border-color:var(--fr-t1)!important}
html[data-palette] :is(a,button,input,select,textarea):focus-visible{outline:2px solid var(--fr-yellow)!important;outline-offset:2px;box-shadow:0 0 0 4px rgba(0,0,0,.6)}

/* ── 칩·꼬리표: 테두리 없는 옅은 면, 고른 칩 = 검정 ── */
html[data-palette] #main :is(.category,.cat){border-color:transparent!important}
html[data-palette] #main :is(.category.selected,.category[aria-pressed="true"],.category.active){background:var(--fr-t1)!important;color:#fff!important}
html[data-palette] #main .card-category{background:var(--fr-subtle)!important;color:var(--fr-t2)!important}

/* ── 파스텔 색면 정리: 관심 공고 안내 상자, 달력 상태 칩은 흰 면 + 점 ── */
html[data-palette] #main :is(.trust-box,.rail-note,.prep-note,.d26-note){background:var(--fr-surface)!important;border:1px solid var(--fr-line)!important}
html[data-palette] #main .v3-cal [class*="v3-st-"]:not(.v3-st-none){background:var(--fr-surface)!important;color:var(--fr-t1)!important;border:1px solid var(--fr-line)!important}

/* ── 로그인·계정 화면(account.html): 같은 검정 머리 ── */
body.design-account header.account-topbar{background:var(--fr-frame)!important;border-bottom:0!important;box-shadow:none!important}
body.design-account header.account-topbar .account-top-link{background:rgba(255,255,255,.10)!important;color:var(--fr-on-frame)!important;border-color:transparent!important;box-shadow:none!important}
body.design-account header.account-topbar .account-top-link:hover{background:rgba(255,255,255,.16)!important}
body.design-account header.account-topbar .account-top-link :is(*,svg){color:inherit!important;stroke:currentColor}
body.design-account header.account-topbar .account-top-link::before,body.design-account header.account-topbar .account-top-link::after{color:inherit!important;border-color:currentColor!important}
