@font-face{font-family:"MFL Mono";src:url("assets/mfl-mono.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
:root{color-scheme:dark;--paper:#000000;--ink:#ffffff;--text:#d9d9d9;--soft:#8c8c8c;--frame:#ffffff;--mono:"MFL Mono",Consolas,"DejaVu Sans Mono",monospace}
html[data-palette="technicolor"]{--paper:#101b23;--ink:#f2e8cc;--text:#e6ddc4;--soft:#96a9a6;--frame:#9bafa8}
*{box-sizing:border-box}
html{background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--text);font:400 16px/1.65 var(--mono);font-variant-ligatures:none;font-kerning:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
h1,h2,h3,p,figure,ul,table{margin:0}
a{color:var(--ink);text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{background:var(--ink);color:var(--paper);text-decoration:none}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
::selection{background:var(--ink);color:var(--paper)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:16px;top:16px;background:var(--ink);color:var(--paper);padding:4px 8px;z-index:2}
.page{max-width:1180px;margin:0 auto;padding:24px 16px 40px}

.top{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 24px;margin:0 0 32px}
.brand{color:var(--ink);text-decoration:none;white-space:nowrap}
.name{color:var(--ink)}
.top nav{display:flex;flex-wrap:wrap;gap:4px 16px}
.palette{display:flex;gap:12px;margin-left:auto}
.palette button{font:inherit;color:var(--ink);background:none;border:0;padding:0;cursor:pointer}
.palette button::before{content:"[" / ""}
.palette button::after{content:"]" / ""}
.palette button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}

.opening{display:grid;gap:32px;align-items:start;margin:0 0 40px}
.opening-text>p{max-width:62ch;text-align:justify;hyphens:auto;margin:0 0 1em}
.opening-text>p.lead{color:var(--ink)}
.opening-text .panel{margin-top:32px}

.specimen{container-type:inline-size;width:100%;max-width:470px;justify-self:center}
.unicode-card{width:100%;aspect-ratio:400/540;display:grid;grid-template-rows:repeat(54,minmax(0,1fr));line-height:1;font-size:3.0612245cqw;font-family:var(--mono);font-variant-ligatures:none;overflow:hidden;color:var(--ink)}
.art-row{display:grid;grid-template-columns:repeat(49,minmax(0,1fr));min-height:0}
.art-row i{display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;font-style:normal;white-space:pre}

.panel{position:relative;padding:1em 2ch;margin:0 0 40px}
.panel-title{font:inherit;color:var(--ink);text-align:center;letter-spacing:0}
.panel>:not(.u-frame):not(.u-rule){max-width:76ch;margin-left:auto;margin-right:auto}
.panel>p,.panel>ul{text-align:justify;hyphens:auto;margin-top:0;margin-bottom:1em}
.panel>p:last-child,.panel>ul:last-child,.panel>table:last-child{margin-bottom:0}
.panel>h3{font:inherit;color:var(--ink);margin-top:1.5em;margin-bottom:.5em}
.panel .note{color:var(--soft);font-size:14px;line-height:1.6}

.u-frame{position:absolute;inset:0;display:grid;grid-template-columns:1ch minmax(0,1fr) 1ch;grid-template-rows:1em minmax(0,1fr) 1em;font:400 16px/1 var(--mono);color:var(--frame);pointer-events:none;overflow:hidden;user-select:none}
.u-frame>span{min-width:0;min-height:0;white-space:pre;overflow:hidden}
.u-h{white-space:nowrap!important;overflow:hidden}
.u-rule{display:grid;grid-template-columns:1ch minmax(0,1fr) 1ch;margin:0 -2ch 1em;font:400 16px/1 var(--mono);color:var(--frame);overflow:hidden;user-select:none}
.u-rule>span{white-space:pre;overflow:hidden}

table{border-collapse:collapse;width:100%;margin-top:0;margin-bottom:1em}
th,td{text-align:left;vertical-align:top;font-weight:400;padding:.2em 2ch .2em 0}
th:last-child,td:last-child{padding-right:0}
thead th{color:var(--soft)}
tbody th{color:var(--ink)}
.n{text-align:right;white-space:nowrap}
thead .n{white-space:normal}
.glyphs{white-space:pre;color:var(--ink);width:1%}
caption{caption-side:top;text-align:left;color:var(--soft);padding:0 0 .3em}

.states td:first-child,.split td:first-child,.locked td:first-child,.order td:first-child,.supply td:first-child{padding-right:3ch}

.bar{display:flex;margin-top:0;margin-bottom:1em;font:400 16px/1 var(--mono);color:var(--ink);overflow:hidden;user-select:none}
.bar>span{white-space:nowrap;overflow:hidden;min-width:0}

.tree{list-style:none;padding:0}
.tree li{position:relative;padding-left:4ch;margin:0 0 .35em}
.tree li::before{content:"├─" / "";position:absolute;left:0;color:var(--ink)}
.tree li:last-child::before{content:"└─" / ""}

.mint-line{display:flex;flex-wrap:wrap;gap:0 2ch;margin:1em 0 0}
.mint-line .state{white-space:pre;color:var(--soft)}
.mint-line .off{color:var(--soft)}
.mint-line .later{color:var(--soft);flex-basis:100%;font-size:14px}

.bottom{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 24px;color:var(--soft);padding-top:8px}
.bottom p{margin:0}

@media (min-width:960px){
.page{padding:40px 40px 56px}
.opening{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px}
.opening-text .panel{margin-top:40px}
}
@media (max-width:620px){
.stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.stack tr{display:grid;grid-template-columns:auto 1fr;gap:0 2ch;padding:.4em 0}
.stack td,.stack th{display:block;padding:0}
.stack td:not(:first-child),.stack th:not(:first-child){grid-column:2}
.stack .n{text-align:left}
.states tr{display:block}
.states td:not(:first-child){padding-left:2ch}
.rarity,.payouts{font-size:14px}
.rarity th,.rarity td,.payouts th,.payouts td{padding-right:1ch}
.palette{margin-left:0}
.md thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.md tr{display:block;padding:.5em 0}
.md td{display:grid;grid-template-columns:minmax(0,12ch) minmax(0,1fr);gap:0 1ch;padding:0}
.md td::before{content:attr(data-label);color:var(--soft)}
}
@media (max-width:480px){
.opening-text>p,.panel>p,.panel>ul{text-align:left;hyphens:manual}
}

/* The parts that open at sell-out: the gallery, the Degenerator and the trait bible. */
.key{font:inherit;color:var(--ink);background:none;border:0;padding:0;cursor:pointer}
.key::before{content:"[" / ""}
.key::after{content:"]" / ""}
.key:hover,.key[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.key:disabled{color:var(--soft);background:none;cursor:default}
.top nav a[aria-current="page"]{background:var(--ink);color:var(--paper);text-decoration:none}
input,select{font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--soft);border-radius:0;padding:0 1ch}
label{color:var(--soft)}
.controls,.pager,.chapters{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 2ch;margin:1.2em auto 0}
.pager-count{color:var(--ink);margin-top:1em}
.pager .pager-count{margin-top:0}
.goto{display:flex;align-items:baseline;gap:1ch;margin-left:auto}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:40px 32px;margin:0 0 40px}
.trait-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:40px 40px;margin:0 0 40px}
.gallery-card{margin:0;scroll-margin-top:24px}
.gallery-card .specimen{max-width:none}
.gallery-card figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0 2ch;margin-top:.6em;font-size:14px}
.gallery-card .tier{white-space:nowrap;color:var(--ink)}
.degenerator-result{display:grid;gap:32px;align-items:start;margin:0 0 40px}
.portrait-plate{position:relative;margin:0;padding:1.2em 2.2ch;container-type:inline-size}
.portrait-art{display:grid;grid-template-rows:repeat(33,minmax(0,1fr));aspect-ratio:45/40.425;font-size:3.3333333cqw;line-height:1;font-family:var(--mono);font-variant-ligatures:none;color:var(--ink);overflow:hidden}
.portrait-art .art-row{grid-template-columns:repeat(45,minmax(0,1fr))}
.traits th{color:var(--soft);padding-right:3ch;white-space:nowrap}
.traits td{color:var(--ink)}
.trait{margin:0}
.trait-plate{position:relative;padding:1em 2ch;container-type:inline-size;display:flex;justify-content:center}
.trait-art{display:grid;width:100%;max-width:calc(var(--columns) * 13px);font-size:min(calc(150cqw / var(--columns)),19.5px);line-height:1;font-family:var(--mono);font-variant-ligatures:none;color:var(--ink);overflow:hidden}
.chapter-name{color:var(--soft);font-size:14px;margin:.8em 0 0}
.trait h2{font:inherit;color:var(--ink);margin:.1em 0 .3em}
.trait p:last-child{text-align:justify;hyphens:auto}
.more{text-align:center;margin:0 0 40px}
.empty{color:var(--soft)}
@media (min-width:960px){.degenerator-result{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px}}
html[data-palette="technicolor"]{--r0:#f2e8cc;--r1:#96a9a6;--r2:#70c6bf;--r3:#f2bb68;--r4:#f2e8cc;--r5:#9bafa8;--r6:#96a9a6;--r7:#f2bb68;--r8:#e2bda0;--r9:#a2cf75;--r10:#f2e8cc;--r11:#ba9e88;--r12:#91bde3;--r13:#70c6bf;--r14:#c0a5e7;--r15:#91bde3;--r16:#f2e8cc;--r17:#f2e8cc;--r18:#f2737e;--r19:#f2bb68;--r20:#f2bb68;--r21:#51ce83;--r22:#f2737e;--r23:#f2bb68;--r24:#c0a5e7;--r25:#70c6bf;--r26:#a2cf75;--r27:#a2cf75;--r28:#ee9882;--r29:#96a9a6;}
.r0{color:var(--r0,var(--ink))}.r1{color:var(--r1,var(--ink))}.r2{color:var(--r2,var(--ink))}.r3{color:var(--r3,var(--ink))}.r4{color:var(--r4,var(--ink))}.r5{color:var(--r5,var(--ink))}.r6{color:var(--r6,var(--ink))}.r7{color:var(--r7,var(--ink))}.r8{color:var(--r8,var(--ink))}.r9{color:var(--r9,var(--ink))}.r10{color:var(--r10,var(--ink))}.r11{color:var(--r11,var(--ink))}.r12{color:var(--r12,var(--ink))}.r13{color:var(--r13,var(--ink))}.r14{color:var(--r14,var(--ink))}.r15{color:var(--r15,var(--ink))}.r16{color:var(--r16,var(--ink))}.r17{color:var(--r17,var(--ink))}.r18{color:var(--r18,var(--ink))}.r19{color:var(--r19,var(--ink))}.r20{color:var(--r20,var(--ink))}.r21{color:var(--r21,var(--ink))}.r22{color:var(--r22,var(--ink))}.r23{color:var(--r23,var(--ink))}.r24{color:var(--r24,var(--ink))}.r25{color:var(--r25,var(--ink))}.r26{color:var(--r26,var(--ink))}.r27{color:var(--r27,var(--ink))}.r28{color:var(--r28,var(--ink))}.r29{color:var(--r29,var(--ink))}