/* FAIRDRAW — monochrome, square, hairline. Follows the imd.fun house style:
   white ground, 1.5px black boxes, no radius, JetBrains Mono, emphasis by
   inversion rather than by colour. */
:root{
  --bg:#fff;
  --ink:#000;
  --mut:#555;
  --faint:#8a8a8a;
  --rule:#e2e2e2;        /* hairline inside a box */
  --fill:#f6f6f6;        /* the only "surface" tone */
  --bw:1.5px;            /* every outer box border */
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
[hidden]{display:none!important}   /* author display rules otherwise beat the UA sheet */
html{color-scheme:light}
body{margin:0;background:var(--bg);color:var(--ink);font:13px/1.6 var(--mono);
  -webkit-font-smoothing:antialiased}
a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--ink)}
a:hover{background:var(--ink);color:var(--bg)}
button{font:inherit}
code{font:inherit}
.wrap{max-width:1060px;margin:0 auto;padding:28px 24px 80px}
.num{font-variant-numeric:tabular-nums}

/* ---- header ---- */
.top{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px}
.brand a,.brand>span:first-child{border:var(--bw) solid var(--ink);padding:5px 13px;font-size:13px;
  letter-spacing:.14em;border-bottom-width:var(--bw)}
.brand a:hover{background:var(--ink);color:var(--bg)}
.brand b{font-weight:400}
.brand .sub{font-size:9.5px;letter-spacing:.18em;color:var(--mut);border:0;padding:0}
.top nav{display:flex;gap:8px;align-items:center}
.top nav a{border:var(--bw) solid var(--ink);padding:5px 13px;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase}
.top nav a.pri{background:var(--ink);color:var(--bg)}
.top nav a.pri:hover{background:var(--bg);color:var(--ink)}

/* ---- intro ---- */
.lede{margin:34px 0 0;max-width:74ch;font-size:13px;line-height:1.75}
.lede b{font-weight:700}
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:26px;
  border:var(--bw) solid var(--ink)}
.how>div{padding:13px 15px;border-left:1px solid var(--rule)}
.how>div:first-child{border-left:0}
.how .n{font-size:9.5px;letter-spacing:.18em;color:var(--mut)}
.how p{margin:6px 0 0;font-size:12px;line-height:1.65}

/* ---- section rules ---- */
.sec{margin:38px 0 0;display:flex;align-items:center;gap:14px;font-size:9.5px;letter-spacing:.18em;
  color:var(--mut)}
.sec::after{content:"";flex:1;height:1px;background:var(--rule)}

/* ---- raffle list ---- */
.list{margin-top:14px;border:var(--bw) solid var(--ink);border-bottom:0}
.rc{display:grid;grid-template-columns:1fr auto;gap:6px 22px;align-items:start;padding:16px 18px;
  border-bottom:var(--bw) solid var(--ink);cursor:pointer;background:var(--bg)}
.rc:hover{background:var(--fill)}
.rc h3{margin:0;font-size:17px;font-weight:400;letter-spacing:-.02em}
.rc .by{font-size:11px;color:var(--mut);margin-top:4px}
.rc .meta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.rc .right{text-align:right;white-space:nowrap}
.rc .cd{font-size:20px;letter-spacing:-.02em}
.rc .cdl{font-size:9.5px;letter-spacing:.18em;color:var(--mut);margin-top:3px}
.empty{border:var(--bw) solid var(--ink);padding:40px;text-align:center;color:var(--mut);margin-top:14px}

.chip{display:inline-block;padding:2px 8px;font-size:10.5px;letter-spacing:.06em;
  border:1px solid var(--ink);color:var(--ink);background:var(--bg);white-space:nowrap}
