
    :root{
      --bg:#ffffff; --fg:#111111; --muted:#8a8a8a; --line:#e6e6e6;
      --card:#ffffff; --dark:#111111; --dark-fg:#ffffff; --soft:#f5f5f5;
      --bg-elev:#ffffff;
      --bg-sunken:#fafafa;
      --fg-2:#555555;
      --fg-3:#9a9a9a;
      --accent:#111111;
      --accent-fg:#ffffff;
      --shadow:rgba(0,0,0,.06);
      --scheme:light;
    }

    html[data-theme="light"]{ color-scheme:light; }

    html[data-theme="dark"]{
      color-scheme:dark;
      --bg:#0f1115; --fg:#e6e8ec; --muted:#8b93a1; --line:#272c36;
      --card:#171a21; --dark:#1b1f27; --dark-fg:#e6e8ec; --soft:#1c2028;
      --bg-elev:#171a21; --bg-sunken:#12151a;
      --fg-2:#b8bec9; --fg-3:#7d8492;
      --accent:#e6e8ec; --accent-fg:#0f1115;
      --shadow:rgba(0,0,0,.45);
    }

    html[data-theme="sepia"]{
      color-scheme:light;
      --bg:#f6efe2; --fg:#3d3428; --muted:#8a7a63; --line:#e2d5bf;
      --card:#fbf6ec; --dark:#3d3428; --dark-fg:#f6efe2; --soft:#efe6d5;
      --bg-elev:#fbf6ec; --bg-sunken:#f1e8d8;
      --fg-2:#5c5142; --fg-3:#9c8d76;
      --accent:#8a6d3b; --accent-fg:#fbf6ec;
      --shadow:rgba(90,70,40,.10);
    }

    html[data-theme="ocean"]{
      color-scheme:light;
      --bg:#f2f7fb; --fg:#0f2b3d; --muted:#5b7a91; --line:#d3e2ee;
      --card:#ffffff; --dark:#0d3b5c; --dark-fg:#eaf4fb; --soft:#e8f1f8;
      --bg-elev:#ffffff; --bg-sunken:#eaf2f9;
      --fg-2:#2c5470; --fg-3:#7b9ab0;
      --accent:#1d6fa5; --accent-fg:#ffffff;
      --shadow:rgba(20,70,110,.10);
    }

    html[data-theme="forest"]{
      color-scheme:light;
      --bg:#f3f7f1; --fg:#1d2f22; --muted:#5f7a63; --line:#d5e3d2;
      --card:#ffffff; --dark:#1e3a26; --dark-fg:#eaf5ea; --soft:#e9f2e6;
      --bg-elev:#ffffff; --bg-sunken:#eaf3e7;
      --fg-2:#3c5a42; --fg-3:#83a087;
      --accent:#2f7a45; --accent-fg:#ffffff;
      --shadow:rgba(30,80,45,.10);
    }

    @media (prefers-color-scheme: dark){
      html:not([data-theme]){
        color-scheme:dark;
        --bg:#0f1115; --fg:#e6e8ec; --muted:#8b93a1; --line:#272c36;
        --card:#171a21; --dark:#1b1f27; --dark-fg:#e6e8ec; --soft:#1c2028;
        --bg-elev:#171a21; --bg-sunken:#12151a;
        --fg-2:#b8bec9; --fg-3:#7d8492;
        --accent:#e6e8ec; --accent-fg:#0f1115;
        --shadow:rgba(0,0,0,.45);
      }
    }
    *{box-sizing:border-box;margin:0;padding:0;}
    body{
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;
      background:var(--bg); color:var(--fg); line-height:1.6;
      -webkit-font-smoothing:antialiased;
      overflow-wrap:break-word;
      word-break:break-word;
    }
    img,video,canvas{max-width:100%;height:auto;}
    a{color:inherit;text-decoration:none;}

    .md-content{word-break:break-word;}
    .md-content > :first-child{margin-top:0 !important;}
    .md-content > :last-child{margin-bottom:0 !important;}
    .md-content p{margin:8px 0;line-height:1.75;}
    .md-content h1,.md-content h2,.md-content h3,.md-content h4,.md-content h5,.md-content h6{
      margin:18px 0 10px;line-height:1.35;font-weight:800;color:var(--fg);
    }
    .md-content h1{font-size:22px;padding-bottom:6px;border-bottom:1px solid var(--line);}
    .md-content h2{font-size:19px;padding-bottom:5px;border-bottom:1px solid var(--line);}
    .md-content h3{font-size:17px;}
    .md-content h4{font-size:15px;}
    .md-content h5,.md-content h6{font-size:14px;color:var(--fg-2);}
    .md-content strong{font-weight:700;}
    .md-content em{font-style:italic;}
    .md-content del{color:var(--muted);text-decoration:line-through;}
    .md-content mark{background:#fef3c7;padding:1px 4px;border-radius:4px;color:#92400e;}
    .md-content u{text-decoration:underline;text-decoration-color:var(--muted);text-underline-offset:3px;}
    .md-content code:not(pre code){
      background:#f0f1f4;color:#d6336c;padding:1.5px 6px;border-radius:5px;font-size:13px;
      font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    }
    .md-content a{color:#2563eb;text-decoration:none;word-break:break-all;}
    .md-content a:hover{text-decoration:underline;}
    .md-content img{max-width:100%;border-radius:10px;margin:8px 0;}
    .md-content hr{border:none;border-top:1px solid var(--line);margin:14px 0;}

    .md-content ul,.md-content ol{margin:8px 0;padding-left:24px;}
    .md-content li{margin:5px 0;}
    .md-content li::marker{color:#8a8f99;}
    .md-content ul ul,.md-content ol ol,.md-content ul ol,.md-content ol ul{margin:3px 0;}
    .md-content .task-list-item{list-style:none;margin-left:-22px;}
    .md-content .task-list-item input[type="checkbox"]{
      margin-right:8px;vertical-align:-2px;width:15px;height:15px;accent-color:#2563eb;
    }

    .md-content blockquote{
      margin:10px 0;padding:8px 14px;border-left:3px solid #b794f6;
      background:#f7f4fc;color:#4a4458;border-radius:0 10px 10px 0;
    }
    .md-content blockquote p{margin:4px 0;}
    .md-content blockquote blockquote{margin:6px 0;background:#ede9f7;border-left-color:#9f7aea;}

    .md-content .md-table-wrap{
      border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:12px 0;
      background:var(--card);box-shadow:0 1px 3px rgba(0,0,0,.04);
    }
    .md-content .md-table-badge{
      display:flex;align-items:center;gap:6px;padding:7px 12px;background:#f6f7fb;
      border-bottom:1px solid var(--line);font-size:12px;color:var(--fg-2);font-weight:600;
    }
    .md-content .md-table-badge::before{content:"";display:inline-block;width:14px;height:14px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:3px;}
    .md-content table{
      width:100%;border-collapse:collapse;font-size:13.5px;background:var(--card);
    }
    .md-content th,.md-content td{border:1px solid #e5e7eb;padding:8px 12px;text-align:left;vertical-align:top;}
    .md-content th{background:#f6f7fb;font-weight:700;color:var(--fg-2);}
    .md-content tbody tr:nth-child(even) td{background:#fafbfc;}

    .md-content pre{
      position:relative;background:#f6f8fa;color:#24292e;border-radius:11px;margin:12px 0;
      overflow:hidden;border:1px solid #e1e4e8;
    }
    .md-content pre .code-head{
      display:flex;justify-content:space-between;align-items:center;
      padding:8px 13px;background:#eef1f4;color:#57606a;font-size:12px;border-bottom:1px solid #e1e4e8;
    }
    .md-content pre .code-head .lang{font-weight:700;letter-spacing:.4px;text-transform:uppercase;}
    .md-content pre .code-head .code-actions{display:flex;gap:8px;}
    .md-content pre .code-head .code-btn{
      background:#eaedf0;color:#24292e;border:none;border-radius:6px;padding:3px 11px;font-size:12px;cursor:pointer;
      display:inline-flex;align-items:center;gap:4px;
    }
    .md-content pre .code-head .code-btn:hover{background:#dde1e6;}
    .md-content pre code.hljs{
      display:block;padding:13px 15px;background:transparent;color:inherit;
      font-size:13px;line-height:1.65;overflow-x:auto;
      font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    }
    .md-content .md-toc{
      background:#f9fafb;border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin:12px 0;font-size:13.5px;
    }
    .md-content .md-toc-title{font-weight:700;margin-bottom:6px;color:var(--fg-2);}
    .md-content .md-toc ul{list-style:none;padding-left:0;margin:0;}
    .md-content .md-toc li{margin:4px 0;}
    .md-content .md-toc a{color:#2563eb;}
    .md-content .md-deflist dt{font-weight:700;margin-top:8px;}
    .md-content .md-deflist dd{margin-left:18px;color:var(--fg-2);}
    .md-content .md-footnotes{font-size:12px;color:var(--fg-2);border-top:1px solid var(--line);margin-top:14px;padding-top:10px;}
    .md-content .md-footnotes p{margin:3px 0;}

    @media (prefers-color-scheme: dark){
      .md-content h1,.md-content h2{border-bottom-color:var(--fg-2);}
      .md-content code:not(pre code){background:#2a2d35;color:#ff7eb3;}
      .md-content blockquote{background:#272330;color:#d8d2e5;}
      .md-content .md-table-wrap,.md-content table{background:#1a1a1a;}
      .md-content th,.md-content td{border-color:var(--fg-2);}
      .md-content th{background:#242424;}
      .md-content tbody tr:nth-child(even) td{background:#1f1f1f;}
    }

    @keyframes rainbow {
      0% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }
    @keyframes adminGlow {
      0%, 100% { box-shadow: 0 0 5px #ffd700, 0 0 10px #ffd700; }
      50% { box-shadow: 0 0 20px #ffd700, 0 0 35px #ffd700, 0 0 50px #ffd700; }
    }
    @keyframes popularPulse {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.02); }
    }
    @keyframes gradientShift {
      0% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }
    @keyframes shine {
      0% { background-position: -200% center; }
      100% { background-position: 200% center; }
    }
    @keyframes neonPulse {
      0%, 100% { text-shadow: 0 0 5px currentColor, 0 0 10px currentColor; }
      50% { text-shadow: 0 0 10px currentColor, 0 0 20px currentColor, 0 0 30px currentColor; }
    }
    @keyframes float {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-3px); }
    }
    @keyframes sparkle {
      0%, 100% { opacity: 1; filter: brightness(1); }
      50% { opacity: 0.9; filter: brightness(1.3); }
    }
    @keyframes borderFlow {
      0% { background-position: 0% 50%; }
      100% { background-position: 200% 50%; }
    }
    @keyframes breathe {
      0%, 100% { opacity: 0.8; }
      50% { opacity: 1; }
    }

    .nav{
      position:sticky;top:0;z-index:100;
      background:var(--dark); color:var(--dark-fg);
      display:flex;align-items:center;justify-content:space-between;
      padding:0 24px;height:60px;gap:8px;
      border-bottom:1px solid #000;
    }
    .nav .brand{font-weight:700;font-size:18px;letter-spacing:1px;display:flex;align-items:center;gap:10px;flex-shrink:0;white-space:nowrap;}
    .nav .brand .dot{width:12px;height:12px;background:#fff;border-radius:50%;display:inline-block;animation:popularPulse 2s ease-in-out infinite;}
    .nav-search{display:flex;align-items:center;gap:6px;margin:0 14px;flex:0 1 320px;min-width:0;}
    .nav-search input{
      flex:1;min-width:0;height:34px;padding:0 12px;border-radius:18px;border:1px solid #3a3a3a;
      background:#1c1c1c;color:#fff;font-size:13px;outline:none;transition:border-color .15s;
    }
    .nav-search input:focus{border-color:#ffd700;}
    .nav-search button{
      flex:0 0 auto;height:34px;width:34px;border:none;border-radius:50%;background:#2a2a2a;
      color:#fff;cursor:pointer;font-size:14px;transition:background .15s;
    }
    .nav-search button:hover{background:#ffd700;color:#111;}
    .nav .links{
      display:flex;align-items:center;gap:4px;flex-wrap:nowrap;
      overflow-x:auto;min-width:0;-webkit-overflow-scrolling:touch;
      scrollbar-width:thin;
      scrollbar-color:rgba(255,255,255,.38) transparent;
      padding-bottom:3px;
    }
    .nav .links::-webkit-scrollbar{height:4px;}
    .nav .links::-webkit-scrollbar-track{background:transparent;}
    .nav .links::-webkit-scrollbar-thumb{background:rgba(255,255,255,.38);border-radius:99px;}
    .nav .links::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.62);}
    .nav .links a{
      padding:8px 14px;border-radius:8px;font-size:14px;color:#d8d8d8;
      transition:all .15s ease;flex-shrink:0;white-space:nowrap;
    }
    .nav .links a:hover{background:#2a2a2a;color:#fff;}
    .nav .links a.active{background:#fff;color:#111;font-weight:600;}
    .nav .links a.nav-disabled{color:#8a8a8a !important;background:transparent !important;cursor:not-allowed;opacity:.6;}
    .nav .links a.nav-disabled:hover{background:transparent !important;color:#8a8a8a !important;}
    .nav .user-info{display:flex;align-items:center;gap:8px;margin-left:12px;flex-shrink:0;}
    .nav .user-info .nav-avatar{
      width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid #fff;
      cursor:pointer;transition:transform .2s;
    }
    .nav .user-info .nav-avatar:hover{transform:scale(1.1);}
    .nav .user-info .username{font-size:14px;color:#fff;}

    .notif-bell{
      position:relative;
      padding:8px 12px;
      cursor:pointer;
      font-size:16px;
      color:#d8d8d8;
      transition:all .15s;
    }
    .notif-bell:hover{color:#fff;background:#2a2a2a;border-radius:8px;}

    .nav .nav-bell-top{
      position:relative;flex-shrink:0;
      display:inline-flex;align-items:center;justify-content:center;
      width:38px;height:38px;border-radius:9px;
      color:#d8d8d8;font-size:17px;line-height:1;text-decoration:none;
      transition:all .15s ease;
    }
    .nav .nav-bell-top:hover{background:#2a2a2a;color:#fff;}
    .nav .nav-bell-top.active{background:#fff;color:#111;}

    .nav .nav-avatar-top{
      flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
      width:34px;height:34px;border-radius:50%;overflow:hidden;
      border:2px solid rgba(255,255,255,.28);
      transition:border-color .15s ease;
    }
    .nav .nav-avatar-top:hover,.nav .nav-avatar-top.active{border-color:#fff;}
    .nav .nav-avatar-top img{width:100%;height:100%;object-fit:cover;display:block;}

    @media (min-width: 901px){
      .nav .nav-bell-top,
      .nav .nav-avatar-top{display:none;}
    }

    .nav-drop{position:relative;display:inline-block;}
    .nav .links .nav-drop{position:relative;display:inline-block;}
    .nav .links .nav-drop-btn{
      background:none;border:0;cursor:pointer;
      display:inline-flex;align-items:center;gap:4px;
      white-space:nowrap;
      flex-shrink:0;
      padding:8px 14px;border-radius:8px;
      font-size:14px;color:#d8d8d8;font-family:inherit;font-weight:inherit;
      transition:all .15s ease;
    }
    .nav .links .nav-drop-btn:hover{background:#2a2a2a;color:#fff;}
    .nav .links .nav-drop.open .nav-drop-btn,
    .nav .links .nav-drop-btn.active{background:#fff;color:#111;font-weight:600;}
    .nav-drop-btn .nd-arrow{font-size:10px;opacity:.7;transition:transform .15s;}
    .nav-drop.open .nav-drop-btn .nd-arrow{transform:rotate(180deg);}
    .nav .links .nav-drop-menu{
      position:fixed;min-width:150px;padding:6px;display:none;z-index:2500;
      background:var(--card);border:1px solid var(--line);border-radius:12px;
      box-shadow:0 12px 34px var(--shadow);
    }
    .nav-drop.open .nav-drop-menu{display:block;}
    .nav .links .nav-drop-menu a{
      display:block;padding:10px 12px;border-radius:8px;
      font-size:13.5px;font-weight:400;color:var(--fg);
      white-space:nowrap;text-decoration:none;transition:background .12s;
    }
    .nav .links .nav-drop-menu a:hover,
    .nav .links .nav-drop-menu a.active{background:var(--soft);color:var(--fg);font-weight:600;}

    .nav .links a.nav-admin{
      border:1px solid rgba(255,255,255,.35);border-radius:8px;padding:3px 10px;
    }
    .nav .links a.nav-admin:hover{background:rgba(255,255,255,.14);}

    .theme-btn{
      position:relative;padding:8px 12px;cursor:pointer;font-size:16px;line-height:1;
      color:#d8d8d8;transition:all .15s;background:none;border:0;font-family:inherit;
    }
    .theme-btn:hover{color:#fff;background:#2a2a2a;border-radius:8px;}
    .theme-pop{
      position:fixed;z-index:3000;display:none;
      background:var(--card);color:var(--fg);
      border:1px solid var(--line);border-radius:14px;
      box-shadow:0 12px 36px var(--shadow);
      padding:10px;min-width:200px;
    }
    .theme-pop.on{display:block;}
    .theme-pop .tp-title{
      font-size:11px;color:var(--muted);padding:2px 8px 8px;
      letter-spacing:.6px;font-weight:600;
    }
    .theme-opt{
      display:flex;align-items:center;gap:10px;width:100%;text-align:left;
      padding:9px 10px;border-radius:9px;cursor:pointer;border:0;background:none;
      font-size:13.5px;color:var(--fg);transition:background .12s;font-family:inherit;
    }
    .theme-opt:hover{background:var(--soft);}
    .theme-opt.sel{background:var(--soft);}
    .theme-opt .sw{
      width:26px;height:26px;border-radius:8px;flex-shrink:0;
      border:1px solid var(--line);position:relative;overflow:hidden;
    }
    .theme-opt .sw i{position:absolute;width:50%;height:50%;display:block;}
    .theme-opt .sw i:nth-child(1){left:0;top:0;}
    .theme-opt .sw i:nth-child(2){right:0;top:0;}
    .theme-opt .sw i:nth-child(3){left:0;bottom:0;}
    .theme-opt .sw i:nth-child(4){right:0;bottom:0;}
    .theme-opt .tp-name{flex:1;min-width:0;}
    .theme-opt .tp-name small{display:block;font-size:11px;color:var(--muted);margin-top:1px;}
    .theme-opt .ck{margin-left:auto;font-size:12px;color:var(--accent);font-weight:700;opacity:0;}
    .theme-opt.sel .ck{opacity:1;}
    .notif-bell .badge{
      position:absolute;top:2px;right:2px;
      background:#f5576c;color:#fff;
      font-size:10px;font-weight:700;
      min-width:16px;height:16px;border-radius:8px;
      display:flex;align-items:center;justify-content:center;
      padding:0 4px;
    }

    .wrap{max-width:1000px;margin:0 auto;padding:24px 20px 64px;}
    .games-page{max-width:1140px;margin:0 auto;padding:24px 20px 64px;display:flex;justify-content:center;align-items:flex-start;gap:30px;flex-wrap:wrap;min-height:calc(100vh - 80px);background:transparent;}
    @media (max-width:900px){.games-page{flex-direction:column;align-items:stretch;}}
    .card{
      background:var(--card);border:1px solid var(--line);border-radius:16px;
      padding:28px;box-shadow:0 1px 2px rgba(0,0,0,.03);
    }
    .card.narrow{max-width:420px;margin:40px auto;}
    h1{font-size:26px;margin-bottom:6px;letter-spacing:.5px;}
    h2{font-size:20px;margin-bottom:14px;}
    h3{font-size:17px;margin-bottom:10px;}
    .sub{color:var(--muted);font-size:14px;margin-bottom:22px;}

    label{display:block;font-size:13px;color:#444;margin:14px 0 6px;}
    input[type=text],input[type=password],input[type=number],input[type=file],select,textarea{
      width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:10px;
      font-size:14px;background:var(--card);color:var(--fg);outline:none;transition:border .15s;
      font-family:inherit;
    }
    textarea{resize:vertical;min-height:120px;line-height:1.6;}
    input:focus,select:focus,textarea:focus{border-color:var(--fg);}
    .btn{
      display:inline-block;cursor:pointer;border:1px solid #111;background:#111;color:#fff;
      padding:11px 20px;border-radius:10px;font-size:14px;font-weight:600;
      transition:all .15s ease;font-family:inherit;
    }
    .btn:hover{background:#333;transform:translateY(-1px);}
    .btn:active{transform:translateY(0);}
    .btn.block{width:100%;margin-top:20px;}
    .btn.ghost{background:var(--card);color:var(--fg);}
    .btn.ghost:hover{background:var(--soft);}
    .btn.sm{padding:6px 12px;font-size:12px;border-radius:8px;}
    .btn.xs{padding:3px 8px;font-size:11px;border-radius:6px;}
    .btn.danger{background:#c0392b;border-color:#c0392b;color:#fff;}
    .btn.danger:hover{background:#a5281b;border-color:#a5281b;}
    .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
    .muted{color:var(--muted);font-size:13px;}
    .center{text-align:center;}
    hr{border:none;border-top:1px solid var(--line);margin:20px 0;}

    .flashes{max-width:1000px;margin:14px auto 0;padding:0 20px;}
    .flash{
      padding:11px 16px;border-radius:10px;font-size:14px;margin-bottom:10px;
      border:1px solid var(--line);background:var(--soft);
      animation: fadeIn .3s ease;
    }
    @keyframes fadeIn{from{opacity:0;transform:translateY(-10px);}to{opacity:1;transform:translateY(0);}}
    .flash.error{background:#fdecea;border-color:#f5c6c2;color:#a5281b;border-left:4px solid #c0392b;}
    .flash.ok,.flash.success{background:#eaf7ee;border-color:#bfe6cb;color:#1e7d43;border-left:4px solid #2e9e57;}
    .flash.warn{background:#fff7e6;border-color:#f0dca0;color:#8a6d00;border-left:4px solid #e0a800;}

    table{width:100%;border-collapse:collapse;font-size:14px;}
    th,td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;}
    th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;}
    .table-scroll{
      overflow-x:auto;
      scrollbar-width:thin;
    }
    .table-scroll table{min-width:720px;}
    .table-scroll::-webkit-scrollbar{height:9px;}
    .table-scroll::-webkit-scrollbar-track{background:var(--soft);border-radius:99px;}
    .table-scroll::-webkit-scrollbar-thumb{background:var(--g5);border-radius:99px;}
    .table-scroll::-webkit-scrollbar-thumb:hover{background:var(--g6);}

    .punish-box{display:flex;flex-direction:column;gap:4px;}
    .punish-row{display:flex;align-items:center;gap:2px;flex-wrap:nowrap;white-space:nowrap;}
    .punish-label{font-size:12px;color:var(--fg-2);flex-shrink:0;}
    .punish-row .punish-num{
      width:38px;padding:3px 4px;font-size:12px;text-align:center;
      border:1px solid var(--line);border-radius:6px;flex-shrink:0;
    }
    .punish-unit{font-size:11px;color:var(--muted);flex-shrink:0;}
    .punish-row .btn.sm{margin-left:4px;white-space:nowrap;flex-shrink:0;padding:4px 10px;font-size:11px;}
    .punish-row input[type="text"]{width:70px;padding:3px 5px;font-size:11px;}

    .tag{display:inline-block;font-size:12px;padding:2px 9px;border-radius:20px;border:1px solid #111;margin-left:4px;vertical-align:middle;white-space:nowrap;flex-shrink:0;}
    .tag.on{background:#111;color:#fff;}
    .tag.off{background:var(--card);color:var(--muted);border-color:#ddd;}

    .tag.admin{
      background:linear-gradient(90deg, #ffd700, #ffed4e, #ffd700);
      background-size:200% auto;
      color:var(--fg);border-color:#ffd700;
      animation:shine 3s linear infinite;
      font-weight:600;
    }

    .tag.popular{
      background:linear-gradient(90deg, #667eea, #764ba2, #f093fb, #f5576c, #667eea);
      background-size:300% 300%;
      color:#fff;border:none;
      animation:gradientShift 4s ease infinite;
      font-weight:500;
    }

    .badge-gold{
      background:linear-gradient(135deg, #ffd700, #ffed4e, #f5c500, #ffd700);
      background-size:200% 200%;
      color:#5a4500;border:1px solid #ffd700;
      animation:gradientShift 3s ease infinite, sparkle 2s ease-in-out infinite;
      font-weight:600;
    }

    .badge-silver{
      background:linear-gradient(135deg, #c0c0c0, #e8e8e8, #a8a8a8, #c0c0c0);
      background-size:200% 200%;
      color:var(--fg-2);border:1px solid #b0b0b0;
      animation:gradientShift 4s ease infinite;
      font-weight:600;
    }

    .badge-purple{
      background:linear-gradient(135deg, #667eea, #764ba2, #9f7aea, #667eea);
      background-size:200% 200%;
      color:#fff;border:none;
      animation:gradientShift 3.5s ease infinite, float 3s ease-in-out infinite;
      font-weight:500;
    }

    .badge-fire{
      background:linear-gradient(135deg, #ff416c, #ff4b2b, #f12711, #f5af19, #ff416c);
      background-size:300% 300%;
      color:#fff;border:none;
      animation:gradientShift 2s ease infinite;
      font-weight:600;
    }

    .badge-ocean{
      background:linear-gradient(135deg, #2193b0, #6dd5ed, #48c6ef, #2193b0);
      background-size:200% 200%;
      color:#fff;border:none;
      animation:gradientShift 3s ease infinite, breathe 3s ease-in-out infinite;
      font-weight:500;
    }

    .badge-forest{
      background:linear-gradient(135deg, #11998e, #38ef7d, #11998e);
      background-size:200% 200%;
      color:#fff;border:none;
      animation:gradientShift 4s ease infinite;
      font-weight:500;
    }

    .badge-dark{
      background:linear-gradient(135deg, #0f0c29, #302b63, #24243e, #0f0c29);
      background-size:200% 200%;
      color:#fff;border:1px solid #4a4a8a;
      animation:gradientShift 5s ease infinite;
      font-weight:500;
    }

    .badge-neon{
      background:#111;color:#0ff;
      border:1px solid #0ff;
      animation:neonPulse 1.5s ease-in-out infinite;
      font-weight:600;
    }

    .avatar{
      width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid #fff;
      cursor:pointer;transition:all .2s;flex-shrink:0;
    }
    .avatar:hover{transform:scale(1.1);}
    .avatar.sm{width:32px;height:32px;}
    .avatar.lg{width:80px;height:80px;}
    .avatar.online{border-color:#10b981;}
    .avatar.offline{border-color:#9ca3af;opacity:0.7;}

    .online-dot{
      display:inline-block;width:8px;height:8px;border-radius:50%;
      background:#10b981;margin-right:4px;
      box-shadow:0 0 4px #10b981;
    }
    .online-dot.offline{background:#9ca3af;box-shadow:none;}

    .chat-box{
      border:1px solid var(--line);border-radius:14px;height:60vh;min-height:400px;
      overflow-y:auto;padding:18px;background:var(--soft);
    }
    .msg{margin-bottom:16px;display:flex;gap:10px;align-items:flex-start;position:relative;}
    .msg .msg-content{flex:1;min-width:0;}
    .msg .head{display:flex;align-items:baseline;gap:8px;margin-bottom:4px;flex-wrap:wrap;}
    .msg .name{font-weight:700;font-size:14px;cursor:pointer;}
    .msg .name:hover{text-decoration:underline;}
    .msg .time{font-size:11px;color:var(--muted);}
    .msg .body{
      display:inline-block;background:var(--card);border:1px solid var(--line);
      padding:10px 14px;border-radius:12px;font-size:14px;word-break:break-word;max-width:100%;
      color:var(--fg);
      transition:all .3s ease;
    }
    .msg.me .body{background:#111;color:#fff;border-color:var(--fg);}
    .recall-tip{
      text-align:center;color:var(--muted);font-size:12px;
      margin:12px 0;user-select:none;
    }

    .msg-actions{
      position:absolute;right:0;bottom:-2px;
      display:flex;gap:6px;align-items:center;
      opacity:0;transition:opacity .15s;
      font-size:11px;
    }
    .msg:hover .msg-actions{opacity:1;}
    .recall-btn{
      font-size:11px;padding:2px 6px;
      background:var(--card);border:1px solid var(--line);
      border-radius:4px;cursor:pointer;color:var(--muted);
    }
    .recall-btn:hover{color:#f5576c;border-color:#f5576c;}
    .inline-report{display:inline-flex;gap:4px;align-items:center;}
    .report-btn{
      font-size:11px;padding:2px 6px;
      background:var(--card);border:1px solid var(--line);
      border-radius:4px;cursor:pointer;color:#c0392b;
    }
    .report-btn:hover{border-color:#c0392b;}

    .mention{
      color:#667eea;font-weight:600;
      background:rgba(102,126,234,0.1);
      padding:0 3px;border-radius:3px;
    }
    .msg.me .mention{color:#a5b4fc;background:rgba(255,255,255,0.15);}

    .msg.effect-admin{box-shadow:inset 3px 0 0 #ffd700;}
    .msg.effect-popular{box-shadow:inset 3px 0 0 #f5576c;}
    .msg.effect-rainbow{box-shadow:inset 3px 0 0 #f5576c;}
    .msg.effect-fire{box-shadow:inset 3px 0 0 #f12711;}
    .msg.effect-ocean{box-shadow:inset 3px 0 0 #2193b0;}
    .msg.effect-forest{box-shadow:inset 3px 0 0 #11998e;}
    .msg.effect-purple{box-shadow:inset 3px 0 0 #764ba2;}
    .msg.effect-sunset{box-shadow:inset 3px 0 0 #fa709a;}
    .msg.effect-neon{box-shadow:inset 3px 0 0 #0ff;}
    .msg.effect-galaxy{box-shadow:inset 3px 0 0 #667eea;}
    .avatar.effect-rainbow,.nav-avatar.effect-rainbow{box-shadow:0 0 0 3px rgba(244,114,182,.5),0 0 12px rgba(244,114,182,.4);}
    .avatar.effect-fire,.nav-avatar.effect-fire{box-shadow:0 0 0 3px rgba(241,39,17,.45),0 0 12px rgba(241,39,17,.35);}
    .avatar.effect-ocean,.nav-avatar.effect-ocean{box-shadow:0 0 0 3px rgba(33,147,176,.5),0 0 12px rgba(33,147,176,.4);}
    .avatar.effect-forest,.nav-avatar.effect-forest{box-shadow:0 0 0 3px rgba(17,153,142,.5),0 0 12px rgba(17,153,142,.4);}
    .avatar.effect-neon,.nav-avatar.effect-neon{box-shadow:0 0 0 3px rgba(0,255,255,.5),0 0 12px rgba(0,255,255,.4);}
    .avatar.effect-galaxy,.nav-avatar.effect-galaxy{box-shadow:0 0 0 3px rgba(102,126,234,.5),0 0 14px rgba(102,126,234,.45);}

    .file-attachment{
      margin-top:8px;padding:10px;border-radius:8px;background:rgba(0,0,0,0.05);
      display:flex;align-items:center;gap:10px;
    }
    .msg.me .file-attachment{background:rgba(255,255,255,0.1);}
    .file-attachment img{max-width:200px;max-height:200px;border-radius:8px;cursor:pointer;}
    .file-attachment video{max-width:300px;border-radius:8px;}
    .file-attachment .file-icon{font-size:24px;}
    .file-attachment .file-info{flex:1;}
    .file-attachment .file-name{font-size:13px;font-weight:500;}
    .file-attachment .file-download{font-size:12px;color:var(--muted);text-decoration:underline;}

    .send-bar{display:flex;gap:10px;margin-top:16px;align-items:flex-end;}
    .send-bar .input-area{flex:1;display:flex;flex-direction:column;gap:8px;}
    .send-bar textarea{min-height:44px;max-height:150px;resize:none;}
    .send-bar .file-preview{display:none;padding:8px;background:var(--soft);border-radius:8px;font-size:13px;}
    .send-bar .file-preview.show{display:flex;align-items:center;gap:8px;}
    .empty{color:var(--muted);text-align:center;padding:40px 0;font-size:14px;}

    .drop-zone{
      border:2px dashed transparent;border-radius:14px;transition:all .2s;
    }
    .drop-zone.dragover{
      border-color:var(--fg);background:rgba(0,0,0,0.02);
    }

    .post-list{display:flex;flex-direction:column;gap:16px;}
    .post-item{
      border:1px solid var(--line);border-radius:12px;padding:20px;transition:all .2s;
      background:var(--card);
      position:relative;overflow:hidden;
    }
    .post-item:hover{box-shadow:0 4px 12px rgba(0,0,0,0.08);transform:translateY(-2px);}
    .post-item.pinned{border-left:4px solid #ffd700;}

    .post-cover-effect{
      position:absolute;top:0;left:0;right:0;height:4px;
      border-radius:12px 12px 0 0;
    }
    .post-cover-effect.admin{
      background:linear-gradient(90deg, #ffd700, #ffed4e, #ffd700);
      background-size:200% auto;
      animation:shine 3s linear infinite;
    }
    .post-cover-effect.popular{
      background:linear-gradient(90deg, #667eea, #764ba2, #f093fb, #f5576c);
      background-size:300% 300%;
      animation:gradientShift 4s ease infinite;
    }
    .post-cover-effect.rainbow{
      background:linear-gradient(90deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #9400d3);
      background-size:400% 400%;
      animation:rainbow 5s linear infinite;
    }
    .post-cover-effect.fire{
      background:linear-gradient(90deg, #ff416c, #ff4b2b, #f5af19);
      background-size:200% 200%;
      animation:gradientShift 2s ease infinite;
    }
    .post-cover-effect.ocean{
      background:linear-gradient(90deg, #2193b0, #6dd5ed);
      background-size:200% 200%;
      animation:gradientShift 3s ease infinite;
    }
    .post-cover-effect.forest{
      background:linear-gradient(90deg, #11998e, #38ef7d);
      background-size:200% 200%;
      animation:gradientShift 3.5s ease infinite;
    }
    .post-cover-effect.purple{
      background:linear-gradient(90deg, #667eea, #764ba2, #9f7aea);
      background-size:200% 200%;
      animation:gradientShift 4s ease infinite;
    }
    .post-cover-effect.sunset{
      background:linear-gradient(90deg, #fa709a, #fee140, #f093fb);
      background-size:200% 200%;
      animation:gradientShift 3s ease infinite;
    }
    .post-cover-effect.neon{
      background:linear-gradient(90deg, #0ff, #f0f, #0ff);
      background-size:200% 200%;
      animation:gradientShift 2s ease infinite;
    }
    .post-cover-effect.galaxy{
      background:linear-gradient(90deg, #0f0c29, #302b63, #667eea);
      background-size:200% 200%;
      animation:gradientShift 6s ease infinite;
    }

    .announce-banner{
      background:#fff8e6;border:1px solid #f0dca0;color:#8a6d00;
      border-radius:10px;padding:8px 12px;font-size:13px;line-height:1.6;
    }
    .grp-admin-panel{display:flex;gap:4px;flex-wrap:wrap;}
    .friend-card.has-admin{position:relative;}
    .friend-card.has-admin:hover .grp-admin-panel{display:flex !important;}
    .post-header{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
    .post-meta{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--muted);margin-top:12px;flex-wrap:wrap;}
    .post-meta .like-btn{cursor:pointer;display:flex;align-items:center;gap:4px;padding:4px 8px;border-radius:6px;transition:all .15s;}
    .post-meta .like-btn:hover{background:var(--soft);}
    .post-meta .like-btn.liked{color:#f5576c;font-weight:600;}
    .post-title{font-size:18px;font-weight:600;margin-bottom:8px;}
    .post-title:hover{text-decoration:underline;}
    .post-excerpt{color:#444;font-size:14px;line-height:1.6;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}

    .post-content{font-size:15px;line-height:1.8;}
    .post-content img{max-width:100%;border-radius:8px;}
    .post-content pre{background:var(--soft);padding:12px;border-radius:8px;overflow-x:auto;font-size:13px;}
    .post-content code{background:var(--soft);padding:2px 6px;border-radius:4px;font-size:13px;}

    .code-box{position:relative;display:flex;align-items:stretch;background:var(--soft);border-radius:8px;overflow:auto;max-height:480px;margin:10px 0;}
    .code-box code.hljs{display:block;flex:1;padding:12px 14px;background:transparent !important;font-size:13px;line-height:1.55;white-space:pre;min-width:0;}
    .code-gutter{display:block;flex-shrink:0;padding:12px 8px 12px 12px;color:var(--fg-3);text-align:right;user-select:none;border-right:1px solid var(--line);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;line-height:1.55;background:var(--soft);}
    .code-gutter i{display:block;font-style:normal;}
    .code-lang{position:absolute;top:6px;left:10px;font-size:11px;color:var(--muted);background:rgba(255,255,255,.8);padding:1px 6px;border-radius:4px;pointer-events:none;}
    .code-copy{position:absolute;top:6px;right:8px;font-size:11px;padding:2px 8px;border:1px solid var(--line);background:var(--card);border-radius:6px;cursor:pointer;opacity:0;transition:.15s;z-index:2;}
    .code-box:hover .code-copy{opacity:1;}
    .post-content blockquote{border-left:4px solid #888;background:#f5f5f7;padding:10px 16px;color:var(--fg-2);margin:14px 0;border-radius:0 6px 6px 0;font-style:normal;}

    .comment-list{margin-top:24px;display:flex;flex-direction:column;gap:16px;}
    .comment{display:flex;gap:12px;padding:16px 0;border-top:1px solid var(--line);}
    .comment-content{flex:1;}
    .comment-header{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
    .comment-text{font-size:14px;line-height:1.6;}

    .friend-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;}
    .friend-card{
      border:1px solid var(--line);border-radius:12px;padding:16px;
      display:flex;align-items:center;gap:12px;transition:all .2s;
      position:relative;
    }
    .friend-card:hover{box-shadow:0 2px 8px rgba(0,0,0,0.06);}
    .friend-info{flex:1;min-width:0;}
    .friend-name{font-weight:600;font-size:15px;display:flex;align-items:center;flex-wrap:wrap;gap:4px;}
    .friend-status{font-size:12px;margin-top:2px;display:flex;align-items:center;}

    .notif-list{display:flex;flex-direction:column;gap:8px;}
    .notif-item{
      padding:14px 16px;border:1px solid var(--line);border-radius:10px;
      display:flex;gap:12px;align-items:flex-start;
      transition:all .15s;
    }
    .notif-item:hover{background:var(--soft);}
    .notif-item.unread{border-left:3px solid #667eea;background:rgba(102,126,234,0.03);}
    .notif-icon{font-size:20px;flex-shrink:0;}
    .notif-content{flex:1;min-width:0;}
    .notif-text{font-size:14px;}
    .notif-time{font-size:12px;color:var(--muted);margin-top:4px;}

    .profile-header{display:flex;align-items:center;gap:24px;margin-bottom:32px;}
    .profile-avatar{width:100px;height:100px;border-radius:50%;object-fit:cover;border:3px solid #111;}

    .editor-toolbar{display:flex;gap:6px;margin-bottom:8px;flex-wrap:wrap;}
    .editor-toolbar button{
      padding:6px 10px;border:1px solid var(--line);background:var(--card);border-radius:6px;
      cursor:pointer;font-size:13px;transition:all .15s;
    }
    .editor-toolbar button:hover{background:var(--soft);border-color:var(--fg);}
    .editor-preview{
      margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:10px;
      min-height:100px;background:var(--soft);
    }

    .modal-overlay{
      position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);
      display:none;align-items:center;justify-content:center;z-index:1000;
    }
    .modal-overlay.show{display:flex;}
    .modal{
      background:var(--card);border-radius:16px;padding:24px;max-width:400px;width:90%;
      animation:modalIn .3s ease;
    }
    @keyframes modalIn{from{opacity:0;transform:scale(0.9);}to{opacity:1;transform:scale(1);}}
    .modal-actions{display:flex;gap:10px;margin-top:20px;justify-content:flex-end;}

    .footnote{text-align:center;color:var(--muted);font-size:12px;margin-top:40px;}

    @media (max-width:768px){
      .nav{
        height:auto;min-height:52px;flex-wrap:nowrap;
        padding:8px 12px;
        row-gap:0;
      }
      .nav .brand{font-size:16px;flex:0 0 auto;padding:8px 2px;margin:-8px -2px;}
      .nav-search{flex:1 1 auto;margin:0 8px;min-width:0;}
      .nav-search input{height:32px;font-size:16px;}
      .nav-search button{height:32px;width:32px;}
      .nav .links{
        order:9;flex:1 1 100%;
        margin-top:8px;padding-top:6px;padding-bottom:6px;
        border-top:1px solid rgba(255,255,255,.12);
        overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;
        scrollbar-width:thin;
        scrollbar-color:rgba(255,255,255,.42) transparent;
      }
      .nav .links::-webkit-scrollbar{height:4px;}
      .nav .links::-webkit-scrollbar-track{background:transparent;}
      .nav .links::-webkit-scrollbar-thumb{background:rgba(255,255,255,.42);border-radius:99px;}
      .nav .links a,
      .nav .links .nav-drop-btn{padding:7px 10px;font-size:13.5px;white-space:nowrap;flex:0 0 auto;}
      .nav .user-info{margin-left:8px;}

      .nav{padding:7px 12px;}
      .nav .brand{font-size:13px;letter-spacing:.3px;gap:6px;}
      .nav .brand .dot{width:8px;height:8px;}

      .nav .links .theme-btn,
      .nav .links .notif-bell,
      .nav .links .nav-coins,
      .nav .links .nav-become-admin{display:none !important;}

      .nav .links .user-info{display:none !important;}
      .nav .links .nav-set-text{
        display:flex !important;align-items:center;gap:6px;
        min-height:46px;padding:12px 14px;font-size:15px;
        color:var(--fg);border-radius:9px;
      }
      .nav .links .nav-set-text:hover,
      .nav .links .nav-set-text.active{background:var(--soft);}
      .nav-search{margin:0 8px;flex:1 1 auto;min-width:0;position:relative;}
      .nav-search input{height:38px;padding:0 12px;cursor:pointer;}
      .nav-search .nav-search-btn{display:none;}
      .nav-search .nav-search-go{
        display:block;position:absolute;inset:0;z-index:3;
        border-radius:inherit;
      }

      .wrap{padding:14px 12px 18px;}
      .footnote{margin-top:18px;}

      .profile-header{flex-direction:column;align-items:flex-start;gap:14px;}
      .profile-avatar{width:78px;height:78px;border-width:2px;}
      .btn{white-space:nowrap;}
      .card{padding:20px 16px;}
      .friend-list{grid-template-columns:minmax(0, 1fr);}
    }

    @media (max-width: 768px){
      input:not([type]), input[type="text"], input[type="password"],
      input[type="number"], input[type="email"], input[type="search"],
      input[type="url"], input[type="tel"], input[type="date"],
      input[type="datetime-local"], input[type="time"], textarea{
        font-size: 16px !important;
      }

      .btn{min-height:44px;padding:12px 18px;}
      .btn.sm{min-height:38px;padding:9px 14px;}
      .btn.xs{min-height:32px;padding:6px 10px;}
      .nav .links a,
      .nav .links .nav-drop-btn{min-height:44px;display:inline-flex;align-items:center;}
      .nav-search input{height:44px;}
      .nav-search button{min-width:44px;min-height:44px;}
      .notif-bell{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;}
      .like-btn{padding:13px 10px;margin:-9px -2px;}

      body{font-size:15px;line-height:1.7;}
      h1{font-size:22px;}
      h2{font-size:18px;}
      h3{font-size:16px;}
      .post-title{font-size:16px;line-height:1.5;}
      .post-content{font-size:15.5px;line-height:1.85;}
      .md-content p{line-height:1.8;}

      .card{padding:16px 14px;border-radius:12px;}
      .sub{margin-bottom:14px;}
      .msg-content{max-width:84%;}
      .comment{padding:11px 0;}

      .nav{
        padding-left:max(12px, env(safe-area-inset-left));
        padding-right:max(12px, env(safe-area-inset-right));
      }
      .wrap{padding-bottom:calc(16px + env(safe-area-inset-bottom));}
      .games-page{padding-bottom:calc(20px + env(safe-area-inset-bottom));}
      .flashes{padding-bottom:0;}
    }

    @media (hover: none){
      .btn:hover{box-shadow:none;}
      .card:hover{}
      .post-item:hover,
      .notif-item:hover,
      .friend-card:hover,
      .msg:hover .msg-actions{background:transparent;}
      tbody tr:hover{background:transparent;}
      .nav .links a:hover{background:transparent;color:#d8d8d8;}
      .nav .links a.active:hover{background:#fff;color:#111;}
    }

    @media (max-width: 768px){
      a, button, .btn, .tag, .like-btn{
        -webkit-tap-highlight-color: rgba(0,0,0,.06);
      }
      input:not([type="checkbox"]):not([type="radio"]),
      textarea, select{max-width:100%;}
      .table-scroll{-webkit-overflow-scrolling:touch;}

      .avatar-effect::after,.avatar-effect::before{animation:none!important;}
      .msg .body{transition:none;}
      .msg.effect-firefly .body,.msg.effect-moon .body,.msg.effect-wind .body,
      .msg.effect-starring .body,.msg.effect-flow .body,.msg.effect-rainbow .body,
      .msg.effect-popular .body{animation:none!important;}

      .send-bar{flex-direction:column;align-items:stretch;gap:8px;}
      .send-bar .input-area{width:100%;}
      .send-bar .row{justify-content:flex-end;flex-wrap:wrap;gap:8px;}
      .chat-box{height:56vh;min-height:280px;padding:14px 12px;}
      .msg{gap:8px;margin-bottom:14px;}
      .msg .head{gap:6px;}
      .msg .msg-actions{max-width:100%;}
      .file-attachment img{max-width:100%;max-height:60vh;}
      .file-attachment video{max-width:100%;}
      .md-content img{max-width:100%;height:auto;}
    }

        .nav .user-info .nav-coins{
      display:inline-flex;align-items:center;gap:5px;color:#fff;font-weight:700;font-size:14px;
      text-decoration:none;padding:5px 14px;border-radius:20px;
      background:linear-gradient(135deg,#3a3a3a,#222222);
      border:1px solid rgba(255,255,255,.25);
      box-shadow:0 2px 8px rgba(0,0,0,.3);
      transition:all .2s ease;cursor:pointer;
    }
    .nav .user-info .nav-coins:hover{
      border-color:#fff;box-shadow:0 0 10px rgba(255,255,255,.25), 0 2px 10px rgba(0,0,0,.3);
      transform:translateY(-1px);
    }
    .nav .user-info .nav-coins .coin-ico{font-size:13px;animation:coinBob 2.2s ease-in-out infinite;}
    .nav .user-info .nav-coins .coin-num{min-width:14px;text-align:center;}
    @keyframes coinBob{0%,100%{transform:translateY(0) rotate(-6deg);}50%{transform:translateY(-2px) rotate(6deg);}}

    .avatar-wrap{display:inline-block;position:relative;flex-shrink:0;line-height:0;isolation:isolate;}
    .avatar-wrap .avatar{border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.18);}
    .avatar-effect::after,.avatar-effect::before{
      content:'';position:absolute;border-radius:50%;z-index:-1;pointer-events:none;
    }
    .avatar-effect::after{top:-12px;right:-12px;bottom:-12px;left:-12px;transition:all .3s;}
    .avatar-effect::before{top:-4px;right:-4px;bottom:-4px;left:-4px;transition:all .3s;}
    @keyframes haloPulse{0%,100%{box-shadow:0 0 0 2px rgba(255,215,0,.35),0 0 12px rgba(255,215,0,.45);}50%{box-shadow:0 0 0 5px rgba(255,215,0,.6),0 0 26px rgba(255,215,0,.75);}}
    @keyframes avaSpin{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
    @keyframes avaFloat{0%,100%{transform:translateY(0);opacity:.8;}50%{transform:translateY(-4px);opacity:1;}}
    @keyframes avaTwinkle{0%,100%{opacity:.35;transform:scale(.8);}50%{opacity:1;transform:scale(1.2);}}
    @keyframes jewelGlow{0%,100%{filter:drop-shadow(0 0 3px currentColor);}50%{filter:drop-shadow(0 0 8px currentColor);}}
    @keyframes wingFlap{0%,100%{transform:scaleX(1);}50%{transform:scaleX(1.15);}}
    @keyframes flameFlicker{0%,100%{transform:scale(1);}50%{transform:scale(1.08);}}

    .avatar-effect-halo::after{
      border-radius:50% 50% 48% 48%;
      background:
        radial-gradient(ellipse 12px 16px at 50% 0%, rgba(100,180,255,.95) 0 6px, transparent 7px),
        radial-gradient(ellipse 14px 12px at 50% 100%, rgba(190,110,255,.95) 0 7px, transparent 8px),
        radial-gradient(ellipse 18px 9px at 4% 22%, rgba(255,215,0,.85) 0 6px, transparent 7px),
        radial-gradient(ellipse 18px 9px at 96% 22%, rgba(255,215,0,.85) 0 6px, transparent 7px),
        radial-gradient(ellipse 14px 8px at 8% 78%, rgba(255,200,80,.7) 0 5px, transparent 6px),
        radial-gradient(ellipse 14px 8px at 92% 78%, rgba(255,200,80,.7) 0 5px, transparent 6px),
        conic-gradient(from 0deg, rgba(255,215,0,0), rgba(255,226,120,.95), rgba(255,255,255,.35), rgba(255,226,120,.95), rgba(255,215,0,0));
      animation:avaSpin 6s linear infinite;filter:drop-shadow(0 0 6px rgba(255,210,0,.85));
    }
    .avatar-effect-halo::before{
      border-radius:50% 50% 45% 45%;
      box-shadow:inset 0 0 0 2px rgba(255,215,0,.55),0 0 0 1px rgba(255,215,0,.35),0 0 18px rgba(255,205,0,.7);
      animation:haloPulse 2.4s ease-in-out infinite;
    }
    .avatar-effect-firefly::after{
      background:
        radial-gradient(circle at 22% 26%, rgba(249,248,113,.95), transparent 8%),
        radial-gradient(circle at 78% 32%, rgba(180,255,160,.9), transparent 7%),
        radial-gradient(circle at 36% 78%, rgba(255,240,150,.9), transparent 6%),
        radial-gradient(circle at 74% 76%, rgba(200,255,180,.85), transparent 7%),
        radial-gradient(circle at 50% 8%, rgba(255,230,120,.9), transparent 8%),
        radial-gradient(circle at 50% 92%, rgba(170,255,140,.85), transparent 8%),
        radial-gradient(circle at 50% 50%, rgba(160,255,140,.18), transparent 62%);
      animation:avaFloat 3.2s ease-in-out infinite;
    }
    .avatar-effect-firefly::before{
      border-radius:45%;
      box-shadow:0 0 0 2px rgba(170,230,120,.5),0 0 14px rgba(180,255,150,.65);
      animation:haloPulse 3s ease-in-out infinite;
    }
    .avatar-effect-moon::after{
      background:
        radial-gradient(circle at 18% 22%, rgba(205,222,255,0) 0 6px, rgba(205,222,255,.9) 7px 9px, transparent 10px),
        radial-gradient(circle at 82% 78%, rgba(255,255,255,.95) 0 3px, transparent 4px),
        radial-gradient(circle at 78% 74%, rgba(255,255,255,.6) 0 3px, transparent 4px),
        conic-gradient(from 0deg, rgba(160,190,230,0), rgba(205,222,255,.95), rgba(120,160,210,.25), rgba(215,232,255,.95), rgba(160,190,230,0));
      animation:avaSpin 9s linear infinite;filter:drop-shadow(0 0 6px rgba(150,185,235,.85));
    }
    .avatar-effect-moon::before{
      box-shadow:0 0 0 2px rgba(150,190,240,.5),0 0 14px rgba(165,200,245,.7);
      animation:haloPulse 4s ease-in-out infinite;
    }
    .avatar-effect-wind::after{
      background:
        radial-gradient(ellipse 8px 18px at 15% 50%, rgba(150,226,99,.85) 0 5px, transparent 6px),
        radial-gradient(ellipse 8px 18px at 85% 50%, rgba(150,226,99,.85) 0 5px, transparent 6px),
        radial-gradient(ellipse 18px 8px at 50% 12%, rgba(120,210,90,.8) 0 5px, transparent 6px),
        radial-gradient(ellipse 18px 8px at 50% 88%, rgba(120,210,90,.8) 0 5px, transparent 6px),
        conic-gradient(from 0deg, rgba(86,171,47,0), rgba(150,226,99,.95), rgba(86,171,47,.15), rgba(180,232,140,.95), rgba(86,171,47,0));
      animation:avaSpin 7s linear infinite reverse;filter:drop-shadow(0 0 5px rgba(120,205,95,.75));
    }
    .avatar-effect-wind::before{
      border-radius:42%;
      box-shadow:0 0 0 2px rgba(110,200,120,.5),0 0 14px rgba(145,222,150,.7);
      animation:wingFlap 3s ease-in-out infinite;
    }
    .avatar-effect-starring::after{
      top:-3px;right:-3px;bottom:-3px;left:-3px;
      border-radius:50%;
      background:conic-gradient(from 0deg,#667eea,#9f7aea,#f5576c,#ffd700,#667eea);
      animation:avaSpin 16s linear infinite;filter:drop-shadow(0 0 4px rgba(185,130,235,.6));
    }
    .avatar-effect-starring::before{
      top:-7px;right:-7px;bottom:-7px;left:-7px;
      background:
        radial-gradient(circle at 50% 4%, #fff 0 2px, transparent 2.6px),
        radial-gradient(circle at 96% 50%, #fff 0 2px, transparent 2.6px),
        radial-gradient(circle at 50% 96%, #ffe9a8 0 2px, transparent 2.6px),
        radial-gradient(circle at 4% 50%, #c9b3ff 0 2px, transparent 2.6px),
        radial-gradient(circle at 84% 16%, #fff 0 1.4px, transparent 1.8px),
        radial-gradient(circle at 84% 84%, #ffe9a8 0 1.4px, transparent 1.8px),
        radial-gradient(circle at 16% 84%, #c9b3ff 0 1.4px, transparent 1.8px),
        radial-gradient(circle at 16% 16%, #fff 0 1.4px, transparent 1.8px);
      animation:avaTwinkle 2.8s ease-in-out infinite;
    }
    .avatar-effect-flow::after{
      top:-3px;right:-3px;bottom:-3px;left:-3px;
      border-radius:50%;
      background:
        conic-gradient(from 0deg, rgba(255,255,255,0) 0deg, rgba(255,255,255,0) 250deg, rgba(255,255,255,.95) 315deg, rgba(255,255,255,0) 360deg),
        conic-gradient(from 0deg, #ff6ec4, #7873f5, #43e97b, #38f9d7, #ff6ec4);
      animation:avaSpin 10s linear infinite;filter:drop-shadow(0 0 5px rgba(125,120,245,.75));
    }
    .avatar-effect-flow::before{
      top:-7px;right:-7px;bottom:-7px;left:-7px;
      background:
        radial-gradient(circle at 50% 4%, rgba(255,255,255,.9) 0 1.8px, transparent 2.4px),
        radial-gradient(circle at 96% 50%, rgba(255,255,255,.85) 0 1.8px, transparent 2.4px),
        radial-gradient(circle at 50% 96%, rgba(214,245,255,.9) 0 1.8px, transparent 2.4px),
        radial-gradient(circle at 4% 50%, rgba(255,209,236,.9) 0 1.8px, transparent 2.4px);
      animation:avaTwinkle 3.4s ease-in-out infinite;
    }
    .avatar-effect-rainbow::after{
      background:
        radial-gradient(circle at 12% 50%, rgba(255,255,255,.9) 0 5px, transparent 6px),
        radial-gradient(circle at 20% 50%, rgba(255,255,255,.85) 0 6px, transparent 7px),
        radial-gradient(circle at 88% 50%, rgba(255,255,255,.9) 0 5px, transparent 6px),
        radial-gradient(circle at 80% 50%, rgba(255,255,255,.85) 0 6px, transparent 7px),
        conic-gradient(#ff3b3b,#ff9f1a,#fff04d,#2ecc71,#3a86ff,#9b5de5,#ff3b3b);
      animation:avaSpin 5s linear infinite;filter:drop-shadow(0 0 6px rgba(255,120,200,.7));
    }
    .avatar-effect-rainbow::before{box-shadow:0 0 0 2px rgba(255,120,200,.45),0 0 14px rgba(120,150,255,.6);}
    .avatar-effect-popular::after{
      background:
        radial-gradient(circle at 35% 35%, rgba(255,150,220,.9) 0 5px, transparent 6px),
        radial-gradient(circle at 65% 35%, rgba(255,150,220,.9) 0 5px, transparent 6px),
        radial-gradient(circle at 50% 55%, rgba(255,120,200,.85) 0 7px, transparent 8px);
      box-shadow:0 0 0 3px rgba(120,130,240,.5),0 0 20px rgba(240,147,251,.6);
      animation:haloPulse 2.6s ease-in-out infinite,avaTwinkle 2.5s ease-in-out infinite;
    }
    .avatar-effect-popular::before{box-shadow:0 0 0 1px rgba(240,147,251,.4);}
    .avatar-effect-admin::after,.avatar-effect-admin::before{box-shadow:none;background:none;animation:none;opacity:0;}
    .avatar-effect-fire::after{
      clip-path:polygon(50% 0%,55% 35%,75% 25%,60% 55%,80% 80%,50% 65%,20% 80%,40% 55%,25% 25%,45% 35%);
      background:linear-gradient(135deg,#ff416c,#ff4b2b,#f5af19);
      box-shadow:0 0 0 3px rgba(255,65,108,.5),0 0 20px rgba(245,120,60,.7);
      animation:flameFlicker 1.2s ease-in-out infinite;
    }
    .avatar-effect-ocean::after{
      background:
        radial-gradient(ellipse 16px 6px at 30% 50%, rgba(109,213,237,.9) 0 5px, transparent 6px),
        radial-gradient(ellipse 16px 6px at 70% 50%, rgba(109,213,237,.9) 0 5px, transparent 6px),
        radial-gradient(ellipse 14px 5px at 50% 50%, rgba(33,147,176,.9) 0 4px, transparent 5px);
      box-shadow:0 0 0 3px rgba(33,147,176,.5),0 0 20px rgba(80,200,240,.7);
      animation:avaFloat 3s ease-in-out infinite;
    }
    .avatar-effect-forest::after{
      background:
        radial-gradient(ellipse 7px 16px at 25% 50%, rgba(56,239,125,.85) 0 5px, transparent 6px),
        radial-gradient(ellipse 7px 16px at 75% 50%, rgba(56,239,125,.85) 0 5px, transparent 6px),
        radial-gradient(circle at 50% 25%, rgba(170,255,180,.8) 0 4px, transparent 5px);
      box-shadow:0 0 0 3px rgba(17,153,142,.5),0 0 20px rgba(60,220,130,.7);
      animation:wingFlap 3.5s ease-in-out infinite;
    }
    .avatar-effect-purple::after{
      clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
      background:conic-gradient(from 0deg,#667eea,#764ba2,#9f7aea,#667eea);
      box-shadow:0 0 0 3px rgba(102,126,234,.5),0 0 20px rgba(150,110,240,.7);
      animation:haloPulse 3s ease-in-out infinite,avaSpin 8s linear infinite;
    }
    .avatar-effect-sunset::after{
      background:
        radial-gradient(circle at 25% 40%, rgba(255,200,80,.9) 0 6px, transparent 7px),
        radial-gradient(circle at 75% 60%, rgba(250,112,154,.9) 0 6px, transparent 7px),
        radial-gradient(ellipse 24px 8px at 50% 50%, rgba(255,160,120,.8) 0 5px, transparent 6px);
      box-shadow:0 0 0 3px rgba(250,112,154,.5),0 0 20px rgba(255,200,80,.7);
      animation:avaFloat 4s ease-in-out infinite;
    }
    .avatar-effect-neon::after{
      clip-path:polygon(20% 0%,80% 0%,100% 50%,80% 100%,20% 100%,0% 50%);
      background:#0ff;
      box-shadow:0 0 0 3px rgba(0,255,255,.55),0 0 20px rgba(0,255,255,.8);
      animation:neonPulse 1.6s ease-in-out infinite;
    }
    .avatar-effect-galaxy::after{
      background:
        radial-gradient(circle at 30% 30%, rgba(255,255,255,.9) 0 2px, transparent 3px),
        radial-gradient(circle at 70% 20%, rgba(255,255,255,.8) 0 2px, transparent 3px),
        radial-gradient(circle at 60% 70%, rgba(200,180,255,.85) 0 3px, transparent 4px),
        radial-gradient(circle at 40% 75%, rgba(180,200,255,.85) 0 2px, transparent 3px),
        radial-gradient(circle at 50% 50%, rgba(90,80,180,.6) 0 40%, transparent 70%);
      box-shadow:0 0 0 3px rgba(90,80,180,.6),0 0 22px rgba(140,120,255,.7);
      animation:avaTwinkle 3s ease-in-out infinite;
    }
    .avatar-effect-aurora::after{
      background:
        radial-gradient(ellipse 20px 8px at 50% 8%, rgba(120,255,240,.9) 0 5px, transparent 7px),
        radial-gradient(ellipse 16px 7px at 20% 85%, rgba(140,160,255,.85) 0 4px, transparent 6px),
        radial-gradient(ellipse 16px 7px at 80% 85%, rgba(255,140,220,.85) 0 4px, transparent 6px),
        conic-gradient(from 120deg, rgba(34,211,238,0), rgba(34,211,238,.95), rgba(129,140,248,.7), rgba(167,139,250,.6), rgba(34,211,238,0));
      animation:avaSpin 8s linear infinite;filter:drop-shadow(0 0 8px rgba(34,211,238,.85));
    }
    .avatar-effect-aurora::before{box-shadow:0 0 0 2px rgba(34,211,238,.6),0 0 18px rgba(34,211,238,.55);}
    .avatar-effect-meteor::after{
      background:
        radial-gradient(circle at 30% 20%, rgba(255,255,255,.95) 0 2px, transparent 3px),
        radial-gradient(circle at 70% 30%, rgba(196,181,253,.9) 0 2px, transparent 3px),
        conic-gradient(from 45deg, rgba(167,139,250,0) 0deg, rgba(196,181,253,.95) 40deg,
          rgba(255,255,255,.95) 70deg, rgba(196,181,253,.5) 100deg, rgba(167,139,250,0) 140deg);
      animation:avaSpin 2.8s linear infinite;filter:drop-shadow(0 0 6px rgba(167,139,250,.9));
    }
    .avatar-effect-meteor::before{box-shadow:0 0 0 2px rgba(167,139,250,.6),0 0 16px rgba(167,139,250,.6);}

    .msg .body[class*="bubble-"]{position:relative;overflow:visible;}
    .msg .body[class*="bubble-"]::before{
      content:'';position:absolute;width:12px;height:12px;left:-6px;top:12px;
      background:inherit;background-size:inherit;background-position:inherit;
      clip-path:polygon(0 0,100% 50%,0 100%);transform:rotate(-45deg);
      z-index:-1;opacity:.95;filter:drop-shadow(0 1px 1px rgba(0,0,0,.08));
    }
    .msg.me .body[class*="bubble-"]::before{left:auto;right:-6px;clip-path:polygon(100% 0,0 50%,100% 100%);transform:rotate(45deg);}
    .msg .body.bubble-rounded{border-radius:20px;}
    .msg .body.bubble-plain{
      border-radius:14px 14px 14px 4px;border:1.5px solid var(--line);
      background:var(--card);box-shadow:0 2px 8px rgba(0,0,0,.06);
    }
    .msg.me .body.bubble-plain{border-radius:14px 14px 4px 14px;border-color:var(--fg);background:var(--chat-bubble-me-bg,#111);color:var(--chat-bubble-me-fg,#fff);}
    .msg .body.bubble-soft{
      border-radius:22px 22px 22px 6px;border:1px solid var(--line);
      box-shadow:0 4px 16px rgba(80,110,200,.12),inset 0 0 10px rgba(255,255,255,.6);
      background:linear-gradient(160deg,rgba(255,255,255,.7),rgba(240,245,255,.55));
    }
    .msg.me .body.bubble-soft{border-radius:22px 22px 6px 22px;}
    .msg .body.bubble-ink{
      border-radius:6px 18px 12px 18px;border:1.5px solid var(--fg);
      box-shadow:inset 0 0 0 1px rgba(0,0,0,.04),2px 3px 0 rgba(0,0,0,.1);
      background:var(--card);
    }
    .msg.me .body.bubble-ink{border-radius:18px 6px 18px 12px;background:var(--chat-bubble-me-bg,#111);color:var(--chat-bubble-me-fg,#fff);}
    .msg .body.bubble-star{
      border-radius:18px 18px 18px 6px;border:2.5px solid transparent;
      background:linear-gradient(160deg,#fffdf5,#fff3cf) padding-box,linear-gradient(120deg,#ffd700,#ffec8b,#fff0b0,#ffd700) border-box;
      color:#4a3a00;box-shadow:0 0 0 1px rgba(255,215,0,.35),0 6px 18px rgba(255,200,0,.22);
    }
    .msg.me .body.bubble-star{border-radius:18px 18px 6px 18px;background:linear-gradient(160deg,#fff8e1,#ffe9a8) padding-box,linear-gradient(120deg,#ffd700,#fff0b0,#ffec8b,#ffd700) border-box;color:#4a3a00;}
    .msg .body.bubble-star::after{
      content:'✦';position:absolute;top:-10px;right:-6px;font-size:16px;color:#ffd700;
      text-shadow:0 0 6px #ffd700,0 0 12px #ffec8b;animation:avaTwinkle 2s ease-in-out infinite;
    }
    .msg .body.bubble-wave{
      border-radius:16px;border:2px solid transparent;
      background:linear-gradient(160deg,#f0fff7,#e6fff9) padding-box,linear-gradient(180deg,#43e97b,#38f9d7) border-box;
      box-shadow:0 4px 16px rgba(60,200,150,.15);
    }
    .msg.me .body.bubble-wave{background:linear-gradient(160deg,#eafff5,#d5fff3) padding-box,linear-gradient(180deg,#38f9d7,#43e97b) border-box;color:#1f4a3a;}
    .msg .body.bubble-wave::after{
      content:'〰';position:absolute;bottom:-8px;left:10px;font-size:12px;color:#38f9d7;opacity:.75;
      animation:avaFloat 2.8s ease-in-out infinite;
    }
    .msg .body.bubble-frost{
      border-radius:16px 16px 16px 4px;border:1px solid rgba(165,216,255,.9);
      background:linear-gradient(135deg,#eaf6ff,#f7fbff)!important;color:var(--fg)!important;
      box-shadow:0 4px 18px rgba(120,190,255,.25),inset 0 0 0 1px rgba(255,255,255,.6);
    }
    .msg.me .body.bubble-frost{border-radius:16px 16px 4px 16px;background:linear-gradient(135deg,#eaf6ff,#f8fbff)!important;color:var(--fg)!important;}
    .msg .body.bubble-frost::after{
      content:'❄';position:absolute;top:-9px;left:-5px;font-size:13px;color:#7ec8ff;
      text-shadow:0 0 6px #7ec8ff;animation:avaTwinkle 2.5s ease-in-out infinite;
    }
    .msg .body.bubble-rainbow{
      border-radius:18px 18px 18px 6px;
      background:linear-gradient(135deg,#ff6ec4,#7873f5)!important;color:#fff!important;border:none!important;
      box-shadow:0 0 0 1px rgba(255,255,255,.25),0 6px 20px rgba(120,115,245,.45);
      background-size:200% 200%!important;animation:gradientShift 4s ease infinite;
    }
    .msg.me .body.bubble-rainbow{border-radius:18px 18px 6px 18px;background:linear-gradient(135deg,#43e97b,#38f9d7)!important;}
    .msg .body.bubble-rainbow::after{
      content:'🌈';position:absolute;top:-10px;right:-6px;font-size:14px;
      filter:drop-shadow(0 0 4px rgba(255,255,255,.6));animation:avaFloat 3s ease-in-out infinite;
    }
    .msg .body.bubble-admin{
      border-radius:18px 18px 18px 6px;border:2.5px solid transparent;
      background:linear-gradient(160deg,#fffdf3,#fff4d6) padding-box,linear-gradient(120deg,#ffd700,#c9a227,#ffe9a8,#4aa3ff,#ffd700) border-box;
      background-size:auto,250% 250%;color:#3a2c00;
      box-shadow:0 0 0 1px rgba(255,215,0,.45),0 0 18px rgba(255,200,0,.55),0 8px 22px rgba(0,0,0,.12);
      animation:adminAura 3.2s ease-in-out infinite;
    }
    .msg.me .body.bubble-admin{border-radius:18px 18px 6px 18px;background:linear-gradient(160deg,#fff7df,#ffeab0) padding-box,linear-gradient(120deg,#ffd700,#e9c64a,#fff0b0,#4aa3ff,#ffd700) border-box;background-size:auto,250% 250%;color:#1a1200;}
    .msg .body.bubble-admin::after{
      content:'🔰';position:absolute;top:-10px;right:-4px;font-size:16px;
      filter:drop-shadow(0 0 4px rgba(255,215,0,.8));animation:avaTwinkle 2.2s ease-in-out infinite;
    }
    .msg .body.bubble-super{
      border-radius:20px 20px 20px 6px;border:3px solid transparent;
      background:linear-gradient(160deg,#0d1430,#172146) padding-box,linear-gradient(120deg,#ff6ec4,#7873f5,#43e97b,#38f9d7,#ffd700,#ff6ec4) border-box;
      background-size:auto,350% 350%;color:#fff;
      box-shadow:0 0 0 1px rgba(255,255,255,.3),0 0 26px rgba(120,115,245,.75),0 0 44px rgba(255,110,196,.5),0 10px 26px rgba(0,0,0,.22);
      animation:superAura 4s linear infinite;
    }
    .msg.me .body.bubble-super{border-radius:20px 20px 6px 20px;background:linear-gradient(160deg,#101a3a,#1b2a55) padding-box,linear-gradient(120deg,#43e97b,#38f9d7,#ff6ec4,#7873f5,#ffd700,#43e97b) border-box;background-size:auto,350% 350%;}
    .msg .body.bubble-super::after{
      content:'👑';position:absolute;top:-12px;right:-6px;font-size:18px;
      filter:drop-shadow(0 0 6px rgba(255,215,0,.9));animation:avaTwinkle 1.6s ease-in-out infinite;
    }
    @keyframes adminAura{0%,100%{box-shadow:0 0 0 1px rgba(255,215,0,.45),0 0 14px rgba(255,200,0,.45),0 8px 22px rgba(0,0,0,.12);}50%{box-shadow:0 0 0 1px rgba(255,215,0,.65),0 0 24px rgba(255,200,0,.75),0 8px 22px rgba(0,0,0,.14);}}
    @keyframes superAura{0%{background-position:0% 50%,0% 50%;box-shadow:0 0 0 1px rgba(255,255,255,.3),0 0 24px rgba(120,115,245,.8),0 0 44px rgba(255,110,196,.55),0 10px 26px rgba(0,0,0,.22);}50%{background-position:100% 50%,100% 50%;box-shadow:0 0 0 1px rgba(255,255,255,.45),0 0 38px rgba(120,115,245,.95),0 0 62px rgba(255,110,196,.75),0 10px 26px rgba(0,0,0,.26);}100%{background-position:0% 50%,0% 50%;box-shadow:0 0 0 1px rgba(255,255,255,.3),0 0 24px rgba(120,115,245,.8),0 0 44px rgba(255,110,196,.55),0 10px 26px rgba(0,0,0,.22);}}
    .msg .body.bubble-none{border:none;background:transparent;padding-left:0;}
    .msg.me .body.bubble-none{border:none;background:transparent;color:var(--fg);}
    .msg .body.bubble-line{background:transparent;border:2px solid var(--line);}
    .msg.me .body.bubble-line{background:transparent;color:var(--fg);border-color:var(--fg);}
    .msg .body.bubble-solid{border-radius:14px;}
    .msg .body.bubble-galaxy{
      border-radius:18px 18px 18px 6px;border:2.5px solid transparent;
      background:radial-gradient(circle at 30% 30%,#1e1b4b,#0f0c29 60%,#302b63) padding-box,
        linear-gradient(120deg,#667eea,#9f7aea,#22d3ee,#667eea) border-box;
      color:#e0e7ff;box-shadow:0 0 0 1px rgba(102,126,234,.35),0 8px 22px rgba(60,60,140,.35);
      background-size:auto,250% 250%;animation:superAura 5s linear infinite;
    }
    .msg.me .body.bubble-galaxy{color:#e0e7ff;}
    .msg .body.bubble-galaxy::after{
      content:'🌌';position:absolute;top:-10px;right:-5px;font-size:15px;
      filter:drop-shadow(0 0 5px rgba(140,120,255,.8));animation:avaTwinkle 2.4s ease-in-out infinite;
    }

    html[data-theme="dark"] .msg .body.bubble-soft{
      background:linear-gradient(160deg,#232833,#1b202a)!important;color:#e6e8ec!important;
      border-color:#333a46!important;
      box-shadow:0 4px 16px rgba(0,0,0,.45),inset 0 0 10px rgba(255,255,255,.03)!important;
    }
    html[data-theme="dark"] .msg .body.bubble-wave{
      background:linear-gradient(160deg,#16241f,#1a2b26) padding-box,linear-gradient(180deg,#43e97b,#38f9d7) border-box!important;
      color:#d6f5e6!important;
    }
    html[data-theme="dark"] .msg .body.bubble-frost{
      background:linear-gradient(135deg,#1b2430,#141b25)!important;color:#e2eefc!important;
      border-color:#2d3d52!important;
      box-shadow:0 4px 18px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.05)!important;
    }
    html[data-theme="dark"] .msg .body.bubble-plain{background:var(--card);color:var(--fg);}
    html[data-theme="dark"] .msg .body.bubble-star{
      background:linear-gradient(160deg,#2a2513,#332c15) padding-box,linear-gradient(120deg,#ffd700,#ffec8b,#fff0b0,#ffd700) border-box!important;
      color:#ffeeb0!important;
    }
    html[data-theme="dark"] .msg .body.bubble-admin{
      background:linear-gradient(160deg,#2a2513,#332c15) padding-box,linear-gradient(120deg,#ffd700,#c9a227,#ffe9a8,#4aa3ff,#ffd700) border-box!important;
      color:#ffeeb0!important;
    }

    .msg.effect-halo .body{box-shadow:0 0 0 3px rgba(255,215,0,.4),0 0 18px rgba(255,215,0,.5);border-color:#ffd700;}
    .msg.effect-firefly .body{background:#1a1a2e!important;color:#fff!important;border:none!important;animation:sparkle 3s ease-in-out infinite;}
    .msg.effect-moon .body{background:linear-gradient(135deg,#2c3e50,#4ca1af)!important;color:#fff!important;border:none!important;animation:gradientShift 5s ease infinite;}
    .msg.effect-wind .body{background:linear-gradient(135deg,#56ab2f,#a8e063)!important;color:#fff!important;border:none!important;animation:gradientShift 4s ease infinite;}
    .msg.effect-starring .body{background:linear-gradient(135deg,#667eea,#9f7aea,#f5576c)!important;background-size:200% 200%;color:#fff!important;border:none!important;animation:gradientShift 4s ease infinite,sparkle 2s ease-in-out infinite;}
    .msg.effect-flow .body{background:linear-gradient(135deg,#ff6ec4,#7873f5,#43e97b,#38f9d7)!important;background-size:300% 300%;color:#fff!important;border:none!important;animation:gradientShift 5s ease infinite;}
    .msg.effect-rainbow .body{
      background:linear-gradient(90deg,#ff0000,#ff7f00,#ffff00,#00ff00,#0000ff,#4b0082,#9400d3,#ff0000)!important;
      background-size:400% 400%!important;color:#fff!important;border:none!important;
      animation:rainbow 5s linear infinite!important;
    }
    .msg.effect-popular .body{
      background:linear-gradient(135deg,#667eea,#764ba2,#f093fb,#f5576c)!important;
      background-size:300% 300%!important;color:#fff!important;border:none!important;
      animation:gradientShift 4s ease infinite, popularPulse 2s ease-in-out infinite!important;
    }

    .tag.malltitle{
      background:#111;color:#fff;border-color:var(--fg);font-weight:700;
      letter-spacing:.5px;
    }
    .tag.badge-title{background:#111;color:#fff;border-color:var(--fg);}
    .tag.badge-silver{background:linear-gradient(135deg,#c0c0c0,#e8e8e8,#a8a8a8,#c0c0c0);background-size:200% 200%;color:var(--fg-2);border-color:#b0b0b0;animation:gradientShift 4s ease infinite;font-weight:600;}
    .tag.badge-blue{background:#e3f0ff;color:#1d5fa8;border-color:#a8cff0;}
    .tag.badge-green{background:#e6f6e9;color:#2f7d3e;border-color:#b4ddbb;}
    .tag.badge-indigo{background:#ece9ff;color:#5a4bd1;border-color:#c6bcff;}
    .tag.badge-teal{background:#e0f5f3;color:#1c7f77;border-color:#a9ddd8;}
    .tag.badge-orange{background:#fff1e0;color:#b46a12;border-color:#f0c89a;}
    .tag.badge-cyan{background:#e0f7fb;color:#157f96;border-color:#a8dde8;}
    .tag.badge-gray{background:#f0f0f0;color:var(--fg-2);border-color:#ccc;}
    .tag.badge-navy{background:#e3e9f5;color:#2b4a7e;border-color:#b4c4e0;}
    .tag.badge-purple{background:linear-gradient(135deg,#667eea,#764ba2,#9f7aea,#667eea);background-size:200% 200%;color:#fff;border:none;animation:gradientShift 3s ease infinite;font-weight:600;}
    .tag.badge-gold{background:linear-gradient(135deg,#ffd700,#ffed4e,#f5c500,#ffd700);background-size:200% 200%;color:#5a4500;border:1px solid #ffd700;animation:gradientShift 3s ease infinite,sparkle 2s ease-in-out infinite;font-weight:600;}

    .post-title.glow{
      background:linear-gradient(90deg,#111111,#555555,#111111);
      -webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800;
      animation:gradientShift 3s ease infinite;
    }
    .post-title.user-pinned::after{content:' 📌';font-size:.8em;}

    .horn-banner{
      position:fixed;top:60px;left:0;right:0;z-index:99;
      background:linear-gradient(90deg,#111111,#333333);
      color:#fff;font-size:14px;font-weight:600;text-align:center;
      padding:9px 16px;box-shadow:0 4px 16px rgba(0,0,0,.35);
      animation:breathe 2s ease-in-out infinite;
    }
    .horn-banner a{color:#ddd;text-decoration:underline;}
    .site-announcement{
      background:linear-gradient(90deg,#222,#444);color:#fff;
      text-align:center;padding:8px 16px;font-size:14px;font-weight:500;
      box-shadow:0 4px 12px rgba(0,0,0,.18);
    }
    .site-announcement strong{margin-right:4px;}
