/*
 * JLPT180 Daily Board Rank Side/My Rank CSS owner.
 * P4.43: moved side/me/npc selectors from daily-board-rank.css.
 */
#tdb-rank-board .tdb-side-card{
            position: relative;
            overflow: hidden;
            border: 4px solid rgba(191, 112, 0, .98);
            border-radius: 30px;
            background:
              radial-gradient(circle at 50% 0%, rgba(255,226,144,.68), transparent 28%),
              radial-gradient(circle at 0% 14%, rgba(185,226,255,.82), transparent 40%),
              radial-gradient(circle at 100% 78%, rgba(255,190,215,.30), transparent 34%),
              linear-gradient(180deg, rgba(255,252,244,.98), rgba(231,246,255,.91));
            box-shadow:
              0 30px 56px rgba(5,58,116,.30),
              0 0 0 5px rgba(255,255,255,.96) inset,
              0 0 0 2px rgba(255,210,104,.86),
              0 0 44px rgba(255,188,70,.30);
            backdrop-filter: blur(8px);
          }


          #tdb-rank-board .tdb-side-card::before,
#tdb-rank-board .tdb-side-card::after{
            content: "";
            position: absolute;
            pointer-events: none;
          }


          #tdb-rank-board .tdb-side-card::before{
            inset: 13px;
            border: 2px solid rgba(232, 169, 38, .62);
            border-radius: 24px;
            background:
              linear-gradient(90deg, rgba(216,142,0,.42), rgba(216,142,0,0)) left 16px top 16px / 82px 2px no-repeat,
              linear-gradient(180deg, rgba(216,142,0,.42), rgba(216,142,0,0)) left 16px top 16px / 2px 82px no-repeat,
              linear-gradient(270deg, rgba(216,142,0,.42), rgba(216,142,0,0)) right 16px top 16px / 82px 2px no-repeat,
              linear-gradient(180deg, rgba(216,142,0,.42), rgba(216,142,0,0)) right 16px top 16px / 2px 82px no-repeat,
              linear-gradient(90deg, rgba(216,142,0,.42), rgba(216,142,0,0)) left 16px bottom 16px / 82px 2px no-repeat,
              linear-gradient(0deg, rgba(216,142,0,.42), rgba(216,142,0,0)) left 16px bottom 16px / 2px 82px no-repeat,
              linear-gradient(270deg, rgba(216,142,0,.42), rgba(216,142,0,0)) right 16px bottom 16px / 82px 2px no-repeat,
              linear-gradient(0deg, rgba(216,142,0,.42), rgba(216,142,0,0)) right 16px bottom 16px / 2px 82px no-repeat;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,.72), inset 0 0 28px rgba(255,204,86,.10);
          }


          #tdb-rank-board .tdb-side-card::after{
            left: 28px;
            right: 28px;
            top: 13px;
            height: 54px;
            background:
              repeating-linear-gradient(90deg, rgba(15,76,145,.10) 0 1px, transparent 1px 20px),
              linear-gradient(90deg, transparent, rgba(226,166,42,.95), rgba(70,155,229,.58), rgba(226,166,42,.95), transparent);
            clip-path: polygon(0 46%, 42% 46%, 46% 0, 54% 0, 58% 46%, 100% 46%, 100% 54%, 58% 54%, 54% 100%, 46% 100%, 42% 54%, 0 54%);
            opacity: .58;
          }


          #tdb-rank-board .tdb-side{ display: grid; gap: 14px; }


          #tdb-rank-board .tdb-side-card{
            padding: 22px 18px;
            align-self: start;
            background:
              radial-gradient(circle at 50% 0%, rgba(255,225,150,.58), transparent 31%),
              radial-gradient(circle at 100% 100%, rgba(187,225,255,.45), transparent 36%),
              linear-gradient(180deg, rgba(255,255,255,.98), rgba(236,248,255,.92));
          }


          #tdb-rank-board .tdb-side-card .tdb-me-panel::before{
            content: "道 ✦ 氣 ✦ 修";
            display: block;
            margin: -4px 0 10px;
            color: rgba(13,80,154,.14);
            font-family: Georgia, serif;
            font-size: 13px;
            font-weight: 900;
            letter-spacing: .42em;
            text-align: center;
          }


          #tdb-rank-board .tdb-side-title{
            position: relative;
            color: #123f88;
            font-family: Georgia, serif;
            text-align: center;
            font-size: 20px;
            font-weight: 900;
            letter-spacing: .09em;
            text-transform: uppercase;
            margin-bottom: 16px;
            text-shadow: 0 2px 0 rgba(255,255,255,.98);
          }


          #tdb-rank-board .tdb-side-title::before,
