/* Shared header notifications and Alertify use the existing Studio palette. */
body #notification_icon .notification{width:500px;max-width:calc(100vw - 24px);background:var(--color-game-card);border:1px solid var(--studio-line);border-radius:14px;box-shadow:0 20px 70px var(--studio-backdrop);overflow:hidden;color:var(--studio-text);font:400 14px/1.6 'Noto Sans',sans-serif}
body #notification_icon .notice_heading{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--studio-line);gap:12px}
body #notification_icon .notice_heading h6{padding:0;margin:0;border:0;font-size:16px;line-height:1.5;font-weight:600;color:var(--studio-text)}
body #notification_icon .notice_close{display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid transparent;background:none;color:var(--studio-subtle);border-radius:6px;cursor:pointer}
body #notification_icon .notice_close svg{font-size:16px}
body #notification_icon .notification .list{height:auto;max-height:min(520px,calc(100dvh - 175px));overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--studio-line) transparent}
body #notification_icon .notification .list>.item{display:flex;gap:13px;padding:18px;border:0;border-bottom:1px solid var(--studio-line);line-height:1.7;color:var(--studio-subtle);font-weight:400;font-size:14px;transition:background .15s}
body #notification_icon .notification .list>.item:last-child{border-bottom:0}
body #notification_icon .notification .list>.item:hover{background:var(--studio-surface)}
body #notification_icon .notification .item .notice_icon{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid var(--studio-switch-border);border-radius:10px;background:var(--studio-selected);color:var(--studio-purple)}
body #notification_icon .notification .notice_icon svg{font-size:16px;width:16px;height:16px}
body #notification_icon .notice_detail{min-width:0;flex:1}
body #notification_icon .notice_copy{overflow-wrap:anywhere}
body #notification_icon .notice_copy a{display:block;color:inherit;text-decoration:none;border-radius:4px;cursor:pointer}
body #notification_icon .notification .item .notice_copy span{color:var(--studio-text);font-weight:600}
body #notification_icon .notification .item .notice_copy span.click{color:var(--studio-purple)}
body #notification_icon .notification .item .time{position:static;margin-top:7px;color:var(--studio-subtle);font-size:12px;line-height:1.5}
body #notification_icon .notification .item .time span{font-weight:400;color:inherit}
body #notification_icon .notification .list>.notice_state{padding:36px 24px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;border:0;color:var(--studio-subtle);font-size:14px}
body #notification_icon .notice_state_icon{display:grid;place-items:center;width:52px;height:52px;border:1px solid var(--studio-line);background:var(--studio-surface);color:var(--studio-purple);border-radius:14px}
body #notification_icon .notice_state p{margin:0;line-height:1.7}
body #notification_icon .notice_state button{padding:8px 14px;border:1px solid var(--studio-line);border-radius:7px;background:var(--studio-surface);color:var(--studio-text);font:inherit;cursor:pointer}
body #notification_icon :is(button,a):focus-visible{outline:none;box-shadow:inset 0 0 0 1px var(--studio-purple)}
body #notification_icon button:hover{background:var(--studio-hover)}
@media(max-width:599px){body #notification_icon .notification{position:fixed;top:68px;left:12px;right:12px;transform:none;width:auto;max-width:none}body #notification_icon .notification .list>.item{padding:16px;gap:11px}}