.chip.on{background:var(--ink);color:var(--bg)}
.chip.soft{border-color:#bbb;color:var(--mut)}

/* ---- detail ---- */
.back{display:inline-block;margin:26px 0 0;font-size:10.5px;letter-spacing:.14em;color:var(--mut);
  border:0}
.back:hover{background:none;color:var(--ink);text-decoration:underline}
.hd{margin-top:14px;display:flex;justify-content:space-between;align-items:flex-start;gap:28px;flex-wrap:wrap}
.hd h1{margin:0;font-size:38px;font-weight:400;letter-spacing:-.035em;line-height:1.1;text-wrap:balance}
.hd .by{color:var(--mut);font-size:12px;margin-top:9px}
.hd .by a{border-bottom-color:var(--mut)}
.big{text-align:right}
.big .v{font-size:32px;letter-spacing:-.03em;line-height:1}
.big .l{font-size:9.5px;letter-spacing:.18em;color:var(--mut);margin-top:6px}

.panes{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:26px;border:var(--bw) solid var(--ink)}
.pane{padding:15px 17px;min-width:0}
.panes .pane+.pane{border-left:1px solid var(--rule)}
.pane>h4{margin:0 0 13px;font-size:9.5px;letter-spacing:.18em;color:var(--mut);font-weight:400}
.kv{display:grid;grid-template-columns:minmax(0,auto) 1fr;gap:7px 16px;font-size:12px;margin:0}
.kv dt{color:var(--mut);white-space:nowrap}
.kv dd{margin:0;overflow-wrap:anywhere;text-align:right}

/* a single box below a section rule */
.box{margin-top:14px;border:var(--bw) solid var(--ink)}
.box .pad{padding:15px 17px}

/* ---- timeline ---- */
.steps{display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:14px 1fr;gap:14px;padding:0 0 16px;position:relative}
.step:last-child{padding-bottom:0}
.step:not(:last-child)::before{content:"";position:absolute;left:6px;top:14px;bottom:2px;
  border-left:1px dotted #aaa}
.step .b{width:9px;height:9px;margin:5px 0 0 1px;border:1.5px solid var(--ink);background:var(--bg);
  z-index:1;box-shadow:0 0 0 3px var(--bg)}
.step.done .b{background:var(--ink)}
.step.now .b{background:var(--bg);box-shadow:0 0 0 3px var(--bg),inset 0 0 0 2px var(--bg)}
.step .t{font-size:12.5px}
.step .t span{color:var(--mut)}
.step .d{font-size:11.5px;color:var(--mut)}
.step.bad .b{background:var(--ink);border-width:3px}

/* ---- commitment block ---- */
.seal{margin-top:14px;border:var(--bw) solid var(--ink)}
.seal .bar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:9px 16px;
  border-bottom:1px solid var(--rule);font-size:9.5px;letter-spacing:.18em;color:var(--mut)}
.seal .body{padding:14px 16px;display:grid;gap:9px}
.seal .row{display:grid;grid-template-columns:128px 1fr;gap:14px;align-items:baseline;font-size:11.5px}
.seal .row span{color:var(--mut)}
.seal .row code{overflow-wrap:anywhere}
.seal .row code.key{font-weight:700}

/* ---- tables ---- */
.tbl{margin-top:14px;border:var(--bw) solid var(--ink)}
.tbl .scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:12px}
th{font-size:9.5px;letter-spacing:.18em;color:var(--mut);text-align:left;padding:10px 16px;
  border-bottom:1px solid var(--ink);font-weight:400;white-space:nowrap}
td{padding:7px 16px;border-bottom:1px solid var(--rule);white-space:nowrap}
tr:last-child td{border-bottom:0}
td.r,th.r{text-align:right}
td.hi{font-weight:700}
td.dim{color:var(--faint)}
.more{display:flex;justify-content:center;padding:10px;border-top:1px solid var(--rule)}
.more button{border:1px solid var(--ink);background:var(--bg);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;padding:6px 16px;cursor:pointer}
.more button:hover{background:var(--ink);color:var(--bg)}

