/* กระดิ่งประกาศ + ศูนย์ "มีอะไรใหม่" + แถบประกาศด่วน · 22 ก.ย. 2569 */
html body .topbar .kn-bell{position:relative;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#fff;border:1.5px solid #EFE2D0;color:#172A46;cursor:pointer;transition:border-color .15s,box-shadow .15s;flex:none}
html body .topbar .kn-bell:hover{border-color:#C32148;box-shadow:0 4px 12px #C321481f}
.kn-bell svg{width:22px;height:22px}
.kn-bell.has-new svg{color:#C32148;animation:knring 2.4s ease-in-out infinite;transform-origin:50% 10%}
@keyframes knring{0%,70%,100%{transform:rotate(0)}75%{transform:rotate(14deg)}82%{transform:rotate(-12deg)}89%{transform:rotate(7deg)}95%{transform:rotate(-4deg)}}
#kn-count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;padding:0 5px;box-sizing:border-box;border-radius:99px;display:grid;place-items:center;background:#C32148;color:#fff;font-size:11px;font-weight:900;line-height:1;border:2px solid #fff;box-shadow:0 2px 6px #C3214855;font-style:normal}
#kn-count[hidden]{display:none}
.kn-dot{position:absolute;top:6px;right:calc(50% - 16px);width:9px;height:9px;border-radius:50%;background:#C32148;border:2px solid #fff}.kn-dot[hidden]{display:none}
/* หน้าต่าง */
.kn-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.kn-head-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(150deg,#E4466B,#C32148);color:#fff;flex:none}.kn-head-ic svg{width:24px;height:24px}
.kn-head h2{margin:0}.kn-head small{color:#5E6878}.kn-head>div{flex:1}
.kn-readall{background:#E9EEF6;color:#172A46;border:0;border-radius:99px;padding:7px 12px;font:inherit;font-size:12px;font-weight:800;cursor:pointer;white-space:nowrap}
.kn-list{display:grid;gap:10px;max-height:min(60vh,520px);overflow:auto;padding:2px}
.kn-item{position:relative;background:#fff;border:1px solid #EFE2D0;border-radius:16px;padding:12px 14px}
.kn-item.new{background:linear-gradient(90deg,#FFF6F8,#fff);border-color:#F3C9D3}
.kn-item.new:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;border-radius:0 4px 4px 0;background:#C32148}
.kn-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;color:#5E6878}
.kn-type{font-weight:800;border-radius:99px;padding:2px 9px;font-size:11px}
.kn-type.berry{background:#FBE9EE;color:#C32148}.kn-type.gold{background:#FFF3DC;color:#9a6512}.kn-type.teal{background:#E2F4F1;color:#1E8C85}.kn-type.sky{background:#E8F1FB;color:#3F7CC4}.kn-type.navy{background:#E9EEF6;color:#172A46}.kn-type.urgent{background:#C32148;color:#fff}
.kn-pin{font-weight:700}.kn-new{margin-left:auto;font-style:normal;font-weight:900;color:#fff;background:#C32148;border-radius:99px;padding:1px 8px;font-size:10.5px}
.kn-item h3{margin:6px 0 4px;font-size:16px;color:#172A46}.kn-item p{margin:0;font-size:13.5px;line-height:1.55;color:#3d4758}
.kn-go{margin-top:8px;background:none;border:0;padding:0;color:#C32148;font:inherit;font-weight:800;font-size:13px;cursor:pointer}
.kn-push{margin-top:12px;text-align:center}.kn-push small{color:#5E6878;font-size:11.5px;line-height:1.5}
/* แถบประกาศด่วนบนหน้าแรก */
.kn-pinbar{display:flex;align-items:center;gap:10px;border-radius:16px;padding:10px 10px 10px 14px;background:linear-gradient(90deg,#FFF3DC,#FFF8EF);border:1px solid #F1D9A8;box-shadow:0 3px 12px #D9982B22}
.kn-pinbar.berry{background:linear-gradient(90deg,#FBE9EE,#FFF8EF);border-color:#F3C9D3}
.kn-pinbar.urgent{background:linear-gradient(90deg,#C32148,#9F1937);border-color:#9F1937;color:#fff}
.kn-pinbar-ic{font-size:22px;flex:none}
.kn-pinbar-body{flex:1;min-width:0;background:none;border:0;padding:0;text-align:left;font:inherit;color:inherit;cursor:pointer;display:flex;flex-direction:column;gap:1px}
.kn-pinbar-body small{font-size:11px;font-weight:800;color:#C32148}.kn-pinbar.urgent .kn-pinbar-body small{color:#F7E7CE}
.kn-pinbar-body b{font-size:14.5px;color:#172A46}.kn-pinbar.urgent .kn-pinbar-body b{color:#fff}
.kn-pinbar-body span{font-size:12.5px;color:#5E6878;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kn-pinbar.urgent .kn-pinbar-body span{color:#ffffffd9}
.kn-pinbar-x{width:30px;height:30px;border-radius:50%;border:0;background:#ffffffaa;color:#5E6878;font-size:18px;cursor:pointer;flex:none}
@media(max-width:900px){html body .topbar .kn-bell{width:42px;height:42px}html body .top-actions{display:flex;gap:8px;align-items:center}}
/* แจ้งเตือนเด้ง: การ์ดชวนเปิด (หน้าแรก เฉพาะแอปที่ติดตั้ง) + ปุ่มปิดในหน้าต่างประกาศ */
.kn-ask{display:flex;align-items:center;gap:10px;border-radius:16px;padding:10px 10px 10px 14px;margin-bottom:12px;background:linear-gradient(90deg,#E8F4FF,#F3F9FF);border:1px solid #BFDDF7;box-shadow:0 3px 12px #2B7BD922}
.kn-ask-ic{font-size:20px;flex:none}.kn-ask>div{flex:1;min-width:0;display:grid;line-height:1.35}.kn-ask b{font-size:14px;color:#17324D}.kn-ask small{font-size:12px;color:#5E6878}
.kn-ask .btn{flex:none;min-height:34px;padding:6px 16px;font-size:13.5px;border-radius:999px}
.kn-push .btn{margin-top:6px}.kn-push-off{display:block;margin:8px auto 0;background:none;border:0;color:#5E6878;font-size:12px;text-decoration:underline;cursor:pointer}