html{background:var(--night)}
body{background:transparent;min-height:100vh}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1366 768' preserveAspectRatio='xMidYMid slice'%3E%3Cg fill='%23efe7d6'%3E%3Cpath d='M337 468.5l2.2 2.2 -2.2 2.2 -2.2 -2.2z' opacity='0.32'/%3E%3Cpath d='M499 39.5l1.1 1.1 -1.1 1.1 -1.1 -1.1z' opacity='0.34'/%3E%3Cpath d='M724 237.8l2.1 2.1 -2.1 2.1 -2.1 -2.1z' opacity='0.25'/%3E%3Cpath d='M1054 221.1l1.9 1.9 -1.9 1.9 -1.9 -1.9z' opacity='0.30'/%3E%3Cpath d='M658 57.4l2.5 2.5 -2.5 2.5 -2.5 -2.5z' opacity='0.30'/%3E%3Cpath d='M257 503.7l1.2 1.2 -1.2 1.2 -1.2 -1.2z' opacity='0.21'/%3E%3Cpath d='M163 68.7l2.3 2.3 -2.3 2.3 -2.3 -2.3z' opacity='0.29'/%3E%3Cpath d='M1248 144.7l2.2 2.2 -2.2 2.2 -2.2 -2.2z' opacity='0.18'/%3E%3Cpath d='M964 167.6l1.2 1.2 -1.2 1.2 -1.2 -1.2z' opacity='0.31'/%3E%3Cpath d='M523 510.2l2.0 2.0 -2.0 2.0 -2.0 -2.0z' opacity='0.14'/%3E%3Cpath d='M800 259.1l1.3 1.3 -1.3 1.3 -1.3 -1.3z' opacity='0.20'/%3E%3Cpath d='M937 392.8l1.2 1.2 -1.2 1.2 -1.2 -1.2z' opacity='0.23'/%3E%3Cpath d='M1191 197.9l1.8 1.8 -1.8 1.8 -1.8 -1.8z' opacity='0.25'/%3E%3Cpath d='M688 252.3l2.6 2.6 -2.6 2.6 -2.6 -2.6z' opacity='0.33'/%3E%3Cpath d='M295 149.7l3.0 3.0 -3.0 3.0 -3.0 -3.0z' opacity='0.27'/%3E%3Cpath d='M410 424.4l2.6 2.6 -2.6 2.6 -2.6 -2.6z' opacity='0.15'/%3E%3Cpath d='M1023 221.0l1.6 1.6 -1.6 1.6 -1.6 -1.6z' opacity='0.18'/%3E%3Cpath d='M291 351.0l2.4 2.4 -2.4 2.4 -2.4 -2.4z' opacity='0.21'/%3E%3Cpath d='M467 62.5l1.7 1.7 -1.7 1.7 -1.7 -1.7z' opacity='0.21'/%3E%3Cpath d='M1162 399.5l1.4 1.4 -1.4 1.4 -1.4 -1.4z' opacity='0.26'/%3E%3Cpath d='M121 382.5l2.7 2.7 -2.7 2.7 -2.7 -2.7z' opacity='0.24'/%3E%3Cpath d='M95 385.6l1.9 1.9 -1.9 1.9 -1.9 -1.9z' opacity='0.34'/%3E%3Cpath d='M280 152.2l2.8 2.8 -2.8 2.8 -2.8 -2.8z' opacity='0.29'/%3E%3Cpath d='M1283 25.9l2.8 2.8 -2.8 2.8 -2.8 -2.8z' opacity='0.16'/%3E%3Cpath d='M339 473.5l2.7 2.7 -2.7 2.7 -2.7 -2.7z' opacity='0.26'/%3E%3Cpath d='M513 106.0l1.0 1.0 -1.0 1.0 -1.0 -1.0z' opacity='0.10'/%3E%3Cpath d='M136 195.2l2.0 2.0 -2.0 2.0 -2.0 -2.0z' opacity='0.34'/%3E%3Cpath d='M692 215.9l2.1 2.1 -2.1 2.1 -2.1 -2.1z' opacity='0.11'/%3E%3Cpath d='M331 233.7l1.3 1.3 -1.3 1.3 -1.3 -1.3z' opacity='0.28'/%3E%3Cpath d='M592 69.5l2.9 2.9 -2.9 2.9 -2.9 -2.9z' opacity='0.12'/%3E%3Cpath d='M222 434.8l1.7 1.7 -1.7 1.7 -1.7 -1.7z' opacity='0.25'/%3E%3Cpath d='M377 183.0l2.4 2.4 -2.4 2.4 -2.4 -2.4z' opacity='0.17'/%3E%3Cpath d='M765 311.6l2.6 2.6 -2.6 2.6 -2.6 -2.6z' opacity='0.23'/%3E%3Cpath d='M1286 408.8l1.0 1.0 -1.0 1.0 -1.0 -1.0z' opacity='0.18'/%3E%3Cpath d='M98 273.2l2.9 2.9 -2.9 2.9 -2.9 -2.9z' opacity='0.20'/%3E%3Cpath d='M30 507.2l1.4 1.4 -1.4 1.4 -1.4 -1.4z' opacity='0.20'/%3E%3Cpath d='M347 79.0l3.0 3.0 -3.0 3.0 -3.0 -3.0z' opacity='0.13'/%3E%3Cpath d='M738 101.6l2.4 2.4 -2.4 2.4 -2.4 -2.4z' opacity='0.32'/%3E%3Cpath d='M98 447.5l1.9 1.9 -1.9 1.9 -1.9 -1.9z' opacity='0.10'/%3E%3Cpath d='M1007 156.9l1.8 1.8 -1.8 1.8 -1.8 -1.8z' opacity='0.24'/%3E%3Cpath d='M1313 324.1l1.1 1.1 -1.1 1.1 -1.1 -1.1z' opacity='0.10'/%3E%3Cpath d='M792 416.5l2.4 2.4 -2.4 2.4 -2.4 -2.4z' opacity='0.28'/%3E%3Cpath d='M319 38.2l2.9 2.9 -2.9 2.9 -2.9 -2.9z' opacity='0.23'/%3E%3Cpath d='M1171 425.5l2.1 2.1 -2.1 2.1 -2.1 -2.1z' opacity='0.10'/%3E%3Cpath d='M1123 467.1l2.6 2.6 -2.6 2.6 -2.6 -2.6z' opacity='0.17'/%3E%3Cpath d='M21 502.0l1.4 1.4 -1.4 1.4 -1.4 -1.4z' opacity='0.23'/%3E%3C/g%3E%3C/svg%3E") center top/cover no-repeat,
    radial-gradient(110% 62% at 84% 108%,rgba(224,164,70,.13),rgba(201,122,91,.05) 46%,rgba(201,122,91,0) 72%)}
