@import "https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Inter:wght@400;600&family=Shippori+Mincho:wght@500;700&display=swap";
:root{--paper:#f2ecd9;--paper2:#e6ddc4;--ink:#24251f;--green:#536b45;--orange:#c55a2e;--indigo:#313e69;--line:#aaa187;--danger:#893c31;--fast:.18s;--slow:.8s}*{box-sizing:border-box}body{color:var(--ink);background-color:#d6cfba;background-image:linear-gradient(90deg,#313e6909 1px,#0000 1px),linear-gradient(#313e6909 1px,#0000 1px);background-position:0 0;background-repeat:repeat;background-size:24px 24px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;margin:0;font-family:Inter,sans-serif}button,input,textarea{font:inherit;color:inherit}button{border:1px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;text-transform:uppercase;letter-spacing:.08em;padding:.72rem 1rem;font:500 .72rem DM Mono}button:hover{background:var(--orange)}button:disabled{opacity:.35;cursor:not-allowed}main{min-height:100vh;padding:20px}header{border-bottom:2px solid var(--ink);justify-content:space-between;align-items:end;padding:5px 4px 15px;display:flex}h1,h2{margin:0;font-family:Shippori Mincho,serif}h1{font-size:clamp(2.2rem,5vw,5.8rem);line-height:.8}small,.ledger b{letter-spacing:.13em;font:500 .68rem DM Mono}.wallet{align-items:center;gap:12px;display:flex}.worktop{border-bottom:2px solid var(--ink);grid-template-columns:180px minmax(520px,1fr) 310px;min-height:660px;display:grid}.ledger{border-right:1px solid var(--ink);padding:28px 18px 20px 4px;position:relative}.ledger dl{margin-top:38px}.ledger dt{color:var(--green);text-transform:uppercase;font:500 .62rem DM Mono}.ledger dd{overflow-wrap:anywhere;margin:4px 0 23px;font-family:Shippori Mincho,serif;font-size:1.15rem}.cupRings{border:2px solid #893c3140;border-radius:50%;width:108px;height:108px;position:absolute;bottom:50px;left:22px;box-shadow:inset 0 0 0 12px #893c3114,0 0 0 22px #893c310a}.instrument{background:var(--paper);padding:24px 30px 70px;position:relative;overflow:hidden}.loadRail{align-items:end;gap:10px;display:flex}.loadRail label{flex:1}.loadRail input{width:100%}.quiet{color:var(--ink);background:0 0}label{letter-spacing:.1em;text-transform:uppercase;font:500 .62rem DM Mono;display:block}input,textarea{border:0;border-bottom:1px solid var(--ink);text-transform:none;letter-spacing:0;background:#ffffff7a;outline:none;width:100%;margin-top:7px;padding:.72rem;font-family:Inter;display:block}textarea{resize:vertical;min-height:88px}.hostFold{z-index:8;background:var(--paper2);border:1px solid var(--ink);box-shadow:12px 12px 0 var(--indigo);transform-origin:top;grid-template-columns:1fr 1fr;gap:14px;padding:20px;animation:.5s both leafUnfold;display:grid;position:absolute;inset:85px 25px auto}.hostFold label:last-of-type,.hostFold button{grid-column:1/-1}.cupStage{justify-content:center;align-items:end;height:130px;display:flex;position:relative}.cup{border:2px solid var(--ink);background:var(--paper2);border-radius:4px 4px 42px 42px;width:100px;height:46px;position:relative}.cup span{border:2px solid var(--ink);border-left:0;border-radius:0 20px 20px 0;width:28px;height:27px;position:absolute;top:3px;right:-25px}.cupStage i{background:linear-gradient(transparent,var(--green));filter:blur(1px);width:2px;height:50px;animation:3s ease-in-out infinite steamCurl;position:absolute;bottom:48px}.cupStage i:first-child{margin-left:-36px}.cupStage i:nth-child(2){animation-delay:-1s}.cupStage i:nth-child(3){margin-left:34px;animation-delay:-2s}.fan{perspective:900px;filter:drop-shadow(0 8px 8px #24251f1f);align-items:stretch;min-height:260px;margin-top:10px;display:flex}.fanBinding{background:var(--indigo);width:74px;color:var(--paper);writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:.18em;justify-content:space-between;padding:18px;font:500 .75rem DM Mono;display:flex}.leaf{--tone:calc(91% - var(--i)*2%);text-align:left;min-width:92px;color:var(--ink);background:hsl(45 35% var(--tone));border:1px solid var(--ink);transform-origin:0;transition:transform var(--slow),flex var(--slow),background var(--fast);animation:.65s both bindingSettle;animation-delay:calc(var(--i)*90ms);border-left:0;flex-direction:column;flex:1;justify-content:space-between;padding:18px 12px;display:flex}.leaf:hover{background:#ebe0bf;transform:rotateY(-5deg)}.leaf.open{background:#f8f1da;flex:1.8;transform:rotateY(-10deg)translateY(-8px)}.leaf.pinned{background:#c7d0b9}.leaf span{color:var(--orange);font:500 .65rem DM Mono}.leaf strong{writing-mode:vertical-rl;margin:auto;font-family:Shippori Mincho,serif;font-size:clamp(1.2rem,2.1vw,2rem)}.leaf em{min-height:38px;font:400 .72rem Inter}.emptyFan{border:1px solid var(--ink);background:repeating-linear-gradient(135deg,var(--paper2),var(--paper2) 12px,var(--paper) 12px,var(--paper) 24px);flex:1;place-items:center;font-family:Shippori Mincho,serif;display:grid}.profileStrip{gap:8px;display:flex;position:absolute;bottom:20px;left:30px;right:30px;overflow:auto}.profileStrip span{white-space:nowrap;border-bottom:2px solid var(--orange);padding:5px 8px;font-size:.75rem}.profileStrip b{text-transform:uppercase;color:var(--green);margin-right:8px}.slip{border-left:1px solid var(--ink);background:var(--paper2);opacity:.55;padding:28px 4px 20px 24px}.slip.visible{opacity:1;animation:.7s both inkSoak}.slip h2{margin:10px 0 35px;font-size:2.2rem}.slip label{margin:20px 0}.slip button{width:100%;margin-top:12px}.slip p{font:400 .7rem DM Mono}.seam{border-bottom:1px solid var(--ink);text-transform:uppercase;grid-template-columns:180px 1fr 1fr;gap:18px;padding:12px 4px;font:500 .68rem DM Mono;display:grid}.seam.active{background:var(--orange);color:#fff;animation:1.4s infinite palateWash}.seam code{text-align:right;text-transform:none}footer{justify-content:space-between;padding:15px 4px;font-size:.72rem;display:flex}code{font-family:DM Mono}@keyframes steamCurl{0%{opacity:0;transform:translateY(8px)skew(0)}40%{opacity:.6}to{opacity:0;transform:translateY(-35px)skew(18deg)}}@keyframes leafUnfold{0%{opacity:0;transform:rotateX(-72deg)}to{opacity:1;transform:rotateX(0)}}@keyframes bindingSettle{0%{opacity:0;transform:rotateY(70deg)}to{opacity:1;transform:rotateY(0)}}@keyframes inkSoak{0%{filter:blur(3px);clip-path:inset(0 100% 0 0)}to{filter:blur();clip-path:inset(0)}}@keyframes palateWash{50%{background:var(--indigo)}}@media (max-width:980px){.worktop{grid-template-columns:130px 1fr}.slip{border-left:0;border-top:1px solid var(--ink);grid-column:1/-1;padding:24px}.fan{overflow-x:auto}.leaf{flex:0 0 120px}.wallet code{display:none}}@media (max-width:620px){main{padding:10px}header{align-items:center}h1{font-size:2.5rem}.worktop{display:block}.ledger{border-right:0;border-bottom:1px solid var(--ink)}.ledger dl{gap:16px;margin:16px 0;display:flex;overflow:auto}.ledger dt{display:none}.ledger dd{white-space:nowrap;margin:0}.cupRings{display:none}.instrument{padding:16px 12px 65px}.loadRail{flex-wrap:wrap}.loadRail label{flex-basis:100%}.hostFold{display:block;inset:120px 10px auto}.hostFold label{margin-bottom:12px}.fanBinding{z-index:2;position:sticky;left:0}.seam{grid-template-columns:1fr}.seam code{text-align:left}footer{display:block}.wallet button{padding:.6rem}}