#tdb-rank-board .tdb-side-title::after{
            content: "";
            display: inline-block;
            width: 40px;
            height: 2px;
            margin: 0 10px 5px;
            background: linear-gradient(90deg, transparent, rgba(210,138,0,.76), transparent);
          }


          #tdb-rank-board .tdb-me-panel{ display: none; }


          #tdb-rank-board .tdb-me-panel.is-active{ display: block; }


          #tdb-rank-board .tdb-me-top{
            display: grid;
            grid-template-columns: 78px minmax(0, 1fr);
            gap: 14px;
            align-items: center;
          }


          #tdb-rank-board .tdb-me-avatar{
            width: 78px;
            height: 78px;
            border-radius: 24px;
            position: relative;
            overflow: hidden;
            background: rgba(255,255,255,.82);
            border: 3px solid rgba(218, 159, 45, .68);
            box-shadow: 0 14px 24px rgba(20,82,130,.14), 0 0 0 5px rgba(255,255,255,.48);
          }


          #tdb-rank-board .tdb-me-rank{
            color: #d28a00;
            font-size: 40px;
            font-weight: 1000;
            font-family: Georgia, serif;
            line-height: 1;
            text-shadow: 0 2px 0 rgba(255,255,255,.98);
          }


          #tdb-rank-board .tdb-me-name{
            color: #7a471c;
            font-size: 18px;
            font-weight: 1000;
          }


          #tdb-rank-board .tdb-me-stats{
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 9px;
            margin-top: 16px;
          }


          #tdb-rank-board .tdb-me-stat{
            min-height: 72px;
            display: grid;
            place-items: center;
            gap: 3px;
            padding: 9px;
            text-align: center;
            border-radius: 16px;
            border: 2px solid rgba(214, 143, 14, .48);
            background:
              radial-gradient(circle at 50% 0%, rgba(255,232,155,.32), transparent 44%),
              linear-gradient(180deg, rgba(255,255,255,.98), rgba(238,249,255,.94));
            box-shadow: 0 10px 20px rgba(20,82,130,.13), inset 0 0 0 1px rgba(255,255,255,.86);
          }


          #tdb-rank-board .tdb-me-stat img{ width: 25px; height: 25px; object-fit: contain; }


          #tdb-rank-board .tdb-me-stat b{ color: #0b4f8d; font-size: 15px; font-weight: 1000; }


          #tdb-rank-board .tdb-me-stat span{ color: #667b8c; font-size: 10px; font-weight: 900; }


          #tdb-rank-board .tdb-npc-avatar{
            display: grid;
            place-items: center;
            background:
              radial-gradient(circle at 38% 28%, rgba(255,255,255,.96), transparent 30%),
              linear-gradient(145deg, #fff7e8, #dff6ff 54%, #f3e5ff);
            border: 2px solid rgba(238, 183, 64, .6);
            box-shadow: 0 12px 24px rgba(19, 86, 155, .16), inset 0 0 0 4px rgba(255,255,255,.58);
          }


          #tdb-rank-board .tdb-npc-avatar span{
            color: #1559c8;
            font-family: Georgia, serif;
            font-size: 36px;
            font-weight: 900;
            text-shadow: 0 3px 0 rgba(255,255,255,.85), 0 0 14px rgba(54,148,255,.26);
          }


          #tdb-rank-board .tdb-me-avatar.tdb-npc-avatar span{ font-size: 28px; }


          #tdb-rank-board .tdb-npc-pill{
            display: inline-flex;
            justify-content: center;
            align-items: center;
            min-height: 20px;
            padding: 0 9px;
            border-radius: 999px;
            color: #8b4e19;
            background: linear-gradient(180deg, rgba(255,245,206,.95), rgba(255,225,143,.78));
            border: 1px solid rgba(214,154,42,.45);
            font-size: 10px;
            font-weight: 1000;
            margin: -2px 0 5px;
          }


          


          


          


        
          #tdb-rank-board .tdb-side-card{
            box-shadow:
              0 32px 64px rgba(5,58,116,.24),
              0 0 0 5px rgba(255,255,255,.96) inset,
              0 0 0 2px rgba(255,210,104,.86),
              0 0 54px rgba(255,188,70,.38),
              0 0 18px rgba(96,190,255,.16);
          }


          #tdb-rank-board .tdb-side-card::before{
            box-shadow:
              inset 0 0 0 1px rgba(255,255,255,.78),
              inset 0 0 32px rgba(255,204,86,.14),
              0 0 22px rgba(255,204,86,.10);
          }


          #tdb-rank-board .tdb-my-realm{
            background: linear-gradient(180deg,#f8fdff 0%,#dbeafe 100%);
            border: 2px solid rgba(96,165,250,.62);
            box-shadow: 0 10px 20px rgba(59,130,246,.12), inset 0 1px 0 rgba(255,255,255,.95);
            color: #1d4ed8;
            font-weight: 1000;
          }


          #tdb-rank-board .tdb-me-stat b{
            color: #0b4d8b;
            text-shadow: 0 0 14px rgba(96,190,255,.18);
          }


          #tdb-rank-board .tdb-me-stat small{
            color: #64748b;
            font-weight: 900;
          }


          #tdb-rank-board .tdb-me-score-streak b{
            color:#ea580c;
            text-shadow:0 0 14px rgba(251,146,60,.24),0 0 24px rgba(249,115,22,.14);
          }


          #tdb-rank-board .tdb-me-score-streak em{
            color:#92400e;
            font-weight:1000;
          }


          #tdb-rank-board .tdb-side-card{
            background:
              radial-gradient(circle at 50% 0%, rgba(151,223,255,.40), transparent 26%),
              radial-gradient(circle at 12% 12%, rgba(255,223,130,.42), transparent 34%),
              linear-gradient(180deg, rgba(255,255,255,.98), rgba(242,250,255,.96));
          }


          #tdb-rank-board .tdb-me-head,
