/* Tender Machine · the museum: a blank canvas for the pieces. Syne for the name and the headings, Manrope for the reading. Nothing hand-drawn lives here; that belongs to the pieces. */
/* the two typefaces, served from here and nowhere else (variable weights, latin) */
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('fonts/Manrope-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('fonts/Manrope-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Syne';font-style:normal;font-weight:400 800;font-display:swap;src:url('fonts/Syne-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Syne';font-style:normal;font-weight:400 800;font-display:swap;src:url('fonts/Syne-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{--wall:#F4F2EE;--wall-2:#ECE9E3;--ink:#141416;--ink-2:#4A4A50;--mute:#8A8A92;--line:#D9D6CF;--accent:#141416}
*{box-sizing:border-box}
html,body{margin:0;background:var(--wall);color:var(--ink);font:17px/1.55 Manrope,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;letter-spacing:-.005em}
a{color:inherit}
.m-wrap{max-width:1180px;margin:0 auto;padding:22px 28px 80px}
@media (max-width:640px){ .m-wrap{padding:16px 18px 60px} }
.m-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px}
.m-logo{display:inline-flex;align-items:center;gap:11px;font:700 19px/1 Syne,Manrope,sans-serif;letter-spacing:.01em;text-decoration:none;text-transform:uppercase;white-space:nowrap}
.m-logo .m-mark{display:inline-flex}.m-logo .m-mark svg{height:.86em;width:auto;display:block;overflow:visible}
@media (max-width:640px){ .m-top{flex-wrap:nowrap;gap:12px} .m-logo{font-size:15px} .m-nav{gap:14px;font-size:11px;letter-spacing:.06em;flex:none} .m-nav a:not([data-back]){display:none} }   /* one line on a phone: only the back link beside the name; Pieces and About are for the desktop */
.m-nav a{padding:12px 6px;margin:-12px -6px;-webkit-tap-highlight-color:transparent}   /* a finger-sized tap target without moving the text */
.m-nav{display:flex;gap:26px;font:500 13px/1 Manrope,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.m-nav a{text-decoration:none}
.m-nav a:hover{color:var(--ink)}
.m-h{font:700 clamp(40px,7vw,96px)/.98 Syne,Manrope,sans-serif;letter-spacing:-.035em;margin:0}
.m-sub{font:400 clamp(17px,1.6vw,21px)/1.5 Manrope,sans-serif;color:var(--ink-2);max-width:34em;margin:0}
.m-label{font:500 12px/1 Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.m-rule{border:0;border-top:1px solid var(--line);margin:0}
.m-btn{display:inline-flex;align-items:center;gap:10px;font:600 15px/1 Manrope,sans-serif;letter-spacing:.02em;color:var(--wall);background:var(--ink);text-decoration:none;padding:15px 22px;border-radius:999px;transition:transform .15s}
.m-btn:hover{transform:translateY(-1px)}
.m-btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.m-link{font:500 14px/1 Manrope,sans-serif;letter-spacing:.02em;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;color:var(--ink-2)}
.m-link:hover{color:var(--ink)}
@media (prefers-reduced-motion:reduce){ .m-btn:hover{transform:none} }
/* the foot of a page: a small name for what the foot belongs to (the site, or the piece), then one quiet line, the company and the ways round. The site's own foot also lists the open pieces. */
.m-foot{margin-top:120px;display:grid;justify-items:center;gap:14px;text-align:center;font:400 12px/1.6 Manrope,sans-serif;color:var(--mute);letter-spacing:.01em}
.m-foot-name{font:500 12px/1 Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.m-foot-pieces{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;font:500 13px/1.4 Manrope,sans-serif;color:var(--ink-2)}
.m-foot-pieces a{text-decoration:none;color:inherit;display:inline-flex;align-items:baseline;gap:8px}.m-foot-pieces a:hover{color:var(--ink)}
.m-foot-pieces .n{font-size:11px;letter-spacing:.08em;color:var(--mute)}
.m-foot-line{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 0}
.m-foot a{color:var(--mute);text-decoration:none}.m-foot a:hover{color:var(--ink)}
.m-foot-line > * + *::before{content:'·';margin:0 10px;color:var(--line)}
@media (max-width:640px){ .m-foot{margin-top:80px;font-size:11px;gap:12px} .m-foot-pieces{gap:6px 16px;font-size:12px} }
/* a plain page of reading: pricing, terms, privacy */
.m-page{max-width:720px;padding-top:clamp(40px,7vh,80px);display:grid;gap:14px}
.m-page h1{font:700 clamp(34px,5vw,64px)/1 Syne,Manrope,sans-serif;letter-spacing:-.03em;margin:0 0 10px}
.m-page h2{font:700 clamp(20px,2.2vw,26px)/1.15 Syne,Manrope,sans-serif;letter-spacing:-.02em;margin:34px 0 0;scroll-margin-top:24px}
.m-page .pieces-rule{margin-top:48px}.m-page .pieces-rule + .m-label{margin-top:20px}   /* the piece-by-piece part of a reading page, where a piece's foot lands */
.m-page p,.m-page li{color:var(--ink-2);margin:0}
.m-page ul{margin:0;padding-left:1.2em;display:grid;gap:6px}
.m-page .lead{font-size:clamp(18px,1.7vw,22px);color:var(--ink);max-width:30em}
.m-page .fine{font-size:14px;color:var(--mute)}
.m-page ul.fine{margin-top:18px;gap:8px}.m-page ul.fine li{color:var(--mute)}.m-page ul.fine a{color:var(--ink-2)}
.m-tiers{margin:26px 0 8px;border-top:1px solid var(--line)}
.m-tiers .tier{display:grid;grid-template-columns:1fr auto;gap:4px 24px;align-items:baseline;padding:15px 0;border-bottom:1px solid var(--line)}
.m-tiers .tier b{font:700 clamp(19px,2vw,24px)/1.1 Syne,Manrope,sans-serif;letter-spacing:-.02em;color:var(--ink)}
.m-tiers .tier .price{font:700 clamp(19px,2vw,24px)/1.1 Syne,Manrope,sans-serif;letter-spacing:-.02em;color:var(--ink);white-space:nowrap}
.m-tiers .tier p{grid-column:1/-1;font-size:15px}

.art-paused,.art-paused *{animation-play-state:paused!important}
