:root{--font:"Neue Haas Grotesk Display Pro", "Neue Haas Grotesk Text Pro", neue-haas-grotesk-display, neue-haas-grotesk-text, "Helvetica Now Display", "Helvetica Neue", Helvetica, Arial, sans-serif;--ink:#1b1d1f;--muted:#85898c;--faint:#b6babc;--hairline:#e9ebec;--accent:#a9b5b9}*{box-sizing:border-box}body{color:var(--ink);font:14px/1.5 var(--font);letter-spacing:.01em;-webkit-font-smoothing:antialiased;background-color:#fff;background-image:linear-gradient(#a9b5b91c 1px,#0000 1px),linear-gradient(90deg,#a9b5b91c 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:16px 16px,16px 16px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;margin:0}.page{max-width:1488px;margin:0 auto;padding:32px 48px 80px}.specimen{position:relative}.specimen .word{font-family:var(--font);letter-spacing:-.015em;white-space:nowrap;color:var(--ink);font-weight:500;line-height:1;position:absolute}.specimen .hl{background:linear-gradient(90deg,#0000,#a9b5b980 9% 91%,#0000);height:1px;position:absolute;left:-28px;right:-28px}.specimen .hl.strong{background:linear-gradient(90deg,#0000,#a9b5b9d9 9% 91%,#0000)}.specimen .vl{background:#a9b5b980;width:1px;position:absolute}.masthead .offline{color:#b98a8a;font-size:12px;position:absolute;top:6px;right:0}.masthead .me{cursor:pointer;font:400 13px/1 var(--font);color:var(--muted);letter-spacing:.01em;background:0 0;border:none;padding:4px 0;position:absolute;top:4px;right:0}.masthead .me:hover{color:var(--ink)}.masthead .account{gap:18px;display:flex;position:absolute;top:0;right:0}.masthead .account .me{position:static}.masthead .account .me+.me{color:var(--faint)}.masthead .account .me+.me:hover{color:#a05252}.sheet{z-index:60;background:#ffffffd1;position:fixed;inset:0;overflow:auto}.sheet .card{position:absolute}.sheet .sub{color:var(--muted);margin:0;font-size:13.5px;line-height:1;position:absolute}.sheet input{border:1px solid var(--hairline);height:48px;font:15px/1 var(--font);color:var(--ink);background:#fff;border-radius:10px;outline:none;padding:0 16px;position:absolute}.sheet input:focus{border-color:var(--accent)}.sheet .vis{gap:8px;display:flex;position:absolute}.sheet .vis button{border:1px solid var(--hairline);height:32px;color:var(--muted);font:400 12.5px/1 var(--font);cursor:pointer;background:#fff;border-radius:999px;padding:0 16px}.sheet .vis button.on{background:var(--ink);border-color:var(--ink);color:#fff}.sheet .save{background:var(--ink);color:#fff;height:48px;font:500 13px/1 var(--font);cursor:pointer;border:none;border-radius:999px;padding:0 26px;position:absolute}.sheet .save:disabled{opacity:.5}.sheet .out{height:48px;font:400 12.5px/1 var(--font);color:var(--faint);cursor:pointer;background:0 0;border:none;padding:0;position:absolute}.sheet .out:hover{color:#a05252}.sheet .err{color:#a05252;font-size:12.5px;line-height:1;position:absolute}.sheet .who{color:var(--faint);font-size:12px;line-height:1;position:absolute;left:32px}.searchbox{border:1px solid var(--hairline);height:64px;color:var(--faint);background:#fff;border-radius:12px;align-items:center;gap:13px;margin:32px 0 0;padding:0 20px;transition:border-color .12s;display:flex}.searchbox:focus-within{border-color:var(--accent);color:var(--muted)}.searchbox input{font:300 19px/1.4 var(--font);color:var(--ink);background:0 0;border:none;outline:none;flex:1;padding:0}.searchbox input::placeholder{color:var(--faint)}.chipbtn,.groups button,.groups .tag,.grid-ctl button,.viewer .tabs button,.viewer .acts button,.identity-panel header button{border:1px solid var(--hairline);cursor:pointer;height:32px;font:12.5px/1.3 var(--font);letter-spacing:.01em;color:var(--muted);background:#fff;border-radius:8px;align-items:center;gap:8px;padding:0 12px;transition:color .12s,border-color .12s;display:inline-flex;box-shadow:0 4px 14px #a9b5b92e}.chipbtn:hover,.groups button:hover,.groups .tag:hover,.grid-ctl button:hover,.viewer .tabs button:hover,.viewer .acts button:hover,.identity-panel header button:hover{color:var(--ink);border-color:#a9b5b9b3}.groups button.on:before,.groups .tag.on:before,.viewer .tabs button.on:before{content:"";background:var(--accent);border-radius:50%;flex:none;width:8px;height:8px}.groups button.on,.groups .tag.on,.grid-ctl button.on,.viewer .tabs button.on{color:var(--ink)}.viewer .acts button.danger{color:#a05252;background:#fdf4f4;border-color:#ecd9d9}.viewer .acts button.danger:hover{color:#7c3a3a;background:#f9e9e9;border-color:#a05252}.groups{flex-wrap:wrap;align-items:center;gap:16px 10px;padding:16px 0 32px;display:flex}.groups button i{color:var(--faint);margin-left:2px;font-size:11px;font-style:normal}.groups .g{align-items:baseline;gap:8px;display:inline-flex}.groups .distil{color:var(--accent);font-size:12px}.groups .distil:hover{color:var(--ink)}.new-group{border:1px solid var(--hairline);width:96px;height:32px;font:12.5px/1.3 var(--font);color:var(--ink);background:#fff;border-radius:8px;outline:none;padding:0 12px;transition:border-color .12s;box-shadow:0 4px 14px #a9b5b92e}.new-group:focus{border-color:var(--accent)}.new-group::placeholder{color:var(--faint)}.groups .rule{background:var(--hairline);align-self:center;width:1px;height:20px}.groups .tag{padding:0 10px;font-size:12px}.empty{color:var(--muted);text-align:center;max-width:380px;margin:18vh auto 0;line-height:1.7}.demo{max-width:560px;margin:9vh auto 0}.demo-note{color:var(--muted);text-align:center;max-width:430px;margin:0 auto 26px;font-size:13.5px;line-height:1.7}.demo-host{position:relative}.demo-site{border:1px solid var(--hairline);cursor:crosshair;background:#fff;border-radius:12px;padding:0 28px 28px;box-shadow:0 14px 44px #a9b5b92e}.demo-chrome{border-bottom:1px solid var(--hairline);color:var(--faint);align-items:center;gap:6px;margin:0 -28px 18px;padding:12px 0 12px 16px;font-size:11px;display:flex}.demo-chrome i{background:var(--hairline);border-radius:50%;width:8px;height:8px;display:block}.demo-chrome span{margin-left:10px}.demo .del{border-radius:6px;transition:box-shadow .12s,background .12s;position:relative}.demo .del:hover{background:#a9b5b938;box-shadow:0 0 0 1.5px #a9b5b9e6}.demo .del:hover:after{content:attr(data-label);z-index:3;border:1px solid var(--hairline);font:500 10.5px/1.7 var(--font);color:var(--ink);background:#fff;border-radius:5px;padding:1px 8px;position:absolute;top:-10px;right:8px;box-shadow:0 0 0 1.5px #a9b5b980,0 4px 14px #a9b5b966}.demo nav.del{color:var(--muted);align-items:center;gap:14px;margin-bottom:16px;padding:8px 10px;font-size:12px;display:flex}.demo nav.del b{background:var(--accent);border-radius:50%;width:14px;height:14px;margin-right:auto}.demo h3.del{font:500 30px/1.15 var(--font);letter-spacing:-.015em;margin:0 0 14px;padding:4px 8px}.demo-cols{gap:16px;display:flex}.demo-img{background:linear-gradient(135deg,#e2e7e9,#a9b5b9);flex:1;min-height:132px}.demo-side{flex-direction:column;align-items:flex-start;gap:12px;width:46%;display:flex}.demo-side p.del{color:var(--muted);margin:0;padding:6px 8px;font-size:12.5px;line-height:1.65}.demo-btn{background:var(--ink);color:#fff;font:500 12px/1 var(--font);cursor:crosshair;border:none;border-radius:999px;padding:10px 18px}.demo-palette{gap:6px;padding:6px 8px;display:flex}.demo-palette i{border:1px solid #1b1d1f14;border-radius:50%;width:22px;height:22px;display:block}.demo-fx{pointer-events:none;z-index:4;position:absolute;inset:0}.demo-fx i,.demo-fx s,.demo-fx b{display:block;position:absolute}.demo-fx .h{background:linear-gradient(90deg,#0000,#a9b5b9e6 16% 84%,#0000);height:1px;animation:.45s cubic-bezier(.3,0,.2,1) forwards demo-gx;transform:scaleX(0)}.demo-fx .v{background:linear-gradient(#0000,#a9b5b9e6 16% 84%,#0000);width:1px;animation:.45s cubic-bezier(.3,0,.2,1) forwards demo-gy;transform:scaleY(0)}@keyframes demo-gx{to{transform:scaleX(1)}}@keyframes demo-gy{to{transform:scaleY(1)}}.demo-fx s{opacity:0;background:linear-gradient(#a9b5b966 1px,#0000 1px) 0 0/16px 16px,linear-gradient(90deg,#a9b5b966 1px,#0000 1px) 0 0/16px 16px,#ffffff73;border-radius:6px;animation:.22s ease-out .12s forwards demo-gridin}@keyframes demo-gridin{to{opacity:1}}.demo-fx b{border:1.5px solid var(--accent);background:linear-gradient(#a9b5b980 1px,#0000 1px) 0 0/16px 16px,linear-gradient(90deg,#a9b5b980 1px,#0000 1px) 0 0/16px 16px,#ffffffb3;border-radius:6px}.demo-tray{border:1px dashed #a9b5b98c;border-radius:12px;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;min-height:64px;margin-top:14px;padding:10px;display:flex}.demo-tray .hint{color:var(--faint);font-size:12px}.phone-onb{text-align:center;border-top:1px dashed #a9b5b966;margin-top:32px;padding:16px 0 0}.phone-onb b{margin-bottom:6px;font-size:13px;font-weight:500;display:block}.phone-onb p{color:var(--muted);max-width:380px;margin:0 auto 14px;font-size:12.5px;line-height:1.65}.phone-onb .chipbtn{text-decoration:none}.demo-card{border:1px solid var(--hairline);color:var(--ink);background:#fff;border-radius:8px;align-items:center;gap:8px;padding:7px 12px;font-size:12px;animation:.3s cubic-bezier(.2,.9,.3,1.4) demo-pop;display:inline-flex;box-shadow:0 4px 14px #a9b5b940}.demo-card i{background:var(--accent);border-radius:50%;width:8px;height:8px;display:block}.demo-card em{color:var(--faint);font-size:11px;font-style:normal}@keyframes demo-pop{0%{opacity:0;transform:scale(.6)translateY(-8px)}}.masonry{columns:var(--col,310px);column-gap:48px}.block{break-inside:avoid;margin:0 0 52px;position:relative}.block img,.block video{border:1px solid var(--hairline);width:100%;display:block}.block video{background:#000}.icon-extract{border:1px solid var(--hairline);background:#fff;justify-content:center;align-items:center;padding:34px 20px;display:flex}.icon-extract img{border:none;width:auto;max-width:60%;max-height:96px}.block blockquote{border-left:1.5px solid var(--ink);font:15px/1.65 var(--font);color:var(--ink);margin:0;padding:4px 0 0 18px}.type-extract{overflow-wrap:anywhere;padding:8px 0 2px;font-size:40px;line-height:1.15}.swatches{border:1px solid var(--hairline);height:48px;display:flex}.swatches span{flex:1}.no-preview{border:1px solid var(--hairline);color:var(--faint);text-align:center;background:#fff;padding:34px 18px;font-size:12px}figcaption{padding-top:9px;position:relative}figcaption .t{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;display:block;overflow:hidden}figcaption .s{color:var(--muted);margin-top:1px;font-size:11.5px;display:block}figcaption .s a{color:inherit;text-decoration:none}figcaption .s a:hover{color:var(--ink);text-decoration:underline}figcaption .tags{opacity:0;flex-wrap:wrap;gap:2px 10px;margin-top:4px;transition:opacity .15s;display:flex}.block:hover figcaption .tags{opacity:1}figcaption .tags button{border:1px solid var(--hairline);cursor:pointer;font:11px/1.6 var(--font);color:var(--faint);background:#fff;border-radius:6px;padding:2px 8px;box-shadow:0 2px 8px #a9b5b929}figcaption .tags button:hover{color:var(--ink);border-color:#a9b5b9b3}figcaption .del{color:#0000;cursor:pointer;background:0 0;border:none;padding:0 2px;font-size:14px;line-height:1;position:absolute;top:9px;right:0}.block:hover .del{color:var(--faint)}figcaption .del:hover{color:var(--ink)!important}.kind-font{margin-bottom:44px}.identity-overlay{background:#1b1d1f52;justify-content:center;align-items:center;padding:4vh 4vw;display:flex;position:fixed;inset:0}.identity-panel{border:1px solid var(--hairline);background:#fff;border-radius:4px;flex-direction:column;width:100%;max-width:680px;max-height:88vh;display:flex;box-shadow:0 24px 80px #1b1d1f2e}.identity-panel header{border-bottom:1px solid var(--hairline);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.identity-panel h2{letter-spacing:.02em;margin:0;font-size:14px;font-weight:500}.identity-panel header button{margin-left:14px;font-size:12px}.identity-panel pre{color:var(--ink);white-space:pre-wrap;margin:0;padding:20px;font:12px/1.7 ui-monospace,monospace;overflow:auto}.block .open{cursor:zoom-in}.viewer-overlay{background:#1b1d1f57;justify-content:center;align-items:center;padding:3vh 3vw;display:flex;position:fixed;inset:0}.viewer{border:1px solid var(--hairline);background:#fff;border-radius:4px;flex-direction:column;width:100%;max-width:1180px;max-height:93vh;display:flex;box-shadow:0 28px 90px #1b1d1f33}.viewer header{border-bottom:1px solid var(--hairline);align-items:center;gap:26px;padding:14px 20px;display:flex}.viewer .who{min-width:0;margin-right:auto}.viewer .who .t{text-overflow:ellipsis;white-space:nowrap;font-size:13.5px;display:block;overflow:hidden}.viewer .who .s{color:var(--muted);font-size:11.5px;display:block}.viewer .who .s a{color:inherit;text-decoration:none}.viewer .who .s a:hover{color:var(--ink);text-decoration:underline}.viewer .tabs,.viewer .acts{gap:8px;display:flex}.viewer-body{flex:1;min-height:320px;display:flex;overflow:auto}.viewer-body iframe{background:#fff;border:none;width:100%;min-height:62vh}.viewer-body img{align-self:flex-start;max-width:100%;margin:0 auto;display:block}.viewer-body .code{width:100%;color:var(--ink);white-space:pre-wrap;word-break:break-all;margin:0;padding:20px 22px;font:12px/1.65 ui-monospace,SF Mono,Menlo,monospace;overflow:auto}.viewer-body .media{width:100%;padding:34px}.viewer-body .media img,.viewer-body .media video{border:1px solid var(--hairline)}.viewer-body .media .type-extract{font-size:72px}.viewer-body .media blockquote{max-width:640px;font-size:19px;line-height:1.6}.viewer-body .media .swatches{height:110px}.viewer footer{border-top:1px solid var(--hairline);padding:10px 20px 12px}.viewer footer .tags{flex-wrap:wrap;gap:2px 12px;display:flex}.viewer footer .tags span{color:var(--faint);font-size:11.5px}.grid-ctl{align-self:center;gap:6px;margin-left:auto;display:flex}.grid-ctl button{color:var(--faint);padding:0 9px;line-height:0}.grid-ctl button.on:before{content:none}.grid-ctl svg rect{fill:currentColor}.styles-panel{flex-direction:column;gap:28px;width:100%;padding:30px 34px;display:flex}.styles-panel h4{font:500 11.5px/1 var(--font);letter-spacing:.04em;color:var(--muted);margin:0 0 12px}.styles-panel .chips{flex-wrap:wrap;gap:8px;display:flex}.swatch{border:1px solid var(--hairline);cursor:pointer;background:0 0;border-radius:999px;align-items:center;gap:9px;padding:3px 13px 3px 4px;display:inline-flex}.swatch i{border:1px solid #1b1d1f14;border-radius:50%;width:22px;height:22px;display:block}.swatch span{color:var(--muted);font:11.5px/1.6 ui-monospace,monospace}.swatch:hover{border-color:var(--accent)}.swatch:hover span{color:var(--ink)}.styles-panel section p{color:var(--ink);margin:5px 0;font-size:21px}.styles-panel .mono{color:var(--ink);font:13px/1.6 ui-monospace,monospace}.type-try{border:none;border-bottom:1px solid var(--hairline);width:100%;color:var(--ink);background:0 0;outline:none;margin-top:22px;padding:4px 0 14px;font-size:46px}.type-try:focus{border-bottom-color:var(--accent)}.type-try::placeholder{color:var(--faint);font-size:30px}.swatches span{letter-spacing:.02em;cursor:copy;opacity:1;justify-content:center;align-items:flex-end;padding-bottom:7px;font:10px/1 ui-monospace,monospace;display:flex}.swatches span:hover{text-decoration:underline}figcaption .aspects{flex-wrap:wrap;gap:5px;margin-top:6px;display:flex}figcaption .aspects button{border:1px solid var(--hairline);cursor:pointer;font:11px/1.7 var(--font);color:var(--muted);background:#fff;border-radius:6px;align-items:center;gap:6px;padding:2px 9px;display:inline-flex;box-shadow:0 2px 8px #a9b5b929}figcaption .aspects button:hover{color:var(--ink);border-color:#a9b5b9b3}figcaption .aspects .dots{gap:2px;display:inline-flex}figcaption .aspects .dots em{border:1px solid #1b1d1f14;border-radius:50%;width:9px;height:9px;display:block}.login{min-height:100vh;position:relative}.login .card{position:absolute}.login p{text-align:center;width:100%;color:var(--muted);margin:0;font-size:13.5px;line-height:1;position:absolute;left:0}.login input{border:1px solid var(--hairline);height:48px;font:15px/1 var(--font);text-align:center;background:#fff;border-radius:12px;outline:none;padding:0 16px;position:absolute}.login input:focus{border-color:var(--accent)}.login button{background:var(--ink);color:#fff;height:48px;font:500 13px/1 var(--font);cursor:pointer;white-space:nowrap;border:none;border-radius:999px;padding:0 26px;position:absolute;left:50%;transform:translate(-50%)}.login button:disabled{opacity:.5}.login button.alt{color:var(--ink);border:1px solid var(--hairline);background:#fff;align-items:center;gap:10px;transition:border-color .12s;display:inline-flex;box-shadow:0 4px 14px #a9b5b92e}.login button.alt:hover{border-color:#a9b5b9b3}.login button.wide{border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:0;display:inline-flex;transform:none}.login .or{align-items:center;gap:12px;display:flex;position:absolute;transform:translateY(-50%)}.login .or i{background:var(--hairline);flex:1;height:1px}.login .or em{color:var(--faint);font-size:11.5px;font-style:normal;line-height:1}.login .links{justify-content:center;align-items:baseline;gap:10px;width:100%;display:flex;position:absolute;left:0}.login .links em{color:var(--faint);font-size:12px;font-style:normal}.login .links .link{width:auto;position:static}.login button.link{width:100%;height:auto;box-shadow:none;color:var(--muted);font:12.5px/1 var(--font);background:0 0;border:none;padding:0;left:0;transform:none}.login button.link:hover{color:var(--ink)}.login .err{text-align:center;color:#a05252;width:100%;font-size:12.5px;line-height:1;position:absolute;left:0}.login .info{text-align:center;color:#5c7a68;width:100%;font-size:12.5px;line-height:1;position:absolute;left:0}
