:root{font-family:system-ui,sans-serif;color:#25302d;background:#f6f5ef}*{box-sizing:border-box}body{margin:0}header{padding:1.2rem max(1rem,calc((100vw - 1100px)/2));display:flex;justify-content:space-between;align-items:center;background:#e2ece3}h1{font-size:1.35rem;margin:.25rem 0}h2{margin-top:0}small,.muted{color:#566b60}.badge{font-size:.8rem;background:#fff;padding:.4rem .7rem;border-radius:1rem}nav{display:flex;gap:.2rem;overflow:auto;background:#fff;border-bottom:1px solid #d8dfd9;padding:0 max(.5rem,calc((100vw - 1100px)/2))}button{font:inherit;cursor:pointer}nav button{border:0;background:none;padding:1rem .8rem;white-space:nowrap}nav button.active{color:#176443;border-bottom:3px solid #176443}main{max-width:1100px;margin:auto;padding:1.4rem 1rem}.layout{display:grid;grid-template-columns:150px minmax(0,1fr);gap:1rem}.categories{display:flex;flex-direction:column;gap:.4rem}.categories button,.card,.panel{border:1px solid #dce3dc;background:white;border-radius:.7rem;padding:1rem;text-align:left}.categories button.active{background:#d7e9dc}.cards{display:grid;gap:.8rem}.card{width:100%}.japanese{font-size:1.3rem;line-height:1.8}.reading{display:block;color:#536b60;font-size:.92rem}.panel{margin-bottom:1rem;line-height:1.6}textarea,select,input{font:inherit;width:100%;padding:.7rem;border:1px solid #aab9ae;border-radius:.4rem}textarea{min-height:7rem}label{display:block;font-weight:600;margin:.8rem 0 .3rem}.primary{background:#176443;color:white;border:0;border-radius:.5rem;padding:.7rem 1rem;margin-top:1rem}.secondary{background:white;border:1px solid #8fa698;border-radius:.5rem;padding:.5rem .8rem}.notice{background:#fff4d8;border-radius:.5rem;padding:.8rem}.error{color:#a12b25}ul{padding-left:1.3rem}@media(max-width:600px){.layout{grid-template-columns:94px minmax(0,1fr);gap:.6rem}.categories button{padding:.7rem .45rem;font-size:.88rem}.card,.panel{padding:.8rem}nav button{padding:.8rem .6rem;font-size:.88rem}header{padding:1rem}.badge{font-size:.7rem}}
.layout section,.word-panel{min-width:0}.word-tabs,.style-toggle{display:flex;flex-wrap:wrap;gap:.35rem;margin:1rem 0}.word-tabs button,.style-toggle button,.form-choice{border:1px solid #b7c9bc;border-radius:.5rem;background:white;padding:.6rem;overflow-wrap:anywhere}.word-tabs [aria-selected="true"],.style-toggle [aria-pressed="true"],.form-choice.active{background:#d7e9dc;border-color:#176443}.form-list{display:grid;gap:.45rem}.form-choice{display:flex;justify-content:space-between;gap:.5rem;text-align:left;flex-wrap:wrap;width:100%}.form-choice small{display:block}.form-detail{overflow-wrap:anywhere;border-top:1px solid #dce3dc;margin-top:1rem}details{margin:.7rem 0}summary{cursor:pointer;font-weight:600}button:disabled{opacity:.55;cursor:not-allowed}@media(max-width:360px){.layout{grid-template-columns:76px minmax(0,1fr)}.word-tabs button,.style-toggle button{padding:.45rem;font-size:.85rem}.japanese{font-size:1.15rem}}