.pp{--ink:#181410;--paper:#f4ead5;--paper-2:#ece1c8;--pink:#ff3a86;--blue:#1f3df0;--yellow:#ffd83a;--green:#1aa672;--rule:#18141029;--display:"Bricolage Grotesque", "Helvetica Neue", sans-serif;--serif:"Newsreader", "Times New Roman", serif;--mono:"JetBrains Mono", ui-monospace, Menlo, monospace;background:var(--paper);width:100%;min-height:100vh;color:var(--ink);font-family:var(--display);isolation:isolate;padding-bottom:60px;position:relative;overflow-x:clip}.pp ::selection{background:var(--pink);color:var(--paper)}:where(.pp) a{color:inherit;text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:1px}:where(.pp) a:hover{color:var(--pink)}.pp-grain{z-index:1;pointer-events:none;mix-blend-mode:multiply;opacity:.7;background-image:radial-gradient(#1814100d 1px,#0000 1px),radial-gradient(#1814100a 1px,#0000 1px);background-position:0 0,1px 2px;background-size:3px 3px,7px 7px;position:fixed;inset:0}.pp-top{z-index:5;border-bottom:1.5px solid var(--ink);background:var(--paper);font-family:var(--mono);text-transform:lowercase;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:18px 32px;font-size:12px;display:grid;position:relative}.pp-top-mid{justify-self:start;align-items:baseline;gap:8px;display:inline-flex}.pp-top-mark{background:var(--pink);border-radius:50%;width:10px;height:10px;display:inline-block;transform:translateY(-1px)}.pp-top-word{font-family:var(--display);letter-spacing:-.02em;font-size:16px;font-weight:800}.pp-top-tag{font-family:var(--mono);opacity:.55;font-size:11px}.pp-chip{border:1.5px solid var(--ink);font-family:var(--mono);background:var(--paper);cursor:pointer;border-radius:999px;justify-self:end;align-items:center;gap:6px;padding:5px 10px;font-size:11px;display:inline-flex}.pp-chip-muted{opacity:.5;cursor:default}.pp-chip-signin:hover{background:var(--ink);color:var(--paper)}.pp-chip-user img{border:1px solid var(--ink);border-radius:50%;width:16px;height:16px}.pp-chip-out{cursor:pointer;color:inherit;opacity:.5;background:0 0;border:none;padding:0 0 0 4px;font-size:14px;line-height:1}.pp-chip-out:hover{opacity:1;color:var(--pink)}.pp-board{z-index:2;max-width:1040px;margin:44px auto 0;padding:0 32px;position:relative}.pp-board-head{grid-template-columns:auto 1fr auto;align-items:center;gap:16px;margin-bottom:22px;padding:0 4px;display:grid}.pp-stamp{border:1.5px solid var(--ink);background:var(--yellow);font-family:var(--mono);letter-spacing:.08em;text-transform:lowercase;box-shadow:3px 3px 0 var(--ink);border-radius:4px;padding:6px 12px;font-size:11px;display:inline-block;transform:rotate(-1.6deg)}.pp-board-rule{border-top:1.5px dashed var(--ink);opacity:.45;height:0}.pp-board-count{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;opacity:.6;font-size:11px}.pp-list{flex-direction:column;gap:18px;margin:0;padding:0;list-style:none;display:flex}.pp-row{border:1.5px solid var(--ink);background:var(--paper);border-radius:14px;grid-template-columns:1fr auto auto;align-items:stretch;transition:transform .22s,box-shadow .22s;display:grid;position:relative;overflow:hidden}.pp-row:before{content:"";pointer-events:none;border-left:1.5px dashed #18141047;width:0;position:absolute;top:12px;bottom:12px;left:224px}.pp-row:hover{box-shadow:7px 7px 0 var(--ink);transform:translate(-3px,-3px)}.pp-row-main{text-align:left;cursor:pointer;font:inherit;color:inherit;background:0 0;border:none;grid-template-columns:200px 1fr;align-items:center;gap:24px;width:100%;height:100%;padding:16px 22px 16px 16px;display:grid}.pp-row-main:focus-visible{outline:3px solid var(--blue);outline-offset:-3px}.pp-row-index{font-family:var(--serif);letter-spacing:-.04em;color:var(--paper);-webkit-text-stroke:1.5px var(--ink);z-index:2;pointer-events:none;text-shadow:2px 2px #1814100f;font-size:56px;font-style:italic;font-weight:500;line-height:1;position:absolute;top:6px;left:14px;transform:rotate(-3deg)}.pp-row-art{border:1.5px solid var(--ink);background-image:radial-gradient(#1814102e 1px,#0000 1px);background-size:5px 5px;border-radius:10px;justify-content:center;align-items:center;height:124px;display:flex;position:relative;overflow:hidden}.pp-row-pink .pp-row-art{background-color:var(--pink);color:var(--paper)}.pp-row-blue .pp-row-art{background-color:var(--blue);color:var(--paper)}.pp-row-yellow .pp-row-art{background-color:var(--yellow);color:var(--ink)}.pp-row-green .pp-row-art{background-color:var(--green);color:var(--paper)}.pp-row-art-inner{justify-content:center;align-items:center;width:90%;transition:transform .3s;display:flex}.pp-row-main:hover .pp-row-art-inner{transform:translate(-2px,-2px)rotate(-1.5deg)}.pp-art{width:100%;height:auto}.pp-row-text{flex-direction:column;gap:6px;min-width:0;padding:4px 0;display:flex}.pp-row-title{font-family:var(--display);letter-spacing:-.03em;text-transform:lowercase;flex-wrap:wrap;align-items:baseline;gap:10px;font-size:clamp(26px,3vw,34px);font-weight:800;line-height:1;display:flex}.pp-row-sub{font-family:var(--serif);color:var(--blue);letter-spacing:-.01em;font-size:17px;font-style:italic;font-weight:400}.pp-row-pink .pp-row-sub{color:var(--pink)}.pp-row-yellow .pp-row-sub{color:var(--ink);opacity:.65}.pp-row-green .pp-row-sub{color:var(--green)}.pp-row-rule{font-family:var(--serif);opacity:.82;max-width:56ch;font-size:15px;line-height:1.5}.pp-row-meta{font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;opacity:.55;align-items:center;gap:8px;margin-top:2px;font-size:10.5px;display:inline-flex}.pp-row-dot{background:var(--ink);border-radius:50%;width:6px;height:6px;display:inline-block}.pp-row-pipe{opacity:.4;margin:0 6px}.pp-row-cta{border:1.5px solid var(--ink);background:var(--yellow);min-width:96px;color:var(--ink);font-family:var(--display);text-transform:lowercase;cursor:pointer;box-shadow:4px 4px 0 var(--ink);border-radius:8px;flex-direction:column;justify-content:center;align-self:center;align-items:center;gap:2px;margin:16px 22px;padding:14px 18px;font-weight:800;transition:transform .2s,box-shadow .2s,background .15s;display:inline-flex;position:relative;transform:rotate(-2.2deg)}.pp-row-cta-label{letter-spacing:-.03em;font-size:22px;line-height:1}.pp-row-cta-arrow{font-family:var(--mono);font-size:14px;font-weight:500;transition:transform .2s}.pp-row-main:hover~.pp-row-cta,.pp-row-cta:hover{box-shadow:6px 6px 0 var(--ink);background:var(--paper);transform:rotate(0)translate(-1px,-1px)}.pp-row-main:hover~.pp-row-cta .pp-row-cta-arrow,.pp-row-cta:hover .pp-row-cta-arrow{transform:translate(4px)}.pp-row:has(.pp-row-cta:hover) .pp-row-art-inner{transform:translate(-2px,-2px)rotate(-1.5deg)}.pp-row-mp{border:none;border-left:1.5px dashed var(--ink);background:repeating-linear-gradient(45deg, var(--paper-2), var(--paper-2) 6px, var(--paper) 6px, var(--paper) 12px);min-width:188px;color:var(--ink);font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;white-space:nowrap;justify-content:center;align-self:stretch;align-items:center;gap:8px;padding:0 22px;font-size:11px;transition:background .18s,color .18s;display:inline-flex}.pp-row-mp-spacer{pointer-events:none;align-self:stretch;min-width:188px;display:block}.pp-row-mp:hover{background:var(--ink);color:var(--paper)}.pp-row-mp:hover .pp-row-mp-dot{background:var(--yellow)}.pp-row-mp-dot{background:var(--pink);width:7px;height:7px;box-shadow:0 0 0 2px var(--paper);border-radius:50%;display:inline-block}.pp-row-mp:disabled{opacity:.55;cursor:not-allowed}.pp-error{z-index:2;max-width:1100px;font-family:var(--mono);color:var(--pink);margin:14px auto 0;padding:0 32px;font-size:13px;position:relative}.pp-privacy{z-index:2;border:1.5px solid var(--ink);background-color:color-mix(in srgb, var(--green) 16%, var(--paper));box-shadow:4px 4px 0 var(--ink);background-image:repeating-linear-gradient(-45deg,#0000 0 12px,#1aa6721a 12px 24px);border-radius:12px;grid-template-columns:auto 1fr;align-items:center;gap:22px;margin:0 0 22px;padding:18px 24px 18px 22px;display:grid;position:relative}.pp-privacy-stamp{border:1.5px solid var(--ink);background:var(--green);color:var(--paper);font-family:var(--mono);text-transform:uppercase;box-shadow:3px 3px 0 var(--ink);white-space:nowrap;border-radius:6px;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 14px;line-height:1.1;display:inline-flex;transform:rotate(-2.4deg)}.pp-privacy-stamp-line1{letter-spacing:.14em;font-size:14px;font-weight:700}.pp-privacy-stamp-line2{letter-spacing:.16em;opacity:.85;font-size:10px}.pp-privacy-body{flex-direction:column;gap:6px;display:flex}.pp-privacy-body p{font-family:var(--serif);color:var(--ink);margin:0;font-size:15px;line-height:1.55}.pp-privacy-body strong{font-family:var(--display);background:var(--yellow);text-transform:lowercase;letter-spacing:-.01em;border-radius:3px;padding:0 5px;font-style:normal;font-weight:800}.pp-privacy-body em{color:var(--green);background:color-mix(in srgb, var(--green) 14%, var(--paper));border-radius:3px;padding:0 4px;font-style:italic;font-weight:500}.pp-privacy-link{font-family:var(--mono);letter-spacing:.08em;text-transform:lowercase;border-bottom:1.5px solid var(--ink);color:var(--ink);align-self:flex-start;align-items:center;gap:4px;margin-top:2px;padding:0 0 2px;font-size:11px;text-decoration:none;transition:color .15s,border-color .15s;display:inline-flex}.pp-privacy-link:hover{color:var(--pink);border-bottom-color:var(--pink)}@media (width<=820px){.pp-board{margin-top:28px;padding:0 18px}.pp-board-head{gap:12px;margin-bottom:18px}.pp-list{gap:14px}.pp-row{grid-template-columns:1fr}.pp-row:before{display:none}.pp-row-main{grid-template-rows:auto auto;grid-template-columns:96px 1fr;gap:14px 16px;padding:14px 16px}.pp-row-index{font-size:40px;top:4px;left:8px}.pp-row-art{grid-row:span 2;height:88px}.pp-row-text{grid-column:2;padding:2px 0 0}.pp-row-title{gap:8px;font-size:22px}.pp-row-sub{font-size:14px}.pp-row-rule{font-size:13.5px}.pp-row-meta{font-size:10px}.pp-row-mp{border-left:none;border-top:1.5px dashed var(--ink);justify-content:center;min-width:0;padding:12px}.pp-row-mp-spacer{display:none}.pp-row-cta{border:none;border-top:1.5px solid var(--ink);min-width:0;box-shadow:none;border-radius:0;flex-direction:row;justify-content:center;margin:0;padding:14px;transform:none}.pp-row-cta-label{font-size:18px}.pp-row-main:hover~.pp-row-cta,.pp-row-cta:hover{box-shadow:none;background:var(--paper);transform:none}.pp-top{padding:14px 16px}.pp-top-tag{display:none}.pp-privacy{grid-template-columns:1fr;gap:14px;margin-bottom:18px;padding:16px 18px}.pp-privacy-stamp{align-self:flex-start}.pp-privacy-body p{font-size:14px}}*{box-sizing:border-box;margin:0;padding:0}:root{--ink:#181410;--paper:#f4ead5;--paper-2:#ece1c8;--pink:#ff3a86;--blue:#1f3df0;--yellow:#ffd83a;--green:#1aa672;--rule:#18141029;--display:"Bricolage Grotesque", "Helvetica Neue", sans-serif;--serif:"Newsreader", "Times New Roman", serif;--mono:"JetBrains Mono", ui-monospace, Menlo, monospace}body{background:var(--paper);font-family:var(--display);color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}body.body--landing{overflow:auto}body:before{content:"";z-index:0;pointer-events:none;mix-blend-mode:multiply;opacity:.6;background-image:radial-gradient(#1814100d 1px,#0000 1px),radial-gradient(#1814100a 1px,#0000 1px);background-position:0 0,1px 2px;background-size:3px 3px,7px 7px;position:fixed;inset:0}body.body--landing:before{display:none}.app{z-index:1;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative}.app--landing{justify-content:stretch;align-items:stretch;min-height:100vh;display:block}.loading-screen{color:var(--ink);text-align:center;flex-direction:column;align-items:center;gap:18px;padding:40px;display:flex}.loading-screen h1{font-family:var(--display);letter-spacing:-.04em;text-transform:lowercase;margin-bottom:4px;font-size:64px;font-weight:800}.loading-screen h1:after{content:"●";color:var(--blue);vertical-align:.45em;margin-left:.18em;font-size:.32em}.loading-screen p{font-family:var(--serif);opacity:.7;max-width:36ch;font-size:16px;font-style:italic}.spinner{border:3px solid var(--rule);border-top-color:var(--ink);border-radius:50%;width:36px;height:36px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.game-container{border:1.5px solid var(--ink);background:var(--paper-2);box-shadow:8px 8px 0 var(--ink);border-radius:16px;padding:6px;position:relative}.game-container canvas{border:1px solid var(--ink);background:var(--paper);border-radius:10px;display:block}.webcam-pip{border:1.5px solid var(--ink);background:var(--ink);width:124px;height:92px;box-shadow:3px 3px 0 var(--ink);border-radius:8px;position:absolute;bottom:56px;right:18px;overflow:hidden;transform:rotate(2deg)}.webcam-pip video{object-fit:cover;width:100%;height:100%;display:block;transform:scaleX(-1)}.pip-blink-dot{border:1px solid var(--ink);background:#f4ead566;border-radius:50%;width:10px;height:10px;transition:background .15s;position:absolute;top:6px;right:6px}.pip-blink-dot.active{background:var(--green);box-shadow:0 0 8px var(--green)}.back-btn{border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);font-family:var(--display);text-transform:lowercase;letter-spacing:-.005em;cursor:pointer;z-index:5;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:700;transition:background .15s,color .15s,transform .15s;position:absolute;top:14px;right:14px}.back-btn:hover{background:var(--yellow);color:var(--ink);box-shadow:2px 2px 0 var(--ink);transform:translate(-1px,-1px)}.mode-toggle{border:1.5px solid var(--ink);background:var(--paper);z-index:5;border-radius:999px;gap:0;display:flex;position:absolute;top:14px;left:14px;overflow:hidden}.mode-toggle button{font-family:var(--display);text-transform:lowercase;letter-spacing:-.005em;cursor:pointer;background:var(--paper);color:var(--ink);border:none;padding:6px 14px;font-size:12px;font-weight:700;transition:background .15s,color .15s}.mode-toggle button+button{border-left:1.5px solid var(--ink)}.mode-toggle button.active{background:var(--ink);color:var(--paper)}.mode-toggle button:hover:not(.active){background:var(--yellow)}.mp-role-badge{border:1.5px solid var(--ink);background:var(--pink);color:var(--paper);font-family:var(--mono);text-transform:lowercase;letter-spacing:.06em;box-shadow:2px 2px 0 var(--ink);z-index:5;border-radius:4px;padding:6px 12px;font-size:11px;position:absolute;top:14px;left:14px;transform:rotate(-2deg)}.face-count-badge{border:1.5px solid var(--ink);background:var(--paper);font-family:var(--mono);letter-spacing:.04em;color:var(--ink);z-index:5;border-radius:4px;padding:5px 10px;font-size:11px;position:absolute;bottom:18px;left:18px}.lobby{background:var(--paper);border:1.5px solid var(--ink);width:100%;max-width:480px;box-shadow:8px 8px 0 var(--ink);text-align:center;border-radius:16px;flex-direction:column;align-items:center;gap:22px;margin:0 24px;padding:36px 32px 32px;display:flex;position:relative}.lobby h2{font-family:var(--display);letter-spacing:-.03em;text-transform:lowercase;font-size:32px;font-weight:800;line-height:1.05}.lobby h2 em{font-family:var(--serif);color:var(--blue);font-style:italic;font-weight:500}.lobby-info{font-family:var(--serif);color:var(--ink);opacity:.8;font-size:15px;line-height:1.55}.lobby-info code{font-family:var(--mono);background:var(--paper-2);border:1px solid var(--rule);border-radius:4px;padding:2px 6px;font-size:13px}.lobby-input-row{gap:8px;width:100%;display:flex}.lobby-input-row input{border:1.5px solid var(--ink);background:var(--paper-2);color:var(--ink);font-family:var(--mono);text-align:center;letter-spacing:.02em;text-transform:none;border-radius:8px;outline:none;flex:1;padding:10px 14px;font-size:13px}.lobby-input-row input:focus{background:var(--paper);box-shadow:2px 2px 0 var(--ink)}.lobby-input-row button{border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);font-family:var(--display);text-transform:lowercase;cursor:pointer;border-radius:8px;padding:10px 18px;font-size:13px;font-weight:700;transition:background .15s,color .15s}.lobby-input-row button:hover{background:var(--yellow);color:var(--ink)}.lobby-error{font-family:var(--mono);color:var(--pink);font-size:13px}.lobby-status{flex-direction:column;align-items:center;gap:14px;width:100%;display:flex}.lobby-waiting{font-family:var(--serif);opacity:.75;align-items:center;gap:10px;font-size:14px;font-style:italic;display:flex}.lobby-ready{font-family:var(--display);text-transform:lowercase;color:var(--green);align-items:center;gap:8px;font-size:16px;font-weight:700;display:inline-flex}.lobby-ready:before{content:"";background:var(--green);border-radius:50%;width:8px;height:8px;animation:0 spin}.lobby-back{border:1.5px solid var(--ink);background:var(--paper);color:var(--ink);font-family:var(--display);text-transform:lowercase;cursor:pointer;border-radius:999px;padding:8px 18px;font-size:13px;font-weight:700;transition:background .15s,transform .15s}.lobby-back:hover{background:var(--paper-2);box-shadow:2px 2px 0 var(--ink);transform:translate(-1px,-1px)}.auth-badge{border:1.5px solid var(--ink);background:var(--paper);font-family:var(--mono);color:var(--ink);border-radius:999px;align-items:center;gap:8px;padding:6px 12px;font-size:12px;display:inline-flex}.auth-signin{cursor:pointer;background:var(--ink);color:var(--paper);font-family:var(--display);text-transform:lowercase;padding:9px 14px;font-size:13px;font-weight:700;transition:background .15s,color .15s}.auth-signin:hover{background:var(--pink);color:var(--paper)}.auth-loading{opacity:.5}.auth-avatar{border:1px solid var(--ink);border-radius:50%;width:20px;height:20px}.auth-signout{color:var(--ink);opacity:.4;cursor:pointer;text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-family:var(--mono);background:0 0;border:none;padding:0 0 0 6px}.auth-signout:hover{color:var(--pink);opacity:1}.lobby-peers{justify-content:center;align-items:center;gap:14px;width:100%;display:flex}.lobby-vs{font-family:var(--serif);color:var(--blue);font-size:18px;font-style:italic;font-weight:500}.peer-card{border:1.5px solid var(--ink);background:var(--paper-2);border-radius:12px;flex-direction:column;align-items:center;gap:8px;min-width:132px;padding:14px 16px;display:flex;position:relative}.peer-card.peer-self{background:color-mix(in srgb, var(--pink) 18%, var(--paper));border-color:var(--ink);box-shadow:3px 3px 0 var(--ink)}.peer-card.peer-empty{background:var(--paper);opacity:.55;border-style:dashed}.peer-avatar,.peer-avatar-placeholder{background:var(--paper);border:1.5px solid var(--ink);border-radius:50%;width:52px;height:52px}.peer-login{font-family:var(--display);letter-spacing:-.01em;font-size:13px;font-weight:700}.peer-role{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:.6;font-size:10px}.lobby-priv{border:1.5px dashed var(--ink);background:color-mix(in srgb, var(--green) 10%, var(--paper));width:100%;font-family:var(--serif);text-align:left;color:var(--ink);border-radius:8px;grid-template-columns:auto 1fr;align-items:start;gap:10px;padding:12px 14px;font-size:13px;line-height:1.45;display:grid}.lobby-priv-label{background:var(--ink);color:var(--paper);font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;border-radius:3px;align-self:center;padding:3px 8px;font-size:9px;display:inline-block}