/* ---- download row ---- */
.dl{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.dl a{border:1px solid var(--ink);padding:7px 15px;font-size:11px;letter-spacing:.1em}
.dl a.pri{background:var(--ink);color:var(--bg)}
.dl a.pri:hover{background:var(--bg);color:var(--ink)}

.foot{margin-top:52px;padding-top:16px;border-top:1px solid var(--rule);font-size:10.5px;
  color:var(--faint);display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}
.foot a{color:var(--mut);border-bottom-color:var(--rule)}

/* ---- forms ---- */
.form{display:grid;gap:0;margin-top:26px;border:var(--bw) solid var(--ink)}
.fs{padding:16px 18px;border-bottom:1px solid var(--rule)}
.fs:last-child{border-bottom:0}
.fs>h4{margin:0 0 14px;font-size:9.5px;letter-spacing:.18em;color:var(--mut);font-weight:400}
.fr{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.fr.one{grid-template-columns:1fr}
.fr.three{grid-template-columns:repeat(3,1fr)}
label{display:block;font-size:9.5px;letter-spacing:.18em;color:var(--mut);margin-bottom:6px}
label .opt{letter-spacing:.04em;color:var(--faint)}
input,select,textarea{width:100%;appearance:none;border:1px solid var(--ink);border-radius:0;
  background:var(--bg);color:var(--ink);font:inherit;font-size:12.5px;padding:8px 11px;outline:none}
input:focus,select:focus,textarea:focus{box-shadow:inset 0 0 0 1px var(--ink)}
input::placeholder,textarea::placeholder{color:#b4b4b4}
textarea{min-height:88px;resize:vertical;line-height:1.55}
select{cursor:pointer;padding-right:28px;background-repeat:no-repeat;background-position:right 9px center;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='6'%3E%3Cpath d='M1 1l3.5 3.5L8 1' fill='none' stroke='%23000' stroke-width='1.3'/%3E%3C/svg%3E")}
.hint{font-size:11px;color:var(--mut);margin:6px 0 0;line-height:1.55}
.check{display:flex;align-items:flex-start;gap:9px;margin-top:24px}
.check input[type=checkbox]{appearance:auto;-webkit-appearance:checkbox;width:14px;height:14px;flex:none;
  padding:0;border:0;accent-color:#000;margin:3px 0 0}
.check span{font-size:11.5px;color:var(--mut);line-height:1.5}
.go{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 18px}
.go button{border:var(--bw) solid var(--ink);background:var(--ink);color:var(--bg);font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;padding:10px 26px;cursor:pointer}
.go button:hover{background:var(--bg);color:var(--ink)}
.go button:disabled{opacity:.35;cursor:not-allowed;background:var(--ink);color:var(--bg)}
.msg{font-size:11.5px}
.msg.err{color:var(--ink);font-weight:700}
.msg.err::before{content:"! "}
.msg.ok{color:var(--mut)}
.msg.ok::before{content:"✓ "}
.plan{border:1px dotted #aaa;padding:12px 15px;font-size:11.5px;color:var(--mut);line-height:1.7;
  margin:14px 0 0}
.plan b{color:var(--ink);font-weight:700}

/* ---- verdict ---- */
.verdict{border:var(--bw) solid var(--ink);background:var(--ink);color:var(--bg);padding:18px 20px;
  margin-top:18px}
.verdict.bad{background:var(--bg);color:var(--ink);border-width:4px}
.verdict h3{margin:0 0 8px;font-size:16px;font-weight:400;letter-spacing:.2em}
.verdict p{margin:0;font-size:12px;opacity:.85}
.verdict a,.verdict code{color:inherit;border-bottom-color:currentColor;overflow-wrap:anywhere}

@media (max-width:820px){
  .how,.panes,.fr,.fr.three{grid-template-columns:1fr}
  .how>div{border-left:0;border-top:1px solid var(--rule)}
  .how>div:first-child{border-top:0}
  .panes .pane+.pane{border-left:0;border-top:1px solid var(--rule)}
  .rc{grid-template-columns:1fr}
  .rc .right{text-align:left}
  .hd{flex-direction:column;gap:14px}
  .hd h1{font-size:28px}
  .big{text-align:left}
  .seal .row{grid-template-columns:1fr;gap:2px}
  .check{margin-top:0}
}

/* ---- allocation board (Standard Reserve's filled-square grid) ---- */
.board{margin-top:14px;border:var(--bw) solid var(--ink);padding:16px 18px}
.board .bh{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap;
  margin-bottom:15px}
.board .eb{font-size:9.5px;letter-spacing:.18em;color:var(--mut)}
.board h3{margin:4px 0 0;font-size:22px;font-weight:400;letter-spacing:-.03em}
.board .cnt{text-align:right;font-size:13px;margin-left:auto}
.board .cnt small{display:block;font-size:10.5px;color:var(--mut);margin-top:2px}
.grid{display:grid;gap:3px}
.cell{aspect-ratio:1;background:#f5f5f3;border:1px solid #ececeb}
.cell.on{background:#1a1a1a;border-color:#1a1a1a}
.cell.half{background:var(--bg);border:1.5px solid #1a1a1a}
.board .key{display:flex;gap:16px;flex-wrap:wrap;margin-top:13px;font-size:10.5px;color:var(--mut)}
.board .key i{display:inline-block;width:9px;height:9px;margin-right:6px;vertical-align:-1px;
  background:#f5f5f3;border:1px solid #ececeb;font-style:normal}
.board .key i.on{background:#1a1a1a;border-color:#1a1a1a}
.board .key i.half{background:var(--bg);border:1.5px solid #1a1a1a}
@media (max-width:820px){.board .cnt{text-align:left;margin-left:0}}

/* ---- allocation modes + builder opt-in ---- */
.fs.bld{background:var(--fill)}
.fs.bld .check{margin-top:0}
.fs.bld .check span{font-weight:700;color:var(--ink)}   /* the whole ask, not just its first line */
.fs.bld code{font-weight:400}
.fs.bld code{background:var(--bg);border:1px solid var(--rule);padding:1px 5px;font-size:11px}
.modes{border:1px solid var(--ink)}
.mode{display:grid;grid-template-columns:16px 1fr auto;gap:13px;align-items:start;
  padding:12px 14px;border-top:1px solid var(--rule);cursor:pointer}
.mode:first-child{border-top:0}
.mode.on{background:var(--fill)}
.mode input[type=radio]{appearance:auto;-webkit-appearance:radio;width:14px;height:14px;padding:0;
  border:0;margin:3px 0 0;accent-color:#000;flex:none;cursor:pointer}
.mode .mt{font-size:12.5px}
.mode .mt b{font-weight:700}
.mode .md{font-size:11px;color:var(--mut);margin-top:4px;line-height:1.5}
.mode .mn{display:flex;gap:7px;align-items:center;white-space:nowrap}
.mode .mn span{font-size:9.5px;letter-spacing:.16em;color:var(--mut)}
.mode .mn input{width:58px;text-align:center;padding:5px 4px;font-size:12.5px}
.mode:not(.on) .mn{opacity:.25;pointer-events:none}
@media (max-width:820px){
  .mode{grid-template-columns:16px 1fr}
  .mode .mn{grid-column:2;margin-top:8px}
}

.coll{margin:0;font-size:13px}
.coll b{font-weight:700}

.flag{margin-top:16px;border:var(--bw) solid var(--ink);border-left-width:5px;padding:12px 15px;
  font-size:12px;line-height:1.65;background:var(--fill)}
.flag b{font-weight:700}

/* ---- wallet lookup ---- */
.look{margin-top:14px;border:var(--bw) solid var(--ink);padding:14px 16px}
.lk-in{display:flex;gap:8px}
.lk-in input{flex:1;min-width:0;font-size:13px}
.lk-go{border:var(--bw) solid var(--ink);background:var(--ink);color:var(--bg);font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;padding:0 22px;cursor:pointer;white-space:nowrap}
.lk-go:hover{background:var(--bg);color:var(--ink)}
.lk-out:not(:empty){margin-top:14px;padding-top:13px;border-top:1px solid var(--rule)}
.lk-yes,.lk-in-pool{font-size:13px;margin-bottom:10px}
.lk-yes b{background:var(--ink);color:var(--bg);padding:2px 8px;font-weight:400}
.lk-in-pool b{border:1px solid var(--ink);padding:2px 8px;font-weight:400}
.lk-no{margin:0;font-size:12.5px;color:var(--mut);line-height:1.6}
.lk-note{margin:10px 0 0;font-size:11.5px;color:var(--mut)}
.lk-row{display:flex;justify-content:space-between;gap:16px;font-size:12.5px;padding:3px 0}
.lk-row span{color:var(--mut)}
.lk-row b{font-weight:400;font-variant-numeric:tabular-nums}
@media (max-width:520px){.lk-in{flex-direction:column}.lk-go{padding:10px 22px}}

.code{margin:0;font-size:12.5px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.code b{font-weight:700}
.code code{border:1px solid var(--ink);padding:4px 12px;font-size:13px;letter-spacing:.06em;
  background:var(--fill)}
.post{border:var(--bw) solid var(--ink);background:var(--ink);color:var(--bg);padding:5px 14px;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.post:hover{background:var(--bg);color:var(--ink)}

/* The square belonging to the wallet you looked up. The one place on the site
   that uses colour at all — which is exactly why it works: nothing else here
   is anything but black, white or grey, so a yellow mark cannot be read as
   another cell state the way any outline could. The ring only — filling the
   square would overwrite the very state the reader came to look at. */
:root{--mark:#e0a800}
.cell.me{position:relative;z-index:2;box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--mark);
  animation:ping 1s ease-out 2}
@keyframes ping{
  0%{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--mark),0 0 0 10px rgba(224,168,0,.35)}
  100%{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--mark),0 0 0 10px rgba(224,168,0,0)}}
@media (prefers-reduced-motion:reduce){.cell.me{animation:none}}
.board .key i.me{background:#f5f5f3;border:1px solid #ececeb;box-shadow:0 0 0 1px var(--bg),0 0 0 2.5px var(--mark);
  margin-left:2px;margin-right:12px}
.board .key .key-me{font-weight:700;color:var(--ink)}

.post.big{display:inline-block;padding:9px 20px;font-size:12px}
.or{font-size:11.5px;color:var(--mut);margin-left:14px}
#xlogin{margin:0 0 16px}

/* the mark for a name that was proven, not typed */
.tick{display:inline-flex;align-items:center;justify-content:center;width:13px;height:13px;
  border-radius:50%;background:var(--ink);color:var(--bg);font-size:9px;line-height:1;
  vertical-align:1px;margin-left:2px}
.by .chip{margin-left:4px;vertical-align:1px}

.filter{display:inline-flex;border:1px solid var(--ink);margin-top:14px}
.filter button{border:0;background:var(--bg);color:var(--mut);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;padding:6px 14px;cursor:pointer}
.filter button+button{border-left:1px solid var(--ink)}
.filter button.on{background:var(--ink);color:var(--bg)}
.filter+.list{margin-top:10px}

/* ---- final list, for whoever has to load it into an allowlist ---- */
.flat{margin-top:14px;border:var(--bw) solid var(--ink)}
.flat .bar{display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:9px 16px;border-bottom:1px solid var(--ink);font-size:10.5px;letter-spacing:.1em;
  color:var(--mut)}
.flat .cp{border:1px solid var(--ink);background:var(--bg);color:var(--ink);cursor:pointer;
  font:inherit;font-size:10px;letter-spacing:.12em;padding:4px 12px}
.flat .cp:hover{background:var(--ink);color:var(--bg)}
.flat .ta{display:block;width:100%;border:0;resize:vertical;background:var(--bg);color:var(--ink);
  font:inherit;font-size:12px;line-height:1.85;padding:12px 16px;white-space:pre;overflow-x:auto}
.flat .ta:focus{outline:0}
