@charset "utf-8";

.p14-wrap {display:flex; flex-direction:column; min-height:100%; background:var(--card);}

/* 헤더 */
.p14-head {display:flex; align-items:center; gap:18.5px; padding:22.2px 29.5px; background:var(--card); border-bottom:1.85px solid var(--line);}
.p14-head .cancel {color:var(--body); font-size:25.8px; font-weight:500;}
.p14-head h1 {flex:1; text-align:center; color:var(--ink); font-size:29.5px; font-weight:700;}
.p14-head .done {color:#7C3AED; font-size:25.8px; font-weight:700;}

.p14-body {flex:1;}

/* 말씀 배너 */
.p14-verse {position:relative; overflow:hidden; display:flex; align-items:center; gap:22.2px; padding:33.2px; background:linear-gradient(135deg, #1E3A5F, #1A2A4A 50%, #2D1B69);}
.p14-verse .deco {position:absolute; top:-37px; right:-37px; width:147.7px; height:147.7px; background:rgba(255,255,255,0.04); border-radius:50%;}
.p14-verse .ic {position:relative; display:flex; align-items:center; justify-content:center; width:81.2px; height:81.2px; background:rgba(255,255,255,0.12); border-radius:22.2px; flex:none;}
.p14-verse .ic img {width:40.6px; height:40.6px;}
.p14-verse .tx {position:relative; display:flex; flex-direction:column; gap:4px;}
.p14-verse .tx .l {color:rgba(255,255,255,0.55); font-size:20.3px;}
.p14-verse .tx .q {color:#fff; font-size:24px; font-weight:600; line-height:1.55;}

/* 섹션 공통 */
.p14-sec {display:flex; flex-direction:column; gap:14.8px; padding:25.8px 29.5px 31.4px; background:var(--card); border-bottom:1.85px solid var(--line);}
.p14-label {color:var(--sub); font-size:20.3px; font-weight:600; letter-spacing:0.7px;}

/* 카테고리 그리드 */
.p14-cats {display:grid; grid-template-columns:1fr 1fr 1fr; gap:12.9px;}
.p14-cat {display:flex; flex-direction:column; align-items:center; gap:9.2px; padding:20.3px; background:var(--snow); border:1.85px solid var(--line); border-radius:18.5px; color:var(--body); font-size:20.3px; font-weight:600;}
.p14-cat img {width:36.9px; height:36.9px;}
.p14-cat.on {background:#F5F3FF; border-color:#7C3AED; color:#7C3AED;}

/* 제목 / 내용 입력 */
.p14-input {border:0; background:none; color:var(--ink); font-size:31.4px; font-weight:700; line-height:1.4; width:100%; resize:none; outline:none; min-height:44px;}
.p14-input::placeholder {color:var(--mute);}
.p14-editor {min-height:295px; color:var(--ink); font-size:25.8px; line-height:1.8; outline:none;}
.p14-count {color:var(--sub); font-size:20.3px; text-align:right;}

/* 공개 범위 라디오 */
.p14-radios {display:flex; flex-direction:column; gap:14.8px;}
.p14-radio {display:flex; align-items:center; gap:22.2px; padding:22.2px 27.7px; background:var(--snow); border:1.85px solid var(--line); border-radius:18.5px;}
.p14-radio.on {background:#EEF2FF; border-color:var(--navy);}
.p14-radio .rd {flex:none; width:33.2px; height:33.2px; border:3.7px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center;}
.p14-radio.on .rd {border-color:var(--navy); background:var(--navy);}
.p14-radio.on .rd::after {content:""; width:12.9px; height:12.9px; background:#fff; border-radius:50%;}
.p14-radio .tx {flex:1; min-width:0; display:flex; flex-direction:column; gap:3.7px;}
.p14-radio .tx b {color:var(--ink); font-size:24px; font-weight:600;}
.p14-radio .tx span {color:var(--sub); font-size:20.3px; font-weight:400;}
.p14-radio .ic {flex:none; display:flex; align-items:center; justify-content:center; width:59px; height:59px; border-radius:14.8px;}
.p14-radio .ic.teal {background:var(--mint);}
.p14-radio .ic.violet {background:#F5F3FF;}
.p14-radio .ic img {width:29.5px; height:29.5px;}

/* 익명 토글 */
.p14-anon {display:flex; align-items:center; gap:18.5px; padding:25.8px 29.5px; background:var(--card); border-bottom:1.85px solid var(--line);}
.p14-anon .ico {flex:none; display:flex; align-items:center; justify-content:center; width:62.8px; height:62.8px; background:#F5F3FF; border-radius:16.6px;}
.p14-anon .ico img {width:31.4px; height:31.4px;}
.p14-anon .tx {flex:1; display:flex; flex-direction:column; gap:3.7px;}
.p14-anon .tx b {color:var(--ink); font-size:24px; font-weight:600;}
.p14-anon .tx span {color:var(--sub); font-size:20.3px; font-weight:400;}
.p14-switch {flex:none; width:81.2px; height:44.3px; background:var(--mute); border-radius:22.2px; padding:3.7px; display:flex; align-items:center;}
.p14-switch .knob {width:36.9px; height:36.9px; background:#fff; border-radius:50%; box-shadow:0 1.85px 7.4px rgba(0,0,0,0.2); transition:transform .15s;}
.p14-switch.on {background:#7C3AED;}
.p14-switch.on .knob {transform:translateX(36.9px);}

/* 안내 박스 */
.p14-notice {display:flex; gap:18.5px; margin:25.8px 29.5px; padding:27.7px 31.4px; background:#F5F3FF; border:1.85px solid #DDD6FE; border-radius:18.5px;}
.p14-notice .ic {flex:none; display:flex; align-items:center; justify-content:center; width:59px; height:59px; background:#7C3AED; border-radius:18.5px;}
.p14-notice .ic img {width:31.4px; height:31.4px;}
.p14-notice p {color:#5B21B6; font-size:22.2px; line-height:1.65;}

/* 등록 버튼 */
.p14-submit {padding:22.2px 29.5px 44.3px; background:var(--card);}
.p14-submit button {width:100%; display:flex; align-items:center; justify-content:center; gap:14.8px; padding:25.8px; background:linear-gradient(135deg, #1E3A5F, #2D1B69 50%, #7C3AED); border-radius:22.2px; color:#fff; font-size:27.7px; font-weight:700;}
.p14-submit button img {width:33.2px; height:33.2px;}

/* 푸터 탭바 */
.p14-nav {display:flex; align-items:center; justify-content:space-between; padding:20px 40px; background:var(--card); border-top:1.85px solid var(--line);}
.p14-nav .tab {display:flex; flex-direction:column; align-items:center; gap:5.8px; color:var(--sub); font-size:19.2px;}
.p14-nav .tab img {width:42px; height:42px;}
.p14-nav .tab.on {color:var(--teal);}
.p14-nav .tab-fab {position:relative; align-self:stretch; width:96px;}
.p14-nav .tab-fab .fab {position:absolute; left:50%; top:0; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; width:96px; height:96px; border-radius:50%; background:linear-gradient(135deg, #0D9488, #1E3A5F); border:5px solid var(--card); box-shadow:0 10px 24px rgba(13,148,136,0.4);}
.p14-nav .tab-fab .fab img {width:48px; height:48px;}
