.article-activity{--accent-soft:color-mix(in srgb,var(--accent) 16%,transparent);padding:24px;color:var(--text,#f4eff8)}
.article-board .board-head > .board-tools > #updatedAt{white-space:normal;overflow-wrap:anywhere;line-height:1.5;text-align:right}
.article-activity button,.article-activity input,.article-activity select{font:inherit;box-sizing:border-box}
.article-activity svg{width:18px;height:18px;flex-shrink:0}
.article-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.article-weekly-reward{display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;margin-top:16px;padding:12px 14px;border:1px solid var(--line,#ffffff16);border-radius:10px;background:color-mix(in srgb,var(--text) 2%,transparent)}
.article-weekly-reward>div{display:flex;align-items:baseline;gap:10px;min-width:0}
.article-weekly-reward>div>span,.article-weekly-reward>small{font-size:11px;line-height:1.6;color:var(--muted)}
.article-weekly-reward strong{font-size:19px;font-weight:650;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.article-weekly-status{font-size:11px;line-height:1.6;color:var(--muted)}
.article-weekly-reward[data-eligible=true] .article-weekly-status{color:var(--accent)}
.article-weekly-reward>small{margin-left:auto}
@media(max-width:760px){.article-weekly-reward{gap:5px 12px;padding:10px 12px}.article-weekly-status{margin-left:auto}.article-weekly-reward>small{flex-basis:100%;margin-left:0;font-size:10px}}
.article-period-controls{display:flex;align-items:center;gap:12px;margin-left:auto;justify-content:flex-end;flex-wrap:wrap;max-width:100%}
.article-tabs{display:flex;gap:3px;padding:3px;border:1px solid var(--line,#ffffff25);border-radius:10px;background:color-mix(in srgb,var(--text) 3%,transparent)}
.article-tabs button{border:0;border-radius:7px;background:transparent;color:var(--muted,#aaa);padding:8px 18px;cursor:pointer;font-size:13px;font-weight:600;transition:background .15s,color .15s}
.article-tabs button:hover{color:var(--text);background:var(--accent-soft)}
.article-tabs button[aria-pressed=true]{background:var(--accent,#de8bf3);color:#110c13}
.article-date-control{display:flex;align-items:center;gap:14px;min-height:40px;padding:0 12px;border:1px solid var(--line,#ffffff25);border-radius:9px;background:color-mix(in srgb,var(--text) 3%,transparent);font-size:12px}
.article-date-control>span{display:flex;align-items:center;gap:7px;color:var(--muted,#aaa);white-space:nowrap}
.article-date-control svg{width:15px;height:15px;color:var(--accent)}
.article-date-control input{width:128px;min-width:0;padding:7px 0;border:0;background:transparent;color:var(--text);font-size:12px;font-variant-numeric:tabular-nums;color-scheme:dark}
.article-date-control:focus-within{border-color:var(--accent)}
.article-activity :is(button,input,select):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.article-binding-note{font-size:12px;line-height:1.6;color:var(--muted,#aaa)}
.article-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:28px;margin-top:22px;align-items:start}
.article-row{display:grid;grid-template-columns:45px minmax(0,1fr) 60px 80px;gap:12px;align-items:center;min-height:74px;padding:0 12px 0 8px;border:1px solid transparent;border-bottom-color:var(--line,#ffffff16);font-variant-numeric:tabular-nums}
.article-row>:nth-child(n+3){text-align:right}.article-heading{font-size:12px;color:var(--muted);min-height:36px}
.article-identity{display:flex;align-items:center;gap:10px;min-width:0}
.article-avatar{display:block;width:36px;height:36px;flex:0 0 36px;object-fit:cover;border-radius:50%;background:var(--accent-soft);border:1px solid var(--line,#ffffff16);box-sizing:border-box}
.article-author{min-width:0;display:grid;gap:4px;overflow-wrap:anywhere}
.article-author>strong{font-size:14px;font-weight:600;line-height:1.45;letter-spacing:.01em}
.article-author a{width:fit-content;max-width:100%;font-size:12px;font-weight:400;line-height:1.5;color:var(--muted,#aaa);text-decoration:none;transition:color .15s}
.article-author a:hover{color:var(--accent,#de8bf3);text-decoration:none}
.article-author a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
.article-author small{font-size:11px;color:var(--muted)}
.article-score{font-size:22px}.article-rank{font-weight:700;color:var(--muted)}
/* Podium honors stay within the standings, without adding a second leaderboard. */
.article-podium-1{--podium-color:#f5c279;--podium-tint:10%}
.article-podium-2{--podium-color:#c3cddd;--podium-tint:6%}
.article-podium-3{--podium-color:#d7a18a;--podium-tint:5%}
.article-row.article-podium{position:relative;min-height:84px;margin-top:6px;padding:0 12px 0 8px;border:1px solid color-mix(in srgb,var(--podium-color) 20%,transparent);border-radius:10px;background:linear-gradient(100deg,color-mix(in srgb,var(--podium-color) var(--podium-tint),transparent),transparent 75%);box-shadow:inset 2px 0 0 color-mix(in srgb,var(--podium-color) 60%,transparent)}
.article-row.article-podium-1{border-color:color-mix(in srgb,var(--podium-color) 36%,transparent)}
.article-podium .article-avatar{border-color:color-mix(in srgb,var(--podium-color) 65%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--podium-color) 9%,transparent)}
.article-podium .article-score{color:var(--podium-color);font-weight:750}
.article-medal{position:relative;display:grid;place-items:center;width:34px;height:44px;color:var(--podium-color);isolation:isolate;overflow:hidden}
.article-activity .article-medal svg{position:absolute;inset:0;width:100%;height:100%}
.article-medal b{position:relative;padding-top:12px;font-size:17px;line-height:1;font-weight:800}
.article-podium-1 .article-medal::after{content:"";position:absolute;inset:-10px;background:linear-gradient(110deg,transparent 35%,#ffffff55 49%,transparent 63%);transform:translateX(-110%);animation:article-medal-shine 7s ease-in-out infinite;pointer-events:none}
@keyframes article-medal-shine{0%,75%{transform:translateX(-110%)}95%,100%{transform:translateX(110%)}}
.article-submit{min-width:0;display:grid;gap:14px}
.article-form-panel,.article-history-panel{min-width:0;border:1px solid var(--line,#ffffff16);border-radius:14px;background:color-mix(in srgb,var(--text) 2%,transparent);padding:20px}
.article-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}
.article-submit h3{display:flex;align-items:center;gap:8px;font-size:15px;line-height:1.4;margin:0;font-weight:650}
.article-panel-heading h3 svg{width:17px;height:17px;color:var(--accent)}
.article-history-trigger{display:inline-flex;align-items:center;justify-content:center;gap:5px;flex-shrink:0;padding:6px 9px;border:1px solid var(--line,#ffffff25);border-radius:7px;background:transparent;color:var(--muted,#aaa);font-size:11px!important;line-height:1.5;cursor:pointer;transition:color .15s,border-color .15s,background .15s}
.article-history-trigger svg{width:14px;height:14px}
.article-history-trigger:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.article-history-dialog.article-history-panel{width:calc(100% - 32px);max-width:660px;max-height:80dvh;padding:0;background:var(--bg,#110c13);overflow:hidden;border-radius:18px;box-shadow:0 24px 100px #0006}
.article-history-dialog[open]{display:flex;flex-direction:column}
.article-history-header{flex-shrink:0;padding:20px 24px;border-bottom:1px solid var(--line,#ffffff16)}
.article-history-header h3{display:flex;align-items:center;gap:10px;margin:0 40px 0 0;font-size:17px;line-height:32px;font-weight:650;letter-spacing:.02em}
.article-history-symbol{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--accent-soft);color:var(--accent)}
.article-history-symbol svg{width:17px;height:17px}
.article-history-dialog .article-dialog-close{top:20px;right:22px;width:32px;height:32px;border-radius:9px;color:var(--muted);transition:background .15s,color .15s}
.article-history-dialog .article-dialog-close:hover{color:var(--text);background:color-mix(in srgb,var(--text) 6%,transparent)}
.article-history-dialog #articleOwnHistory{min-height:0;padding:18px 24px 24px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--text) 18%,transparent) transparent}
.article-history-dialog #articleOwnHistory::-webkit-scrollbar{width:5px}
.article-history-dialog #articleOwnHistory::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--text) 18%,transparent);border-radius:5px}
.article-history-card{padding:16px;border:1px solid var(--line,#ffffff16);border-radius:11px;background:color-mix(in srgb,var(--text) 2%,transparent)}
.article-history-card+.article-history-card{margin-top:10px}
.article-history-main{display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:0}
.article-history-meta{display:grid;gap:7px;min-width:0}
.article-history-post{display:inline-flex;align-items:center;gap:7px;width:fit-content;max-width:100%;color:var(--text);text-decoration:none;font-size:13px;font-weight:600;line-height:1.5}
.article-history-post:hover{color:var(--accent)}
.article-history-x{font-size:15px;font-weight:400}.article-history-id{color:var(--muted);font:400 10px/1.5 ui-monospace,monospace;margin-left:2px}
.article-history-meta time{font-size:10px;line-height:1.5;color:var(--muted);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.article-history-result{display:flex;align-items:center;gap:18px;flex-shrink:0}
.article-history-status{display:inline-flex;align-items:center;gap:5px;font-size:11px;line-height:1.5;color:var(--muted);white-space:nowrap}
.article-history-status i{width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0;opacity:.8}
.article-history-card[data-status="failed"] .article-history-status{color:light-dark(#b83b50,#f09b9b)}
.article-history-card[data-status="pending"] .article-history-status{color:var(--accent)}
.article-history-score{display:flex;align-items:baseline;justify-content:flex-end;gap:4px;min-width:82px;font-variant-numeric:tabular-nums}
.article-history-score strong{font-size:27px;line-height:1.15;font-weight:700;letter-spacing:-.04em}
.article-history-score>span{font-size:10px;line-height:1.4;color:var(--muted)}
.article-history-feedback{margin:13px 0 0;padding-top:11px;border-top:1px solid var(--line,#ffffff12);color:var(--muted);font-size:12px;line-height:1.7;overflow-wrap:anywhere}
.article-history-feedback>span{display:block;margin-bottom:3px;font-size:10px;font-weight:500;color:var(--muted);opacity:.8}
.article-status-chip{padding:4px 7px;border-radius:5px;background:var(--accent-soft,color-mix(in srgb,var(--accent) 12%,transparent));color:var(--accent);font-size:10px;line-height:1.4;white-space:nowrap}
.article-submit fieldset{border:0;display:grid;gap:15px;padding:0;margin:0;min-width:0}
.article-submit label{display:grid;gap:7px;font-size:12px;color:var(--muted)}
.article-submit input,.article-submit select{min-width:0;width:100%;border-radius:8px;border:1px solid var(--line,#ffffff25);padding:11px 12px;color:var(--text);background:color-mix(in srgb,var(--text) 4%,transparent);font-size:13px;line-height:1.4;color-scheme:dark}
.article-submit input::placeholder{color:var(--muted);opacity:.7}.article-submit option{background:#241c2c;color:white}
.article-primary{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:11px 14px;border:0;border-radius:8px;background:var(--accent,#de8bf3);color:#110c13;font-weight:700!important;font-size:13px!important;line-height:1.4;cursor:pointer;transition:filter .15s}
.article-primary:hover{filter:brightness(1.1)}.article-activity :disabled{opacity:.55;cursor:not-allowed}
.article-login-panel{display:grid;justify-items:center;text-align:center;padding:8px 0 2px}
.article-login-symbol{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--accent-soft);color:var(--accent);margin-bottom:14px}
.article-login-symbol svg{width:22px;height:22px}.article-login-panel>strong{font-size:15px;font-weight:600}
.article-login-panel>p{max-width:280px;font-size:12px;line-height:1.7;color:var(--muted);margin:8px 0 20px}
.article-binding-note{font-size:11px;margin:12px 0 0}.article-submit #articleSubmitMessage:empty{display:none}
.article-submit #articleSubmitMessage{font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.article-history-panel .article-panel-heading{margin-bottom:12px}
.article-history-empty{display:flex;align-items:flex-start;gap:12px;padding:12px 0 3px;color:var(--muted)}
.article-history-empty>svg{width:28px;height:28px;opacity:.5;margin-top:1px}
.article-history-empty strong{font-size:12px;font-weight:500;color:var(--muted)}
.article-history-empty p{font-size:11px;line-height:1.7;margin:4px 0 0}
.article-history-panel:has(.article-history-empty) .article-history-empty strong{display:none}
.article-my-score{display:flex;align-items:center;gap:12px;padding:0;min-height:40px;flex-wrap:wrap;font-size:13px}.article-my-score>span:last-child{font-size:12px;color:var(--muted,#aaa)}.article-my-score strong{font-size:28px;color:var(--accent,#de8bf3)}
.article-mobile-entry{display:none}
.article-submit-dialog{box-sizing:border-box;width:calc(100% - 28px);max-width:440px;max-height:85dvh;padding:44px 14px 14px;border:1px solid var(--line,#ffffff25);border-radius:16px;background:var(--bg,#110c13);color:var(--text,#f4eff8);overflow-y:auto}
.article-submit-dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}
.article-dialog-close{position:absolute;top:10px;right:12px;display:grid;place-items:center;width:28px;height:28px;padding:5px;border:1px solid var(--line,#ffffff25);border-radius:7px;background:transparent;color:var(--text);cursor:pointer}
.article-dialog-close svg{width:16px;height:16px}
.article-mobile-trigger{display:flex;align-items:center;gap:9px;width:100%;min-height:46px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);border-radius:9px;background:var(--accent-soft);color:var(--accent);text-align:left;cursor:pointer;font-size:13px!important}
.article-mobile-trigger strong{flex:1;font-weight:650}.article-mobile-trigger .article-status-chip{font-size:10px;padding:0;background:transparent}
.article-empty{font-size:13px;color:var(--muted);padding:18px 0}.article-activity [hidden]{display:none!important}
body[data-theme="light"] .article-activity input,body[data-theme="light"] .article-activity select{color-scheme:light}
@media(max-width:760px){
 .article-board .board-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:12px;min-height:0;padding:16px 15px}
 .article-board .board-head h2{min-width:0;font-size:13px;line-height:1.5;letter-spacing:0}
 .article-board .board-head h2::before{flex-shrink:0}
 .article-board .board-head>.board-tools{display:block;width:auto;min-width:0}
 .article-board .board-head > .board-tools > #updatedAt{display:block;padding-left:0;font-size:10px}
 .article-board #updatedAt::before{display:inline-block;vertical-align:middle;margin-right:6px}
 .article-activity{padding:15px}.article-layout{grid-template-columns:1fr;gap:20px;margin-top:10px}
 .article-mobile-entry{display:block;padding:0;margin-top:12px}
 .article-submit-dialog .article-login-symbol{display:none}
 .article-submit-dialog .article-login-panel{padding:0}
 .article-submit-dialog .article-login-panel>strong{font-size:13px}
 .article-submit-dialog .article-login-panel>p{margin:6px 0 12px}
 .article-submit-dialog .article-form-panel,.article-submit-dialog .article-history-panel{padding:14px}
 .article-row{grid-template-columns:28px minmax(0,1fr) 44px 57px;gap:8px;min-height:64px;padding:0 7px 0 4px}.article-score{font-size:20px}
 .article-row.article-podium{min-height:72px;padding:0 7px 0 4px;margin-top:5px;border-radius:8px}
 .article-medal{width:26px;height:36px}.article-medal b{padding-top:10px;font-size:14px}
 .article-heading{min-height:32px}
 .article-identity{gap:7px}.article-avatar{width:28px;height:28px;flex-basis:28px}
 .article-toolbar{gap:10px;align-items:center;flex-wrap:wrap}.article-period-controls{display:grid;grid-template-columns:minmax(0,1fr) 124px;width:100%;min-width:0;gap:8px;justify-content:space-between}
 .article-tabs{min-width:0;gap:2px;padding:2px;min-height:36px;box-sizing:border-box}
 .article-tabs button{flex:1;min-width:0;white-space:nowrap;padding:6px 4px;font-size:11px;line-height:20px}
 .article-period-controls:has(.article-date-control[hidden]){display:flex;justify-content:center}
 .article-period-controls:has(.article-date-control[hidden]) .article-tabs{width:210px;max-width:100%}
 .article-date-control{min-width:0;gap:0;padding:0 8px;min-height:36px;box-sizing:border-box}.article-date-control>span{display:none}.article-date-control input{width:100%;min-width:0;font-size:11px;padding:7px 0}
 .article-form-panel,.article-history-panel{padding:16px;border-radius:12px}.article-panel-heading{margin-bottom:16px}
 .article-history-dialog.article-history-panel{padding:0;max-height:85dvh;border-radius:14px}
 .article-history-header{padding:16px}
 .article-history-header h3{font-size:15px}
 .article-history-dialog .article-dialog-close{top:16px;right:16px}
 .article-history-dialog #articleOwnHistory{padding:12px 14px 16px}
 .article-history-card{padding:12px}
 .article-history-main{gap:8px}
 .article-history-result{flex-direction:column;align-items:flex-end;gap:5px}
 .article-history-score{min-width:60px}.article-history-score strong{font-size:25px}
 .article-history-post{font-size:12px;gap:5px}.article-history-id{font-size:9px}
 .article-history-feedback{font-size:11px;margin-top:10px;padding-top:9px}
 .article-submit{gap:12px}.article-login-panel{padding-top:2px}.article-login-panel>p{max-width:260px}
 .article-my-score{max-width:100%;width:100%;justify-content:center;text-align:center;gap:6px 10px;min-height:32px;font-size:12px}
 .article-my-score strong{font-size:24px;line-height:32px}
}
@media(prefers-reduced-motion:reduce){.article-activity button{transition:none}.article-podium-1 .article-medal::after{animation:none;display:none}}
.article-x-identity{margin:0 0 12px}
.article-x-identity[hidden]{display:none}
.article-x-connect{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:42px;padding:0 16px;box-sizing:border-box;border-radius:999px;background:#f4f4f5;color:#0b0b0c;font-size:14px;font-weight:700;text-decoration:none;border:1px solid #ffffff2a;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.article-x-connect:hover{background:#fff;transform:translateY(-1px);box-shadow:0 6px 18px color-mix(in srgb,var(--accent,#de8bf3) 28%,transparent)}
.article-x-connect svg{width:16px;height:16px;flex:0 0 16px;fill:currentColor}
.article-x-card{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent,#de8bf3) 34%,transparent);min-width:0}
.article-x-card img{width:36px;height:36px;flex:0 0 36px;border-radius:50%;object-fit:cover;background:#0006;border:1px solid var(--line,#ffffff16)}
.article-x-who{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.25}
.article-x-who strong{font-size:14px;color:var(--text,#f4eff8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.article-x-who a{font-size:12px;color:var(--muted,#b9adc2);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.article-x-who a:hover{color:var(--accent,#de8bf3)}
.article-x-badge{display:inline-flex;align-items:center;gap:5px;flex:0 0 auto;padding:4px 9px;border-radius:999px;background:var(--accent,#de8bf3);color:#110c13;font-size:11px;font-weight:700}
.article-x-badge svg{width:11px;height:11px;fill:currentColor}
@media(max-width:640px){.article-x-connect{min-height:40px;font-size:13px}.article-x-card{padding:9px 10px}}