@font-face{font-family:'Cafe24Ssurround';src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Cafe24Ssurround.woff') format('woff')}
body{margin:0;background:#fbf8f2;color:#2f2a28;font-family:'Pretendard','Noto Sans KR',sans-serif}.app-shell{max-width:1060px;margin:auto;padding:14px}
.hero{display:grid;grid-template-columns:auto 1fr;align-items:center;background:#fff;border:1px solid #e5ddd8;border-radius:10px;padding:10px}.hero h1{text-align:center;margin:0;font-family:'Cafe24Ssurround',sans-serif}
.icon-btn,.ghost,button,input,select,textarea{border:1px solid #d8cfc8;border-radius:10px;background:#fff;padding:8px}.drawer{position:fixed;right:20px;top:70px;width:250px;background:white;border:1px solid #ddd;padding:12px;border-radius:12px}.hidden{display:none}
.tier{background:#fff;border:1px solid #e5ddd8;border-radius:10px;padding:10px;margin-top:10px}.tier:nth-child(1){background:#fff3f4}.tier:nth-child(2){background:#f5f0ff}.tier:nth-child(3){background:#edf6ff}.tier:nth-child(4){background:#edf9f3}.tier:nth-child(5){background:#fff9ea}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.card{border:1px solid #e5ddd8;border-radius:9px;padding:6px;background:#fff}.card:hover{transform:translateY(-2px);box-shadow:0 5px 10px #c8b7a522;border-color:#d9b8c8}
.cover{aspect-ratio:3/4;background:#eee;border-radius:8px;overflow:hidden;display:flex;align-items:center;justify-content:center}.cover img{width:100%;height:100%;object-fit:cover}
#detail-view{background:#fff;border:1px solid #e5ddd8;border-radius:12px;padding:14px}.comment{display:flex;justify-content:space-between;border:1px solid #ece7e3;border-radius:10px;padding:8px;margin-top:8px}.reply{margin-left:16px;border-left:2px solid #ddd;padding-left:10px;background:#fafafa;margin-top:6px}.time{font-size:12px;color:#888}.admin-name{background:linear-gradient(90deg,red,orange,yellow,green,blue,indigo,violet);-webkit-background-clip:text;color:transparent;font-weight:700}.admin-badge{font-size:11px;background:#222;color:#fff;padding:2px 6px;border-radius:999px;margin-left:6px}

#add-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}#add-form textarea{grid-column:span 2;min-height:76px}#add-form button{grid-column:span 2;background:#f2d6e6}
.grade-note{margin:8px 4px 2px;color:#736b67;font-size:13px}
#detail-view .cover{max-width:180px;aspect-ratio:3/4;margin-bottom:10px}
