/* «Активные пользователи». Sizes and colours are the computed values of rift.rolka.me/online.php. */
.rift-online-page{position:relative}
.rift-online-toggle{position:absolute;top:13px;right:11px}
.mobile .rift-online-toggle{position:static;display:table;margin:0 11px 0 auto}
.rift-online-page .online-list{margin:0 11px}
.rift-online-page .online-list table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;font:11px Verdana,sans-serif}
.rift-online-page .online-list td{padding:11px;border:0;background:transparent;vertical-align:middle;text-align:left}
.rift-online-page .online-list td.tc3{text-align:center}
.rift-online-page .online-list thead th{padding:0;font-size:0;font-weight:700;border:0;background:transparent}
.rift-online-page .online-list thead th.username{width:32.234%}
.rift-online-page .online-list thead th.action{width:42.233%}
.rift-online-page .online-list .registered-user{font-weight:700}
.rift-online-page .flag-i{display:inline-block;width:14.6562px;height:11px;margin:0 11px 0 0;line-height:11px;background-position:center;background-repeat:no-repeat;background-size:contain}
.rift-online-noflag{display:none}
.mobile .rift-online-noflag{display:block}
.rift-online-foot{margin:11px;font:10px Verdana,sans-serif;text-align:right}
.rift-online-group td{padding:14px 11px 5px;font-weight:700;text-transform:uppercase}
.rift-online-today .online-list thead th.username{width:60%}

/* Staff see column titles and three more columns; players keep Quadro's three. */
#pun-online.rift-online-staff thead{display:table-header-group}
.rift-online-staff .online-list thead td{box-sizing:border-box;padding:0 11px 6px;font-size:10px;font-weight:700}
.rift-online-staff .online-list thead td.username{width:15.5%}
.rift-online-staff .online-list thead td.rift-online-ip{width:12%}
.rift-online-staff .online-list thead td.action{width:32%}
.rift-online-staff .online-list thead td.time{width:13%}
.rift-online-staff .online-list thead td.rift-online-range{width:12.5%}
.rift-online-staff .online-list td{padding:8px 11px;overflow-wrap:anywhere}
.rift-online-matches{text-decoration:underline dotted}
.rift-online-matches::after{content:" ▾"}
.rift-online-matches[aria-expanded=true]::after{content:" ▴"}
.rift-online-list{margin:5px 0 0;padding:0;list-style:none}
.rift-online-list li{padding:2px 0}
.rift-online-note textarea{box-sizing:border-box;display:block;width:100%;min-height:24px;padding:3px 5px;border:1px solid rgba(97,121,117,.4);border-radius:3px;background:transparent;color:inherit;font:11px Verdana,sans-serif;resize:vertical}
.rift-online-note textarea[data-state=saved]{border-color:#617975}
.rift-online-note textarea[data-state=failed]{border-color:#a33}
.mobile .rift-online-staff .online-list tbody tr>td:is(.rift-online-ip,.rift-online-range,.rift-online-note){grid-column:1/-1}

dialog.rift-online-dialog{box-sizing:border-box;width:min(420px,calc(100vw - 32px));padding:16px 18px;border:1px solid #718b8266;border-radius:14px;background:#19221f;color:#e0e6e2;font:11px/16px Verdana,sans-serif}
.rift-online-dialog::backdrop{background:#07100db3;backdrop-filter:blur(3px)}
.rift-online-dialog h2{margin:0 24px 12px 0;font:700 13px Verdana,sans-serif}
.rift-online-dialog .flag-i{display:inline-block;width:20px;height:15px;vertical-align:-2px;background-position:center;background-repeat:no-repeat;background-size:contain}
.rift-online-dialog table{width:100%;border-collapse:collapse}
.rift-online-dialog th,.rift-online-dialog td{padding:4px 0;text-align:left;vertical-align:top;overflow-wrap:anywhere}
.rift-online-dialog th{width:42%;padding-right:10px;font-weight:400;color:#a9b8b1}
.rift-online-dialog a{color:#c7d8bb}
.rift-online-links{display:flex;flex-direction:column;gap:4px;margin:12px 0 0}
.rift-online-hint{margin:10px 0 0;color:#a9b8b1;font-size:10px}
.rift-online-close{position:absolute;top:8px;right:10px;padding:0 4px;border:0;background:none;color:inherit;font:16px Verdana,sans-serif;cursor:pointer}