/* ===== 言葉の鏡 — スタイルシート ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#1a1714;--ink2:#4a4540;--ink3:#8a8480;
  --paper:#f7f4ef;--paper2:#eeebe4;--paper3:#e4e0d8;
  --acc:#8b4513;--accl:#c4854a;--accf:#f2e8df;
}
body{font-family:'Zen Kaku Gothic New',sans-serif;background:var(--paper);color:var(--ink);min-height:100vh;font-size:15px;line-height:1.7}

/* ===== ヘッダー ===== */
header{border-bottom:1px solid var(--paper3);padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;background:var(--paper);position:sticky;top:0;z-index:100}
.logo{font-family:'Noto Serif JP',serif;font-size:20px;font-weight:500;color:var(--ink);letter-spacing:.1em;text-decoration:none}
.logo span{color:var(--acc)}
.hsub{font-size:11px;color:var(--ink3);letter-spacing:.1em}
.header-right{display:flex;align-items:center;gap:1rem}
.header-link{font-size:12px;color:var(--ink3);text-decoration:none;letter-spacing:.04em;padding:4px 10px;border:1px solid var(--paper3);border-radius:2px;transition:all .15s}
.header-link:hover{border-color:var(--acc);color:var(--acc)}

/* ===== ヒーロー ===== */
.hero{padding:2.5rem 2rem 1.5rem;max-width:740px;margin:0 auto;text-align:center}
.hero-eye{font-size:11px;color:var(--ink3);letter-spacing:.2em;margin-bottom:.75rem}
.sw{position:relative;margin-bottom:1rem}
.si{width:100%;padding:.9rem 5.5rem .9rem 1.25rem;font-family:'Noto Serif JP',serif;font-size:20px;background:#fff;border:1px solid var(--paper3);border-bottom:2px solid var(--acc);border-radius:0;color:var(--ink);outline:none}
.si::placeholder{color:var(--ink3);font-size:16px}
.sbtn{position:absolute;right:0;top:0;bottom:0;padding:0 1.25rem;background:var(--acc);color:#fff;border:none;font-family:'Zen Kaku Gothic New',sans-serif;font-size:13px;cursor:pointer;transition:background .15s}
.sbtn:hover{background:var(--accl)}
.genre-row{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:.6rem}
.gl{font-size:11px;color:var(--ink3);padding:4px 0}
.gbtn{font-size:12px;padding:4px 11px;border-radius:2px;border:1px solid var(--paper3);background:#fff;color:var(--ink2);cursor:pointer;transition:all .15s;font-family:'Zen Kaku Gothic New',sans-serif}
.gbtn:hover{border-color:var(--acc);color:var(--acc)}
.gbtn.active{background:var(--acc);color:#fff;border-color:var(--acc)}
.qrow{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.qw{font-family:'Noto Serif JP',serif;font-size:13px;color:var(--ink3);cursor:pointer;padding:2px 5px;border-bottom:1px dashed var(--paper3);transition:all .15s}
.qw:hover{color:var(--acc);border-bottom-color:var(--acc)}
.qdiv{color:var(--paper3);padding:0 4px}

/* ===== メイン ===== */
main{max-width:960px;margin:0 auto;padding:0 2rem 4rem}
.loading{display:none;padding:2.5rem;text-align:center;color:var(--ink3);font-size:13px;letter-spacing:.08em}
.loading.show{display:block}
.dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--acc);margin:0 3px;animation:p 1.2s ease-in-out infinite}
.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}
@keyframes p{0%,80%,100%{opacity:.15}40%{opacity:1}}

/* ===== 結果ヘッダー ===== */
.rh{display:flex;align-items:baseline;gap:.75rem;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:1px solid var(--paper3);flex-wrap:wrap}
.rw{font-family:'Noto Serif JP',serif;font-size:24px;font-weight:500}
.rm{font-size:12px;color:var(--ink3)}
.rbadge{font-size:11px;padding:2px 9px;border-radius:2px;background:var(--accf);color:var(--acc);border:1px solid var(--accl)}
.sh{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--ink3);margin-bottom:.9rem;display:flex;align-items:center;gap:.6rem}
.sh::after{content:'';flex:1;height:1px;background:var(--paper3)}

/* ===== ビフォーアフター ===== */
.ba-section{margin-bottom:2.5rem}
.ba-grid{display:flex;flex-direction:column;gap:8px}
.ba-card{background:#fff;border:1px solid var(--paper3);border-left:3px solid transparent;padding:1rem 1.25rem;transition:border-color .15s}
.ba-card:hover{border-left-color:var(--acc)}
.ba-head{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px;align-items:center}
.sit-tag{font-size:10px;padding:2px 8px;border-radius:2px;font-weight:500}
.ba-body{display:grid;grid-template-columns:1fr 28px 1fr;gap:.75rem;align-items:center}
.ba-b{font-size:13px;color:var(--ink3);line-height:1.65}
.ba-arrow{font-size:15px;color:var(--acc);text-align:center}
.ba-a{font-family:'Noto Serif JP',serif;font-size:14px;color:var(--ink);line-height:1.75}
.ba-note{font-size:11px;color:var(--ink3);margin-top:8px;padding-top:6px;border-top:1px solid var(--paper2);display:flex;align-items:baseline;gap:4px}
.ba-note::before{content:'💡';font-style:normal}
.ba-copy{margin-left:auto;font-size:10px;padding:2px 8px;border:1px solid var(--paper3);background:transparent;color:var(--ink3);cursor:pointer;border-radius:2px;transition:all .15s;font-family:'Zen Kaku Gothic New',sans-serif}
.ba-copy:hover{border-color:var(--acc);color:var(--acc)}

/* ===== ニュアンスカード ===== */
.nc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:8px;margin-bottom:.75rem}
.nc{background:#fff;border:1px solid var(--paper3);border-top:3px solid transparent;padding:.85rem 1rem 1rem;cursor:pointer;transition:all .18s}
.nc:hover,.nc.sel{border-top-color:var(--acc);background:var(--accf)}
.nc-w{font-family:'Noto Serif JP',serif;font-size:18px;font-weight:500;margin-bottom:1px}
.nc-k{font-size:11px;color:var(--ink3);letter-spacing:.07em;margin-bottom:7px}
.brow{display:flex;align-items:center;gap:5px;margin-bottom:3px}
.blabel{font-size:9px;color:var(--ink3);min-width:28px}
.bbar{flex:1;height:3px;background:var(--paper3);border-radius:2px;overflow:hidden}
.bfill{height:100%;background:var(--acc);border-radius:2px}
.nc-n{font-size:11px;color:var(--ink2);line-height:1.5;margin:7px 0}
.tags{display:flex;flex-wrap:wrap;gap:3px}
.tag{font-size:10px;padding:2px 7px;border-radius:2px;font-weight:500}
.tp{background:#EEEDFE;color:#3C3489}.tc{background:#E1F5EE;color:#085041}
.tm{background:#E6F1FB;color:#0C447C}.ts{background:#FAEEDA;color:#633806}
.gr{background:#f8e8ee;color:#7a1a3a}.gf{background:#e8f0f8;color:#1a3a5c}
.gh{background:#e8e8e8;color:#2a2a2a}.ghi{background:#f4f0e4;color:#4a3a1a}
.gn{background:#e8f4ec;color:#1a4a2a}
.uc{font-size:10px;padding:2px 6px;border-radius:2px;background:var(--paper2);color:var(--ink3)}

/* ===== 詳細パネル ===== */
.detail{background:#fff;border:1px solid var(--paper3);border-left:3px solid var(--acc);padding:1.1rem 1.4rem;margin-bottom:1.5rem;display:none}
.detail.show{display:block;animation:fi .15s ease}
@keyframes fi{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
.dw{font-family:'Noto Serif JP',serif;font-size:22px;font-weight:500;margin-bottom:2px}
.dk{font-size:11px;color:var(--ink3);letter-spacing:.07em;margin-bottom:.6rem}
.dd{font-size:13px;color:var(--ink2);line-height:1.85;margin-bottom:.6rem}
.ds{font-family:'Noto Serif JP',serif;font-size:13px;color:var(--ink3);border-left:2px solid var(--paper3);padding-left:.85rem;line-height:1.85;font-style:italic}
.dacts{display:flex;gap:7px;margin-top:.75rem}
.cbtn{font-size:12px;padding:4px 11px;border:1px solid var(--paper3);background:#fff;color:var(--ink2);cursor:pointer;border-radius:2px;transition:all .15s;font-family:'Zen Kaku Gothic New',sans-serif}
.cbtn:hover{border-color:var(--acc);color:var(--acc)}
.cbtn.ok{border-color:var(--acc);color:var(--acc)}

/* ===== 情景表現 ===== */
.expr-list{margin-bottom:2rem}
.expr{font-family:'Noto Serif JP',serif;font-size:14px;color:var(--ink2);padding:.6rem .9rem .6rem 1rem;border-left:2px solid var(--paper3);margin-bottom:5px;background:#fff;line-height:1.7;transition:border-color .15s}
.expr:hover{border-left-color:var(--acc)}

/* ===== UGC投稿セクション ===== */
.ugc-section{margin-top:2.5rem;border-top:1px solid var(--paper3);padding-top:1.5rem}
.ugc-preview{display:flex;flex-direction:column;gap:6px;margin-bottom:.75rem}
.ugc-card{background:#fff;border:1px solid var(--paper3);border-left:3px solid var(--paper3);padding:.85rem 1.1rem;transition:border-color .15s}
.ugc-card:hover{border-left-color:var(--accl)}
.ugc-word{font-family:'Noto Serif JP',serif;font-size:16px;font-weight:500;margin-bottom:3px}
.ugc-meta{font-size:11px;color:var(--ink3);margin-bottom:5px}
.ugc-scene{font-family:'Noto Serif JP',serif;font-size:13px;color:var(--ink2);font-style:italic}
.ugc-more{font-size:12px;color:var(--acc);cursor:pointer;text-decoration:none;display:inline-block;margin-top:.5rem;letter-spacing:.04em}
.ugc-more:hover{text-decoration:underline}
.ugc-empty{font-size:13px;color:var(--ink3);padding:.75rem 0}

/* ===== DB一致バー ===== */
.db-match{background:var(--accf);border:1px solid var(--paper3);padding:.65rem 1.1rem;margin-bottom:7px;display:flex;align-items:center;gap:1rem;cursor:pointer;border-left:3px solid var(--acc)}
.db-match:hover{background:#eddfd0}
.dm-w{font-family:'Noto Serif JP',serif;font-size:17px;font-weight:500}
.dm-m{font-size:12px;color:var(--ink2)}
.ai-bar{background:#fff;border-left:3px solid var(--acc);padding:.6rem .9rem;margin-bottom:1.25rem;font-size:13px;color:var(--ink2)}
.ai-bar small{display:block;font-size:10px;color:var(--ink3);letter-spacing:.06em;margin-bottom:2px}

/* ===== メモリ ===== */
.mem-chip{font-family:'Noto Serif JP',serif;font-size:12px;padding:3px 10px;border-radius:2px;background:var(--paper2);border:1px solid var(--paper3);color:var(--ink2);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.mem-chip:hover{border-color:var(--acc);color:var(--acc)}
.mem-del{font-size:10px;color:var(--ink3);padding:0 2px}
.mem-del:hover{color:#c0392b}
.mem-label{font-size:10px;color:var(--ink3);white-space:nowrap;letter-spacing:.06em}

/* ===== 投稿フォーム（submit.html）===== */
.form-wrap{max-width:600px;margin:3rem auto;padding:0 2rem 4rem}
.form-title{font-family:'Noto Serif JP',serif;font-size:22px;font-weight:500;margin-bottom:.5rem}
.form-sub{font-size:13px;color:var(--ink3);margin-bottom:2rem;line-height:1.8}
.frow{margin-bottom:1.25rem}
.flabel{font-size:12px;color:var(--ink2);margin-bottom:5px;display:block;letter-spacing:.04em}
.flabel span{color:#c0392b;margin-left:2px}
.finput,.fselect,.ftextarea{width:100%;padding:.7rem .9rem;font-family:'Zen Kaku Gothic New',sans-serif;font-size:14px;border:1px solid var(--paper3);background:#fff;color:var(--ink);outline:none;border-radius:0;transition:border-color .15s}
.finput:focus,.fselect:focus,.ftextarea:focus{border-color:var(--acc)}
.ftextarea{resize:vertical;min-height:80px;line-height:1.7}
.fcheck{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--ink2);line-height:1.6;cursor:pointer}
.fcheck input{margin-top:3px;accent-color:var(--acc)}
.fsubmit{width:100%;padding:.85rem;background:var(--acc);color:#fff;border:none;font-family:'Zen Kaku Gothic New',sans-serif;font-size:15px;cursor:pointer;letter-spacing:.08em;transition:background .15s;margin-top:.5rem}
.fsubmit:hover{background:var(--accl)}
.fsubmit:disabled{background:var(--paper3);cursor:not-allowed}
.success-msg{background:#E1F5EE;border:1px solid #085041;color:#085041;padding:1rem 1.25rem;font-size:14px;margin-top:1rem;display:none}
.error-msg{background:#FCEBEB;border:1px solid #791F1F;color:#791F1F;padding:1rem 1.25rem;font-size:14px;margin-top:1rem;display:none}
.char-count{font-size:11px;color:var(--ink3);text-align:right;margin-top:3px}

/* ===== 管理画面（admin.html）===== */
.admin-wrap{max-width:800px;margin:0 auto;padding:2rem}
.admin-title{font-family:'Noto Serif JP',serif;font-size:20px;font-weight:500;margin-bottom:1.5rem}
.login-box{max-width:360px;margin:4rem auto;background:#fff;border:1px solid var(--paper3);border-top:3px solid var(--acc);padding:2rem}
.admin-tabs{display:flex;gap:0;border-bottom:1px solid var(--paper3);margin-bottom:1.5rem}
.admin-tab{font-size:13px;padding:8px 18px;border:none;background:none;color:var(--ink3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s;font-family:'Zen Kaku Gothic New',sans-serif}
.admin-tab.active{color:var(--ink);border-bottom-color:var(--acc)}
.admin-card{background:#fff;border:1px solid var(--paper3);padding:1.1rem 1.25rem;margin-bottom:10px}
.admin-card-word{font-family:'Noto Serif JP',serif;font-size:18px;font-weight:500;margin-bottom:3px}
.admin-card-meta{font-size:11px;color:var(--ink3);margin-bottom:8px}
.admin-card-body{font-size:13px;color:var(--ink2);line-height:1.7;margin-bottom:10px}
.admin-acts{display:flex;gap:8px}
.approve-btn{padding:6px 18px;background:var(--acc);color:#fff;border:none;font-size:13px;cursor:pointer;border-radius:2px;font-family:'Zen Kaku Gothic New',sans-serif;transition:background .15s}
.approve-btn:hover{background:var(--accl)}
.reject-btn{padding:6px 18px;background:#fff;color:#791F1F;border:1px solid #791F1F;font-size:13px;cursor:pointer;border-radius:2px;font-family:'Zen Kaku Gothic New',sans-serif;transition:all .15s}
.reject-btn:hover{background:#FCEBEB}
.badge-pending{font-size:11px;padding:2px 9px;border-radius:2px;background:#FAEEDA;color:#633806;font-weight:500}
.badge-approved{font-size:11px;padding:2px 9px;border-radius:2px;background:#E1F5EE;color:#085041;font-weight:500}
.admin-empty{text-align:center;padding:3rem;color:var(--ink3);font-size:13px}
.logout-btn{font-size:12px;padding:4px 12px;border:1px solid var(--paper3);background:#fff;color:var(--ink3);cursor:pointer;border-radius:2px;font-family:'Zen Kaku Gothic New',sans-serif}
.logout-btn:hover{border-color:var(--acc);color:var(--acc)}

/* ===== プライバシーポリシー ===== */
.privacy-wrap{max-width:680px;margin:3rem auto;padding:0 2rem 4rem}
.privacy-wrap h1{font-family:'Noto Serif JP',serif;font-size:22px;font-weight:500;margin-bottom:.5rem}
.privacy-wrap h2{font-family:'Noto Serif JP',serif;font-size:16px;font-weight:500;margin:2rem 0 .75rem;padding-bottom:.4rem;border-bottom:1px solid var(--paper3)}
.privacy-wrap p{font-size:14px;color:var(--ink2);line-height:1.9;margin-bottom:.75rem}
.privacy-wrap ul{font-size:14px;color:var(--ink2);line-height:1.9;padding-left:1.5rem;margin-bottom:.75rem}

/* ===== 共通 ===== */
.empty{text-align:center;padding:4rem 2rem;color:var(--ink3)}
.empty-icon{font-family:'Noto Serif JP',serif;font-size:36px;opacity:.2;margin-bottom:.75rem}
.empty-text{font-size:13px;letter-spacing:.08em;line-height:2.2}
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);background:var(--acc);color:#fff;padding:.5rem 1.25rem;border-radius:2px;font-size:13px;letter-spacing:.06em;z-index:999;animation:fi .2s ease;white-space:nowrap}

/* ===== タブナビ ===== */
.tab-link{flex:1;text-align:center;font-size:13px;color:var(--ink3);text-decoration:none;padding:.6rem .25rem;border-right:0.5px solid var(--paper3);border-bottom:2px solid transparent;transition:all .15s;white-space:nowrap;display:block;background:#fff}
.tab-link:last-child{border-right:none}
.tab-link:hover{color:var(--acc);background:var(--accf)}
.tab-link.active{color:var(--acc);border-bottom:2px solid var(--acc);background:var(--paper)}

@media(max-width:600px){
  header{padding:.85rem 1rem}
  .hero{padding:1.75rem 1rem 1.25rem}
  main,.form-wrap,.admin-wrap,.privacy-wrap{padding-left:1rem;padding-right:1rem}
  .ba-body{grid-template-columns:1fr;gap:.4rem}
  .ba-arrow{display:none}
  .nc-grid{grid-template-columns:1fr 1fr}
  .si{font-size:17px}
}