
@font-face{font-family:'Noto Serif SC';font-style:normal;font-weight:400;src:local('Noto Serif SC')}
.tskm-wrap{max-width:840px;margin:0 auto;color:#1f2937;font-family:Georgia,'Times New Roman',serif}
.tskm-wrap.tskm-800{max-width:840px}
.tskm-head{display:flex;align-items:center;gap:10px;margin:10px 0}
.badge{background:#7c2d12;color:#fff;border-radius:999px;padding:6px 10px;font-size:12px}
.tskm-card{background:#fdf7e3 url('scroll-bg.jpg') center/cover no-repeat;border:1px solid #e5e7eb;border-radius:16px;padding:16px;box-shadow:0 10px 22px rgba(0,0,0,.06)}
.tube-area{display:flex;align-items:center;gap:20px;justify-content:center;height:160px;border:1px dashed #d1bfa3;border-radius:12px;background:rgba(253,244,215,.6)}
.tube{width:64px;height:120px;background:linear-gradient(#c8a86a,#8a6a3e);border-radius:12px;position:relative;box-shadow:inset 0 0 10px rgba(0,0,0,.25)}
.tube:before{content:'';position:absolute;inset:-6px;background:url('bamboo.png') center/contain no-repeat;opacity:.4;pointer-events:none}
.tube .shake{position:absolute;inset:0;animation:none}
.stick{width:12px;height:0;background:#8b5e34;border-radius:6px;box-shadow:inset 0 0 6px rgba(0,0,0,.35)}
.tskm-cta{display:flex;gap:10px;margin:12px 0}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:1px solid #e5e7eb;background:#fff;cursor:pointer}
.btn.primary{background:#7c2d12;color:#fff;border-color:#7c2d12}
.tskm-result .title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.pill{background:#fef3c7;color:#7c2d12;border:1px solid #f59e0b;border-radius:999px;padding:6px 10px;font-weight:700}
.meta{color:#6b7280;font-size:13px;margin-top:2px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.box{background:rgba(255,255,255,.7);border:1px solid #e5e7eb;border-radius:12px;padding:12px}
.box.paper{background:linear-gradient(#fffef8,#fbf3db)}
.box h4{margin:0 0 8px;font-size:14px;letter-spacing:.5px;color:#7c2d12}
.han{font-family:'Noto Serif SC',serif;font-size:20px;line-height:1.8}
.viet{line-height:1.8;font-style:italic;color:#111827}
.sep{height:10px;border-bottom:1px dashed #d1bfa3;margin:6px 0}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tags .tag{background:#fef3c7;border:1px solid #f59e0b;border-radius:999px;padding:4px 10px;font-size:12px;color:#7c2d12}
.cols{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:12px}
.cols-tight .col{min-height:72px}
.col{background:rgba(255,255,255,.7);border:1px dashed #d1bfa3;border-radius:12px;padding:12px}
.col h5{margin:.2em 0 .4em;font-size:14px;color:#7c2d12}
.tskm-footer{margin-top:10px;color:#6b7280;font-size:12px}
@keyframes wobble{0%{transform:rotate(0)}25%{transform:rotate(4deg)}50%{transform:rotate(-3deg)}75%{transform:rotate(2deg)}100%{transform:rotate(0)}}
@keyframes rise{from{height:10px;opacity:.2}to{height:110px;opacity:.95}}
.tube-area.active .tube .shake{animation:wobble .8s ease-in-out 2}
.tube-area.active .stick{animation:rise .8s ease-in-out forwards}
@media(max-width:780px){.grid,.cols{grid-template-columns:1fr}}
