/* npc公式サイトの配色と、お店の世界観をノートへ反映 */
:root{--ink:#29271f;--muted:#756f60;--blue:#826519;--line:#ded6c7;--paper:#fffdf8;--back:#f5f0e8;--accent:#d2bd7a;--light:#f0e7d2}
body{background:var(--back);color:var(--ink)}
.demo-bar{background:#342f24;color:#e5decc;border-bottom:1px solid #5a5036}.demo-bar span{color:#d4ba6a}
.sidebar{background:#1a1814;border-color:#52432a;padding-top:34px;color:#eee6d7}
.brand{flex-direction:column;align-items:flex-start;gap:9px;padding-left:12px}.brand img{width:89px;height:auto;display:block}.brand>span{font-size:13px!important;border:0!important;padding:0!important;color:#dbcaa4;letter-spacing:.12em}
.client{border-top:1px solid #494033;margin-top:29px;padding-top:25px}.client .avatar{background:#3e3729;color:#dfc992;border-color:#685936}.client strong{color:#f1eadd}.client small{color:#a9a08f}
.nav{color:#bfb6a3;border-radius:3px;padding-top:13px;padding-bottom:13px}.nav.active{background:#403722;color:#f3dfa7;box-shadow:inset 2px 0 #c5a650}.nav:hover{background:#302b21;color:#f1e5c9}.count{color:#a99b7a}
.side-bottom{padding-top:45px}.guide-mark{background:transparent;color:#c9ab54;border:1px solid #7d6937;border-radius:2px;font-family:Georgia,serif;font-size:26px}.guide small{color:#a69b87}.guide strong{color:#e3d8bd}.side-bottom p{color:#a99f8b}.private{color:#aa9d7e}
.topbar{background:#faf7f0;border-bottom-color:#e1d8c5;color:#8a7d65}.topbar .avatar{background:#eee6d7;border-color:#dcd0b9;color:#8e7140}.sample{color:#8a7d65}
main{padding-top:31px}.eyebrow{color:#947b3d;letter-spacing:.12em}.heading{margin-bottom:25px}h1{font-weight:650;letter-spacing:.035em}
body[data-view="home"] .heading{position:relative;isolation:isolate;overflow:hidden;min-height:206px;margin-bottom:25px;background:#26281d url('assets/npc-forest.webp') right 48%/cover no-repeat;padding:34px 32px;border:1px solid #6c6547;border-radius:3px;align-items:center}
body[data-view="home"] .heading:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#1a1c15f2 0%,#1a1c15d9 45%,#17191161 76%,#17191122 100%)}
body[data-view="home"] .heading:after{content:"";position:absolute;inset:7px;border:1px solid #cdb97a38;pointer-events:none}
body[data-view="home"] .heading .eyebrow{color:#dfcb8f;font-size:12px;letter-spacing:.14em}
body[data-view="home"] h1{color:#fff9ed;font-size:29px;margin:12px 0 10px;text-shadow:0 2px 8px #0004}
body[data-view="home"] .intro{color:#d8d4c4;max-width:390px;font-size:13px;line-height:1.9}
body[data-view="home"] .update{position:absolute;right:21px;bottom:17px;color:#dbd0af;font-size:10px;padding:3px 8px;background:#15170f80}
.search{background:#fffdf8;border-color:#cfc1a0;box-shadow:0 3px 8px #41351a06;border-radius:4px;margin-bottom:29px}.search input::placeholder{color:#96896e}.search svg{color:#8b6914}.search:focus-within{border-color:#9d7b25;box-shadow:0 0 0 3px #98751b14}.search kbd{border-color:#e1d6bf;color:#9c8b65}
.section-title h2{font-size:18px;letter-spacing:.05em}.text-link{color:#7d6222;text-decoration-color:#bda774}
.latest{background:#fffdf8;border-color:#d9cdb5;border-radius:4px;box-shadow:0 4px 12px #52402204}.latest-main{border-top:3px solid #9e7f32;padding:26px 28px}.latest h3{font-size:22px;font-weight:650;line-height:1.8}.latest p{color:#7a705e}.date-line{color:#8a7d65}.pill{background:#eee5d3;color:#866b32;border-radius:2px}.tag{background:#fcf9f1;border-color:#ded2b7;border-radius:2px;color:#87774f}
.btn{background:#8b6914;border-color:#8b6914;border-radius:3px;font-size:14px}.btn:hover{background:#6b5110;border-color:#6b5110}.btn.secondary{color:#725916;border-color:#cbb785;background:#fffdf8}.btn.secondary:hover{background:#f4ecd9}
.next{background:#eeecdf;border-left-color:#dcd7c0;border-top-color:#92966b}.next-label{color:#697049}.next p{color:#7f806a}.next h4{color:#50543a}.check-line{color:#5f6747}.check-line input{accent-color:#797847}
.filters{gap:8px}.filter{background:#fffdf8;border-color:#dcd0b7;border-radius:3px;color:#7f7154;font-size:13px}.filter.selected{background:#3d392b;border-color:#3d392b;color:#f6eaca}
.topic{border-color:#e0d5bf;background:#fffdf8;border-radius:4px;padding:18px}.topic:hover{border-color:#b8a16a;box-shadow:0 4px 12px #715a1910}.topic-title{font-size:15px}.topic-meta{color:#958568}.topic-chevron{color:#af9b70}.topic-icon{border:1px solid #e6d9bb;border-radius:3px;background:#f3eddb;color:#9a7b33}.topic-icon.text{background:#eee9df;color:#8b7860;border-color:#ddd3bf}.topic-icon.safe{background:#edf0e1;color:#7b8560;border-color:#d8deca}.topic-icon.doc{background:#f4e9d9;color:#a4834c;border-color:#e4d1ad}
.question-card{border-color:#dbcea9;background:#eae2cc;border-radius:4px;position:relative;padding-top:28px}.question-card:before{content:"";position:absolute;top:0;left:22px;width:28px;height:4px;background:#a68a43}.question-card h3{color:#514730}.question-card p{color:#857552}.question-card>svg{color:#9b7a2d}.question-card .btn{background:#fbf8ee}.footnote{color:#948569}
footer{color:#9b8e73;font-size:11px;gap:20px;align-items:center}footer>span{font-size:10px}footer b{font-family:Georgia,serif;color:#a17e2e;letter-spacing:-1px;font-size:25px;margin-left:12px}
dialog{background:#fffdf8;border-color:#c8b78d;border-radius:5px;box-shadow:0 25px 80px #19160d40}dialog::backdrop{background:#211e167d}.dialog-top{background:#faf6ea;border-color:#dfd3b9}.icon-button:hover{background:#eee4cc}#detailBody h2{color:#3c3525}#detailBody p,#detailBody li{font-size:15px}.answer{background:#f1ead7;border-color:#a18437}.answer strong{color:#8b6c24}.prompt{background:#f7f3e9;border-color:#e2d7c1;border-radius:3px}.history{border-color:#d9c99f}.history small{color:#a18a53}.document,.meeting-card,.form-wrap,.pending-item{background:#fffdf8;border-color:#ddd1b8;border-radius:4px}.pending-item{border-left-color:#a39652}.empty{background:#fffdf8;border-color:#d3c39e}.form-wrap textarea{background:#fffefb;border-color:#d2c19b;border-radius:3px}.form-wrap textarea:focus{outline-color:#a88b45}.result-count,.plain-label{color:#8a7958}#toast{background:#3c3524;border:1px solid #9a8247;border-radius:3px}
@media(min-width:1550px){body[data-view="home"] .heading{min-height:221px;padding:40px}}
@media(max-width:1150px){.brand{padding-left:9px}.brand img{width:79px}.latest-main{padding:23px}body[data-view="home"] h1{font-size:25px}body[data-view="home"] .heading{padding:28px;min-height:190px}.topic-title{font-size:14px}}
@media(max-width:900px){.next{border-top-color:#d7d4bc}.brand img{width:74px}}
@media(max-width:640px){.sidebar{padding:17px 20px 0}.brand{flex-direction:row;align-items:center;gap:19px;padding:0}.brand img{width:68px}.brand>span{font-size:13px!important;border-left:1px solid #645331!important;padding-left:17px!important}.nav.active{background:transparent;color:#e4ca82;border-bottom-color:#c7a657;box-shadow:none}.nav:hover{background:none}.topbar{background:#eee7d9}main{padding-top:22px}body[data-view="home"] .heading{min-height:203px;margin-bottom:21px;padding:25px 21px;background-position:63% center}body[data-view="home"] .heading:before{background:linear-gradient(90deg,#1b1d14e8,#1b1d14a3)}body[data-view="home"] h1{font-size:23px;line-height:1.7;margin-top:10px}body[data-view="home"] .heading .eyebrow{font-size:10px}body[data-view="home"] .intro{font-size:12px;line-height:1.9}body[data-view="home"] .update{display:none}.latest h3{font-size:19px}.topic{padding:15px 12px}.topic-title{font-size:14px}.topic-meta{font-size:11px}.filters{gap:6px}.filter{font-size:12px;padding:7px 9px}.btn{font-size:13px}footer{display:block;line-height:2}footer>span{display:block;margin-top:3px}footer b{font-size:22px}.section-title h2{font-size:16px}}
/* 強調ラインの端は丸めず、直線のまま見せる */
.nav,.latest,.latest-main,.next,.question-card,.answer,.pending-item,.history{border-radius:0}
/* 小文字の字面が、枠の上下左右の中央に見える位置へ揃える */
.guide-mark{display:flex;align-items:center;justify-content:center;flex-shrink:0;line-height:1;border-radius:0;padding:0}
.guide-glyph{display:block;line-height:1;transform:translateY(-3px)}
/* ロゴとノート名を、どの画面幅でもコンパクトな1行に揃える */
.brand{flex-direction:row;align-items:center;gap:11px;padding-left:6px;min-height:34px}
.brand img{width:57px;height:auto;flex-shrink:0}
.brand>span{font-size:12px!important;letter-spacing:.015em;padding:0!important;border:0!important;white-space:nowrap}
@media(min-width:641px) and (max-width:900px){.brand{gap:8px;padding-left:2px}.brand img{width:48px}.brand>span{font-size:11px!important}}
@media(max-width:640px){.brand{gap:12px;padding:0}.brand img{width:53px}.brand>span{font-size:13px!important;border:0!important;padding:0!important}}
.demo-bar a{color:#ecd797;margin-left:16px;text-underline-offset:3px;white-space:nowrap}
