/* 2026-10-22: one 1400px frame on every page, point color #2B2D42, no cream backgrounds, mobile fit. Loaded last. */
:root{--inbom-point:#2B2D42;--inbom-soft:#eff6fb;--inbom-depth:0 9px 27px rgba(43,45,66,.106),0 3px 8px rgba(43,45,66,.043)}

/* Header on every page: the same 1400px column as the page body and footer (an older rule held it at 1220px). */
html body>header .nav{box-sizing:border-box;width:calc(100% - 64px)!important;max-width:1400px!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
@media(max-width:760px){html body>header .nav{width:calc(100% - 28px)!important}}

/* Home: the space above the footer is white, not the dark page background. */
html body.home-design,html body.home-design #app .ph-ai-home{background:#fff!important}

/* Home community and service switch sit in the same 1400px column. */
body.home-design #app .home-neighbors{padding-left:0;padding-right:0;background:#fff}
body.home-design #app .home-neighbors-inner,body.home-design #app .service-switch-layout{box-sizing:border-box;width:calc(100% - 64px);max-width:1400px;margin-left:auto;margin-right:auto}
@media(max-width:760px){
 body.home-design #app .home-neighbors-inner,body.home-design #app .service-switch-layout{width:calc(100% - 28px)}
 body.home-design #app .home-neighbors{padding-top:36px;padding-bottom:40px}
 /* Feed and chat grow with their content instead of a fixed tall box. */
 body.home-design #app :is(.home-feed-panel,.home-chat-panel){height:auto;max-height:520px}
 body.home-design #app :is(.home-feed-list,.home-chat-log){flex:0 1 auto;max-height:340px}
 body.home-design #app .home-neighbors-grid{gap:16px}
 body.home-design #app .home-neighbors-heading h2{font-size:26px}
 /* Hero numbers: labels on one line. */
 body.home-design #app .inbom-hero-results>div{padding:0 10px}
 body.home-design #app .inbom-hero-results>div>span,body.home-design #app .inbom-hero-results .round3-result-caption{font-size:13px;letter-spacing:-.03em;white-space:nowrap}
}

/* Mobile logo: about 70% of the desktop size. */
@media(max-width:760px){
 html body>header .brand{zoom:.7}
 html body>header .nav{gap:10px}
}

/* Cookie notice: white card instead of cream. */
body .cookie-notice{background:#fff!important;border:1px solid #e3e6ec!important;box-shadow:var(--inbom-depth)!important;border-radius:16px!important}

/* 나만의 인테리어 기록실 and 관리자가 보낸 금액 안내: soft blue card with depth, like 알아두면 안심이 되는 이야기. */
body #app .record-list-page .record-notice-hero,
body #app .record-list-page .amount-notice{background:var(--inbom-soft)!important;border:0!important;border-radius:32px!important;box-shadow:var(--inbom-depth)!important}
body #app .record-list-page .amount-notices{overflow:visible}
body #app .record-list-page .amount-notice+.amount-notice{margin-top:18px}
body #app .record-list-page .amount-notice .tag{border:1px solid #c9d3df!important;color:var(--inbom-point)!important;background:#fff!important;border-radius:999px;padding:3px 10px}
body #app .record-list-page .record-notice-hero .btn{background:#fff!important;color:var(--inbom-point)!important;border:1px solid #d5dbe4!important;border-radius:999px!important;box-shadow:0 2px 6px rgba(43,45,66,.08)}
@media(max-width:760px){
 body #app .record-list-page .record-notice-hero,body #app .record-list-page .amount-notice{border-radius:24px!important}
}

/* 나의 공사 tabs: label and count centered in each tab; on phones the count sits under a one-line label. */
body #app .record-list-page .record-page-nav a{justify-content:center;align-items:center;gap:8px}
@media(max-width:760px){
 body #app .record-list-page .record-page-nav a{flex-direction:column;gap:4px;padding:9px 2px;font-size:12.5px;line-height:1.3;white-space:nowrap;letter-spacing:-.03em}
}

/* 관리자가 보낸 금액 안내 heading starts at the page edge like the other headings. */
body #app .record-list-page .amount-notices>h2{margin-left:0;margin-right:0}

/* Header on every page, admin included: exactly 80px tall (an older rule made it 90px on non-home pages). */
html body>header .nav{height:79px!important;min-height:79px!important;max-height:79px!important;padding-top:0!important;padding-bottom:0!important}

/* Admin: the same 1400px column as the header and footer. */
html body.admin-white-design #app>.page{width:calc(100% - 64px)!important;max-width:1400px!important}
@media(max-width:760px){html body.admin-white-design #app>.page{width:calc(100% - 28px)!important}}

/* Admin tables on phones: keep columns readable and scroll sideways instead of breaking words letter by letter. */
@media(max-width:760px){
 body.admin-white-design #app .table-scroll{-webkit-overflow-scrolling:touch}
 body.admin-white-design #app .table-scroll table :is(th,td){word-break:keep-all;overflow-wrap:normal}
 body.admin-white-design #app .table-scroll table:has(tr>:nth-child(4)){min-width:560px}
 body.admin-white-design #app .table-scroll table:has(tr>:nth-child(5)){min-width:720px}
 body.admin-white-design #app .table-scroll table:has(tr>:nth-child(7)){min-width:860px}
 body.admin-white-design #app .table-scroll table td :is(a,small,span){overflow-wrap:anywhere}
}