#tdb-rank-board .tdb-side-title{
            background: linear-gradient(135deg,#1d4ed8 0%,#0f766e 55%,#b45309 100%);
            -webkit-background-clip:text; background-clip:text; color:transparent;
            text-shadow:none;
          }


          #tdb-rank-board .tdb-my-card{
            box-shadow: 0 18px 32px rgba(37,99,235,.12), inset 0 1px 0 rgba(255,255,255,.96);
          }


          #tdb-rank-board .tdb-my-avatar{ filter: drop-shadow(0 0 12px rgba(255,210,104,.36)) drop-shadow(0 12px 18px rgba(37,99,235,.15)); }


          #tdb-rank-board .tdb-my-name{
            color:#0b4d8b;
            background:none;
            -webkit-text-fill-color:#0b4d8b;
            font-weight:1000;
            text-shadow:0 1px 0 rgba(255,255,255,.86);
          }


          #tdb-rank-board .tdb-my-realm{
            font-weight:1000;
            border-width:2px;
            box-shadow:
              0 8px 16px rgba(15,23,42,.07),
              inset 0 1px 0 rgba(255,255,255,.94);
          }


          #tdb-rank-board .tdb-me-stat{
            color:#0b4d8b;
            font-weight:900;
          }


          #tdb-rank-board .tdb-me-stat b{
            color:#075985;
            -webkit-text-fill-color:#075985;
            font-weight:1000;
            text-shadow:
              0 1px 0 rgba(255,255,255,.90),
              0 0 10px rgba(14,165,233,.18);
          }


          #tdb-rank-board .tdb-me-score-streak b{
            color:#ea580c;
            -webkit-text-fill-color:#ea580c;
            text-shadow:
              0 1px 0 rgba(255,255,255,.86),
              0 0 10px rgba(249,115,22,.20);
          }


          #tdb-rank-board .tdb-me-stat span{
            color:#475569;
            font-weight:900;
          }