:root{--bg:#000;--fg:#f0f0f0;--muted:#c0c0c0;--dim:#9a9a9a;--line:#333;--line2:#666;--hi:#fff;--mid:#d0d0d0;--danger:#f0f0f0;--warn:#d8d8d8;--ok:#f0f0f0}
*{box-sizing:border-box} html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono','DejaVu Sans Mono',monospace;font-size:13px;line-height:1.5;font-weight:400}
body{overflow-x:hidden}
a{color:var(--hi);text-decoration:underline;text-decoration-color:#666} a:hover{color:#fff;text-decoration-color:#aaa}
b,strong{color:var(--hi);font-weight:400}
.white{color:var(--fg)!important}.darkgrey,.maingrey,.muted,.small{color:var(--muted)!important}.danger{color:var(--hi)!important}.ok{color:var(--ok)!important}.warn{color:var(--warn)!important}
.mono,pre,code,input,textarea,select,button{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono','DejaVu Sans Mono',monospace}
.main-wrapper{width:min(1080px,calc(100% - 20px));margin:0 auto}
.container{background:#000;padding:0 0 24px}
.logo-wrapper{padding-top:24px;padding-bottom:24px;text-align:center}
.logo-wrap-center{text-align:center}
.brandline{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:center;margin:10px 0 18px;color:var(--hi);font-size:13px}
.brandline a{margin-right:4px}
.ascii-wrap{display:flex;justify-content:center;align-items:center;overflow-x:auto;margin:8px auto 14px;padding:4px 0 8px;width:100%}
.ascii{margin:0 auto;color:#e8e8e8;font-size:clamp(4.8px,.72vw,9px);line-height:1.05;white-space:pre;letter-spacing:0;text-align:left;display:inline-block}
.slogan{font-size:clamp(20px,2.8vw,34px);line-height:1.05;color:#fff;margin:8px auto 6px;text-align:center;font-weight:400}
.tagline{font-size:14px;color:var(--mid);text-align:center;margin:0 auto 18px}
.top-content-preview{width:min(680px,100%);text-align:center;font-size:12px;margin:0 auto 26px;color:var(--muted);line-height:1.55}
.section-wrapper{margin-bottom:24px}
.main-heading{display:flex;align-items:center;justify-content:center;margin-bottom:14px;padding-top:10px;flex-wrap:nowrap;overflow:hidden}
.headline,.section-header{color:var(--hi);font-size:14px;font-weight:400;text-transform:lowercase;margin:0 6px;min-width:180px;padding-left:0;text-align:center;letter-spacing:.02em}
hr{background:var(--line);height:1px;width:8px;margin:0 2px;border:0;flex:0 0 auto}
hr.first-line{width:36px;background:var(--line)} hr.medium-line{width:4vw;max-width:70px;background:var(--line2)} hr.big-line{display:block;width:min(34vw,360px);background:#aaa}
.inner-content{padding:0 8px;max-width:940px;position:relative;left:0;margin:0 auto;font-size:12.5px;line-height:1.55}
.center{text-align:center}
.left{text-align:left}
.notice{border:1px solid var(--line);padding:10px 12px;margin:8px 0;color:var(--fg);background:#050505;font-size:12px}
.notice.ok{border-color:#444;color:#eee}.notice.warn{border-color:#3d3d3d;color:#ddd}.notice.danger{border-color:#4a4a4a;color:#eee}
.codebox,pre.codebox{background:#030303;border:1px solid var(--line);padding:10px;overflow:auto;white-space:pre-wrap;word-break:break-word;color:#e8e8e8;margin:8px 0;font-size:12px}
.form-table{max-width:920px;width:100%;margin:0 auto}.form-table tr{display:block;padding-bottom:10px}.form-table td{display:block;padding:1px 0;vertical-align:top}
.form-table label{color:var(--mid);text-transform:lowercase;font-size:12px}
.form-table input,.form-table textarea,.form-table select,input[type=text],input[type=email],input[type=password],input[type=number],input[type=file],textarea,select{border:0;border-bottom:1px solid #444;background:#000;color:#f0f0f0;outline:none;width:min(520px,100%);font-size:12.5px;padding:5px 2px;border-radius:0;box-shadow:none;font-weight:400}
.form-table textarea,textarea{border:1px solid #444;width:100%;min-height:76px;padding:8px}
.form-table input[type=submit],button,.btn{border:1px solid #555;background:#000;color:#eee;width:auto;min-width:100px;height:30px;padding:0 12px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:400}
.form-table input[type=submit]:hover,button:hover,.btn:hover{background:#e8e8e8;color:#000!important;border-color:#e8e8e8}
button.primary,.btn.primary{border-color:#888;color:#fff} button.danger,.btn.danger{border-color:#666;color:#eee}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:center;margin:8px 0}
.connection-table{max-width:980px;border-collapse:collapse;margin:0 auto;width:100%}.connection-table tr{display:table-row}.connection-table td{padding:5px 5px;vertical-align:top;font-size:12px}
.leftcol{width:170px;color:var(--hi);text-transform:lowercase}.dotscol{width:150px;color:#555}.maincol{color:#e0e0e0}
.app-shell{display:grid;grid-template-columns:270px 1fr;gap:14px;align-items:start}
.panel{border:1px solid var(--line);padding:10px;background:#010101}
.list{display:grid;gap:6px}.msg{border:1px solid var(--line);padding:8px;cursor:pointer;background:#000}.msg:hover{border-color:#777}.msg.unseen{border-left:2px solid #ddd}
.sub{color:var(--dim);font-size:11.5px;margin-top:3px}
.status-pill{border:1px solid #555;padding:1px 7px;color:#e8e8e8;font-size:11.5px}
.viewer{border:1px solid var(--line);background:#fff;margin-top:8px}.viewer iframe{width:100%;min-height:320px;border:0;background:#fff}
progress{width:100%;height:8px;accent-color:#bbb;filter:grayscale(1)}
.footer{padding:18px 0 24px;color:var(--muted);font-size:11.5px;text-align:center}
table.admin-table{width:100%;border-collapse:collapse} table.admin-table th,table.admin-table td{border-bottom:1px solid #222;padding:6px 5px;text-align:left;vertical-align:top;font-size:11.5px} table.admin-table th{color:var(--hi);font-weight:400}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin:10px 0}
.info-card{border:1px solid var(--line);padding:10px;background:#020202;text-align:left}
.info-card h4{margin:0 0 4px;color:var(--hi);font-size:12px;font-weight:400}
.info-card p{margin:0;color:var(--muted);font-size:11.5px;line-height:1.5}
@media (max-width:900px){.app-shell{grid-template-columns:1fr}.headline,.section-header{min-width:auto}.connection-table tr{display:block}.leftcol,.dotscol,.maincol{display:block;width:auto}.dotscol{display:none}.main-heading{justify-content:flex-start}}
@media (max-width:640px){hr.first-line{width:14px}hr.big-line{width:16vw}.ascii{font-size:4.2px}body{font-size:12px}}