footer.ridge{margin-top:12vh;padding:calc(64px + 4vh) 44px 5vh;background:linear-gradient(to bottom,transparent 62px,#120b08 62px)}
footer.ridge::before{height:64px;clip-path:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1366 64' preserveAspectRatio='none'%3E%3Cpath fill='%231d140f' d='M0 30L150 14L310 25L540 5L780 20L1010 1L1180 16L1366 7V64H0Z'/%3E%3Cpath fill='none' stroke='%23f4c774' stroke-opacity='.28' stroke-width='1.2' vector-effect='non-scaling-stroke' d='M0 30L150 14L310 25L540 5L780 20L1010 1L1180 16L1366 7'/%3E%3Cpath fill='%23120b08' d='M0 62L230 56L400 61L660 51L920 58L1150 49L1366 54V64H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
@media (max-width:760px){footer.ridge{padding:calc(40px + 3vh) 6vw 5vh;background:linear-gradient(to bottom,transparent 38px,#120b08 38px)}footer.ridge::before{height:40px}}
main.plate{
  background-image:
    radial-gradient(ellipse 80% 70% at 48% 42%,rgba(255,236,210,.045),rgba(255,236,210,0) 72%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .94 0 0 0 0 .9 0 0 0 0 .84 0 0 0 .075 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  box-shadow:inset 0 0 70px rgba(10,6,3,.32),7px 7px 0 rgba(10,6,3,.5);
  rotate:var(--tilt,0deg)}
body[data-page=apply] main.plate{--tilt:-.35deg}
body[data-page=writing] main.plate{--tilt:.3deg}
body[data-page=materials] main.plate{--tilt:-.25deg}
body[data-page=article] main.plate{--tilt:.15deg}
.plate>.tape{position:absolute;top:-12px;width:64px;height:22px;z-index:6;pointer-events:none;
  background:linear-gradient(90deg,rgba(216,198,163,.42),rgba(216,198,163,.52) 40%,rgba(216,198,163,.38));
  box-shadow:0 1px 2px rgba(10,6,3,.35);
  -webkit-mask:linear-gradient(90deg,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%);
          mask:linear-gradient(90deg,transparent 0,#000 3px,#000 calc(100% - 3px),transparent 100%)}
.plate>.tape.l{left:16px;rotate:-6deg}
.plate>.tape.r{right:18px;rotate:5deg}
.plate>.tape.c{left:calc(50% - 32px);rotate:-2deg}
.bar .crumb{display:inline-flex;align-items:center;gap:14px}
.bar .crumb::before{content:"";flex:none;width:44px;aspect-ratio:640/393;background:var(--ember);opacity:.92;
  -webkit-mask:url("../arete-mark-mask.png") center/contain no-repeat;mask:url("../arete-mark-mask.png") center/contain no-repeat}
.bar nav:not(.open) a{color:var(--cream-faint);font-size:10.5px;letter-spacing:.24em}
.bar nav:not(.open) a:hover{color:var(--ember)}
.bar nav:not(.open) a[aria-current]{color:var(--cream-soft)}
@media (max-width:760px){.bar .crumb{gap:10px}.bar .crumb::before{width:32px}}
@media (max-width:400px){.bar{gap:10px}.bar .crumb{letter-spacing:.14em}}
.bar .burger.pencil-btn,.bar .nav-close.pencil-btn{border:1px solid transparent}
@media (max-width:760px){
  .bar.has-burger nav.open .nav-close.pencil-btn{border-color:transparent}
  .bar.has-burger nav.open a[aria-current]{color:var(--cream)}
}
#apply .field{margin-top:3.4vh}
#apply input[type=text],#apply textarea{border:0;border-radius:0;box-shadow:none;outline:none;
  color:var(--cream);font-family:var(--mono);font-style:italic;font-size:15px;
  background-color:transparent;background-repeat:no-repeat;
  background-image:url("img/u-cream.png"),url("img/u-ember.png"),url("img/u-terra.png");
  background-size:1000px 12px,0 0,0 0;background-position:-9px bottom,-9px bottom,-9px bottom}
#apply input[type=text]{padding:2px 2px 12px;line-height:1.4}
#apply #f-contact{background-image:url("img/u-cream2.png"),url("img/u-ember.png"),url("img/u-terra.png")}
#apply textarea{line-height:28px;padding:4px 2px 0;min-height:calc(28px * 4 + 4px);resize:none;field-sizing:content;
  background-image:url("img/ruling-cream.png"),url("img/ruling-ember.png");
  background-size:1000px 168px,0 0;background-repeat:repeat-y,no-repeat;background-attachment:local,local;background-position:-9px 1px,-9px 1px;
  background-clip:content-box}   
#apply input::placeholder,#apply textarea::placeholder{color:rgba(239,231,214,.42);font-style:italic}
#apply input[type=text]:focus{background-size:0 0,1000px 12px,0 0;background-color:transparent}
#apply textarea:focus{background-size:0 0,1000px 168px;background-repeat:no-repeat,repeat-y;background-color:transparent}
#apply input[type=text]:user-invalid{background-size:0 0,0 0,1000px 12px}
#apply input[type=text]:user-invalid:focus{background-size:0 0,0 0,1000px 12px}
#apply .field::after{display:none}
#apply .chips{gap:12px 30px;padding:4px 0 0 2px}
#apply .chips label{position:relative;border:0;padding:8px 2px;font-size:12.5px;letter-spacing:.14em;color:var(--cream-soft);
  box-shadow:none;background:no-repeat left calc(100% - 1px)/0 0 url("img/u-ember.png");transition:color .2s}
#apply .chips label:hover{color:var(--cream)}
#apply .chips input:checked+label{color:var(--cream);box-shadow:none}
#apply .chips input:focus-visible+label{outline:none;background-size:1000px 12px;color:var(--cream)}
#apply .chips input[type=radio]+label::before{content:"";position:absolute;left:-17px;right:-17px;top:-6px;bottom:-6px;pointer-events:none;
  background:var(--ember);opacity:0;
  -webkit-mask:url("img/ring1.png") center/100% 100% no-repeat;mask:url("img/ring1.png") center/100% 100% no-repeat;transition:opacity .2s}
#apply .chips input[type=radio]+label+input+label::before{-webkit-mask-image:url("img/ring2.png");mask-image:url("img/ring2.png")}
#apply .chips input[type=radio]:not(:checked)+label:hover::before{opacity:.28;background:var(--cream)}
#apply .chips input[type=radio]:checked+label::before{opacity:.95;clip-path:inset(0 0 0 0)}
#apply .chips input[type=radio]+label::before{clip-path:inset(0 100% 0 0);transition:opacity .2s,clip-path .4s cubic-bezier(.3,.6,.3,1)}
#apply .chips input[type=radio]:not(:checked)+label:hover::before{clip-path:inset(0 0 0 0)}
#apply .chips input[type=checkbox]+label{padding-left:31px}
#apply .chips input[type=checkbox]+label::before{content:"";position:absolute;left:0;top:calc(50% - 11px);width:22px;height:22px;pointer-events:none;
  background:var(--cream);opacity:.6;-webkit-mask:url("img/box.png") center/100% 100% no-repeat;mask:url("img/box.png") center/100% 100% no-repeat}
#apply .chips input[type=checkbox]+label::after{content:"";position:absolute;left:0;top:calc(50% - 23px);width:34px;height:34px;pointer-events:none;
  background:var(--ember);opacity:0;-webkit-mask:url("img/tick.png") center/100% 100% no-repeat;mask:url("img/tick.png") center/100% 100% no-repeat;
  clip-path:inset(0 100% 0 0);transition:opacity .15s,clip-path .35s cubic-bezier(.3,.6,.3,1)}
#apply .chips input[type=checkbox]:checked+label::after{opacity:1;clip-path:inset(0 0 0 0)}
#apply .chips input[type=checkbox]:hover+label::before,#apply .chips label:hover::before{opacity:.85}
#apply .cta{padding:14px 28px}
#apply .send-err{position:relative;display:table;padding-bottom:10px}
#apply .send-err[hidden]{display:none}   
#apply .send-err::after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;background:var(--terra);opacity:.9;
  -webkit-mask:url("img/wave.png") left center/420px 14px no-repeat;mask:url("img/wave.png") left center/420px 14px no-repeat}
.confirm:focus{outline:none}               
.confirm .moonrule .r{height:12px;width:180px;opacity:.6;background:var(--cream);
  -webkit-mask:url("img/h2.png") left center/1000px 12px no-repeat;mask:url("img/h2.png") left center/1000px 12px no-repeat}
.spot{display:block;pointer-events:none}
.spot video{display:block;width:100%;height:auto;background:transparent}
body[data-page=apply] main>.spot{position:absolute;left:calc(100% + 5vw);top:15vh;width:clamp(120px,10.5vw,158px);z-index:1}
.confirm .spot{float:right;width:min(26%,122px);margin:18px -6px 8px 18px}
@media (max-width:1180px){
  body[data-page=apply] main>.spot{position:relative;left:auto;top:auto;float:right;width:min(24%,112px);margin:-6px -8px 8px 14px}
}
@media (max-width:1180px){body[data-page=apply] main:has(.confirm.on)>.spot{display:none}}
@media (min-width:1181px){
  body[data-page=apply] main.sheet{translate:-5vw 0}
}
.article>.tape{grid-column:auto}
.tag{border:0;padding:0;font-size:10.5px;letter-spacing:.16em;color:var(--cream-faint)}
.tags,.entry .e-tags,.book .b-tags{gap:4px 18px}
a.tag:hover{color:var(--ember)}
.entry,.book{border-bottom:0;position:relative}
.entry::after,.book::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:10px;pointer-events:none;background:var(--cream);opacity:.32;
  -webkit-mask:url("img/rule1.png") -9px center/1000px 10px no-repeat;mask:url("img/rule1.png") -9px center/1000px 10px no-repeat}
.entry:nth-of-type(even)::after,.book:nth-of-type(even)::after{-webkit-mask-image:url("img/rule2.png");mask-image:url("img/rule2.png")}
.roll-head .r,.moonrule .r,.foot-rule .r{height:12px;background:var(--cream);
  -webkit-mask:url("img/h2.png") left center/1000px 12px no-repeat;mask:url("img/h2.png") left center/1000px 12px no-repeat}
.roll-head .r{opacity:.4}
.book .b-cover{border:0;box-shadow:4px 5px 0 rgba(10,6,3,.4);
  background:url("img/fh-cream.png") -9px -3px/1000px 12px no-repeat,url("img/fh-cream2.png") right -9px bottom -3px/1000px 12px no-repeat,
    url("img/fv-cream.png") -3px -9px/12px 720px no-repeat,url("img/fv-cream2.png") right -3px bottom -9px/12px 720px no-repeat,rgba(10,6,3,.34)}
.book .b-cover::before{height:12px;opacity:.8;-webkit-mask:url("img/h3.png") left center/1000px 12px no-repeat;mask:url("img/h3.png") left center/1000px 12px no-repeat}
.article h2{border-top:0;background:url("img/rule-cream.png") -9px 0/1000px 10px no-repeat}
.article hr{height:12px;opacity:.45;-webkit-mask:url("img/h1.png") left center/1000px 12px no-repeat;mask:url("img/h1.png") left center/1000px 12px no-repeat}
.footnotes::before{height:12px;-webkit-mask:url("img/h3.png") left center/1000px 12px no-repeat;mask:url("img/h3.png") left center/1000px 12px no-repeat}
blockquote{border-left:0;background:url("img/v-ember.png") -3px 2px/12px 720px no-repeat}
.callout,pre,figure.block .ph,.embed-video .ev-slot,.embed{border:0;
  background-image:url("img/fh-cream.png"),url("img/fh-cream2.png"),url("img/fv-cream.png"),url("img/fv-cream2.png");
  background-position:-9px -3px,right -9px bottom -3px,-3px -9px,right -3px bottom -9px;
  background-size:1000px 12px,1000px 12px,12px 720px,12px 720px;background-repeat:no-repeat}
pre{background-color:rgba(10,6,3,.28)}
figure.block .ph,.embed-video .ev-slot{background-color:rgba(10,6,3,.26)}
figure.block .ph{padding:0 8%;text-align:center}
.article th{border-bottom:0}
.article td{border-bottom:0}
.article thead tr{background:url("img/fh-cream.png") -9px calc(100% + 4px)/1000px 12px no-repeat}
.article tbody tr{background:url("img/rule-cream.png") -9px calc(100% + 4px)/1000px 10px no-repeat}