.notice-bell{position:relative;flex:none;font-family:Arial,sans-serif}.notice-bell>summary{display:flex;align-items:center;justify-content:center;width:34px;height:36px;cursor:pointer;list-style:none;position:relative}.notice-bell>summary::-webkit-details-marker{display:none}.notice-bell>summary>b{position:absolute;top:-3px;right:-4px;font:10px/16px Arial,sans-serif;background:#a84864;color:#fff;border-radius:10px;min-width:16px;text-align:center;padding:0 3px}.notice-popover{position:absolute;right:0;top:46px;width:340px;max-width:calc(100vw - 24px);z-index:120;max-height:calc(100dvh - 120px);overflow-y:auto;border:1px solid var(--line);border-radius:10px;background:var(--white);color:var(--ink);box-shadow:0 16px 50px #160c1933;text-align:left}.notice-popover-heading,.notice-popover-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px}.notice-popover-heading{border-bottom:1px solid var(--line)}.notice-popover-heading strong{font:21px Georgia,serif}.notice-popover-heading span{font-size:11px;color:var(--muted)}.notice-preview{margin:0;border-bottom:1px solid var(--line);background:var(--white)}.notice-preview button{display:block;text-align:left;width:100%;padding:14px 18px;border-left:3px solid transparent}.notice-preview.is-unread button{border-left-color:var(--wine);background:var(--paper)}.notice-preview small{font:10px/1.5 Arial,sans-serif;color:var(--muted);display:block;margin-bottom:5px}.notice-preview span{font:13px/1.6 Arial,sans-serif;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.notice-popover-footer{font-size:12px;color:var(--ink)}.notice-popover-footer svg{width:18px;height:18px}.notice-popover-empty{text-align:center;padding:28px 24px}.notice-popover-empty>svg{margin:0 auto 10px;color:var(--wine)}.notice-popover-empty p{font:20px Georgia,serif;color:var(--ink);margin:6px 0 10px}.notice-popover-empty small{font:12px/1.6 Arial,sans-serif;display:block;color:var(--muted)}.notice-page{max-width:1000px;margin:0 auto 60px}.notice-page *{min-width:0}.notice-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;margin:22px 0 30px}.notice-heading h1{font-size:clamp(30px,3.5vw,42px)}.notice-heading p{margin-top:12px;color:var(--muted);font:14px/1.7 Arial,sans-serif}.notice-tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin-bottom:20px;overflow:auto}.notice-tabs a{font:13px/1.5 Arial,sans-serif;padding:13px 0;white-space:nowrap;border-bottom:2px solid transparent}.notice-tabs .active{border-color:var(--wine);font-weight:600}.notice-tabs b{margin-left:6px;font-size:10px;background:var(--light);border-radius:10px;padding:2px 6px}.notice-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.notice-toolbar>span{font:12px/1.6 Arial,sans-serif;color:var(--muted)}.notice-date{font:600 11px Arial,sans-serif;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:28px 0 12px}.notice-card{display:grid;grid-template-columns:42px minmax(0,1fr);gap:18px;padding:22px;background:var(--white);border:1px solid var(--line);border-radius:8px;margin:10px 0}.notice-card.is-unread{border-left:3px solid var(--wine)}.notice-card-icon{width:42px;height:42px;background:var(--light);border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--wine)}.notice-card-icon svg{width:21px;height:21px}.notice-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font:10px/1.5 Arial,sans-serif;color:var(--muted)}.notice-meta b{font-weight:400;background:var(--light);border-radius:4px;padding:2px 6px;color:var(--ink)}.notice-card h3{font-size:23px;line-height:1.3;margin:8px 0 15px;overflow-wrap:anywhere}.notice-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.notice-actions button{font:12px/1.6 Arial,sans-serif;padding:4px 0;color:var(--muted)}.notice-actions .notice-open{color:var(--wine);font-weight:600}.notice-actions .notice-delete{margin-left:auto}.notice-actions button:hover{text-decoration:underline;text-underline-offset:3px}.notice-pagination{display:flex;justify-content:center;gap:12px;margin-top:26px}.notice-empty{text-align:center;padding:50px 24px;border:1px dashed var(--line);border-radius:10px;background:var(--white)}.notice-empty>svg{width:32px;height:32px;color:var(--wine);margin-bottom:20px}.notice-empty h2{font-size:28px}.notice-empty p{font:14px/1.7 Arial,sans-serif;color:var(--muted);max-width:440px;margin:14px auto 22px}.notice-settings{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.notice-panel{padding:26px;border:1px solid var(--line);border-radius:10px;background:var(--white)}.notice-panel h2{font-size:27px}.notice-panel h2 small{font:12px Arial,sans-serif;color:var(--muted)}.notice-panel>p{font:13px/1.7 Arial,sans-serif;color:var(--muted);margin:14px 0 24px}.notice-option{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid var(--line);padding:18px 0;font:13px/1.6 Arial,sans-serif}.notice-option small{display:block;font-size:12px;color:var(--muted);margin-top:4px}.notice-option input{accent-color:var(--wine);width:18px;height:18px;flex:none}.notice-panel form>.button{margin-top:16px}.notice-follow-list{max-height:540px;overflow:auto;overscroll-behavior:contain}.notice-follow-list>div{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 0;border-top:1px solid var(--line);font:13px/1.5 Arial,sans-serif}.notice-follow-list small{display:block;font-size:10px;color:var(--muted);margin-bottom:4px}.notice-follow-list a,.notice-follow-list strong{overflow-wrap:anywhere}.notice-follow-list button{font-size:11px;color:var(--muted)}.notice-follow-list>p{font:13px/1.7 Arial,sans-serif;color:var(--muted)}.notice-follow{max-width:1120px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin:32px auto;padding:20px 24px;border:1px solid var(--line);border-radius:8px;background:var(--white)}.notice-follow>div{display:flex;align-items:center;gap:16px;min-width:0}.notice-follow svg{flex:none;color:var(--wine)}.notice-follow strong{font:600 14px/1.6 Arial,sans-serif}.notice-follow small{display:block;font:12px/1.6 Arial,sans-serif;color:var(--muted);margin-top:4px}.notice-follow form{flex:none}html[data-theme=dark] .notice-actions .notice-open{color:var(--theme-link,#dfb5c8)}.notice-bell>summary:focus-visible{outline:2px solid currentColor;outline-offset:3px}.notice-bell[hidden],.notice-page[hidden],.notice-follow[hidden]{display:none!important}
@media(max-width:800px){.notice-settings{grid-template-columns:1fr}.notice-heading{align-items:flex-start}.notice-heading>.button{flex:none}.notice-popover{position:fixed;right:12px;top:76px;max-height:calc(100dvh - 100px);overflow-y:auto}.notice-follow{padding:18px}.notice-toolbar{flex-wrap:wrap}}
@media(max-width:520px){.notice-heading{display:block}.notice-heading>.button{margin-top:18px}.notice-tabs{gap:20px}.notice-tabs a{font-size:12px}.notice-card{padding:17px;grid-template-columns:32px minmax(0,1fr);gap:12px}.notice-card-icon{width:32px;height:32px}.notice-card h3{font-size:21px}.notice-panel{padding:20px}.notice-follow{align-items:flex-start;flex-wrap:wrap}.notice-follow form{margin-left:38px}.notice-actions{gap:12px}.notice-toolbar>span{font-size:11px}}

:is(.notice-popover,.notice-page,.notice-follow) :is(a,button,input):focus-visible{outline:2px solid currentColor;outline-offset:3px}
