@layer base;@layer components{.pc{background:var(--card);border-radius:var(--radius-card);box-shadow:var(--shadow-card), inset 0 3px 0 var(--ink);padding-top:3px;position:relative}.pc-h{grid-template-columns:44px minmax(0,1fr) auto auto;align-items:center;gap:0 13px;padding:16px 18px 12px;display:grid}.pc-who{min-width:0;display:grid}.pc-who b{align-items:center;gap:7px;font-size:16px;font-weight:700;line-height:1.2;display:inline-flex}.pc-who small{font-family:var(--font-mono);color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:11.5px;overflow:hidden}.pc-time{font-family:var(--font-mono);color:var(--muted);font-size:12px}.pc-clip{gap:12px;padding:4px 18px 6px;display:grid}.pc-did{font-family:var(--font-poster);letter-spacing:.03em;text-transform:uppercase;flex-wrap:wrap;align-items:center;gap:4px 9px;margin:0;font-size:17px;line-height:1.1;display:flex}.pc-did .seal{font-size:11px}.pc-did a{color:var(--red-ink);background-image:linear-gradient(var(--red), var(--red));background-position:0 100%;background-repeat:no-repeat;background-size:100% 2px}.pc-did a:hover{color:var(--red)}.pc-did i{color:var(--muted);font-style:normal}.pc-gj{font-family:var(--font-mono);letter-spacing:.08em;color:var(--muted);font-size:11px}.pc-did time{font-family:var(--font-mono);letter-spacing:0;color:var(--muted);margin-left:auto;font-size:12px}.pc-media{padding:4px 18px 0;position:relative}.pc-photo{aspect-ratio:4/5;background:var(--bg-2);width:100%;box-shadow:0 0 0 1.5px var(--ink);display:block;position:relative;overflow:hidden}.pc-photo img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.pc-kind{background:var(--tape-ink) no-repeat 0 0 / 100% 100%;height:26px;color:var(--paper);font-family:var(--font-poster);letter-spacing:.06em;text-transform:uppercase;pointer-events:none;align-items:center;gap:9px;padding:1px 12px 0;font-size:14px;display:inline-flex;position:absolute;top:16px;left:30px}.pc-kind time{font-family:var(--font-mono);letter-spacing:.02em;opacity:.75;font-size:11px}.pc-burst{color:var(--red);pointer-events:none;margin:-48px 0 0 -48px;animation:.9s cubic-bezier(.2,.9,.3,1) forwards pc-burst;position:absolute;top:50%;left:50%}@keyframes pc-burst{0%{opacity:0;transform:scale(.4)}25%{opacity:1;transform:scale(1.12)}to{opacity:0;transform:scale(1.3)translateY(-24px)}}.pc-ms{background:var(--bg-2);box-shadow:inset 0 0 0 1.5px var(--ink);gap:2px;margin:6px 18px 0;padding:18px 20px 16px;display:grid;position:relative}.pc-ms b{font-family:var(--font-poster);letter-spacing:.01em;font-size:clamp(54px,7vw,92px);font-weight:400;line-height:.95}.pc-ms .seal{font-size:22px;position:absolute;top:16px;right:18px}.pc-text{color:var(--ink);text-wrap:pretty;margin:0;padding:14px 20px 6px;font-size:17px;line-height:1.45}.pc-meta{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:4px;font-size:11px;display:block}.pc[data-display="1"] .pc-text{font-family:var(--font-display);letter-spacing:-.005em;text-wrap:balance;padding:22px 22px 10px;font-size:clamp(30px,3.4vw,46px);font-weight:700;line-height:.98}.pc[data-display="1"] .pc-meta{margin-bottom:8px}.pc-actions{align-items:center;gap:2px;padding:6px 12px 10px;display:flex}.pc-act{border-radius:var(--radius-sm);height:40px;font-family:var(--font-mono);color:var(--ink-2);align-items:center;gap:7px;padding:0 12px;font-size:13px;font-weight:500;transition:background-color .15s,color .15s;display:inline-flex}.pc-act:hover{background:var(--sunk);color:var(--ink)}.pc-act.is-liked{color:var(--red)}.pc-act.is-liked svg{animation:.5s cubic-bezier(.2,.9,.3,1.6) pc-pop}.pc-share{margin-left:auto}@keyframes pc-pop{0%{transform:scale(1)}40%{transform:scale(1.35)rotate(-6deg)}to{transform:scale(1)}}.cm-scrim{z-index:90;background:#14121080;position:fixed;inset:0}.cm-sheet{z-index:91;background:var(--card) url(/gj/art/paper.jpg) repeat 0 0 / 760px auto;border-left:3px solid var(--ink);flex-direction:column;width:min(470px,100vw);display:flex;position:fixed;top:0;bottom:0;right:0;box-shadow:-30px 0 60px -30px #28180a8c}.cm-h{border-bottom:3px solid var(--ink);align-items:center;gap:13px;padding:18px 20px 16px;display:flex}.cm-thumb{object-fit:cover;width:44px;height:56px;box-shadow:0 0 0 1.5px var(--ink)}.cm-t{flex:1;min-width:0}.cm-t h3{font-family:var(--font-poster);letter-spacing:.02em;text-transform:uppercase;margin:0;font-size:28px;font-weight:400;line-height:1}.cm-t small{font-family:var(--font-mono);color:var(--muted);margin-top:4px;font-size:11.5px;display:block}.cm-x{width:38px;height:38px;box-shadow:inset 0 0 0 1.5px var(--hair);border-radius:50%;place-items:center;transition:background-color .15s,color .15s;display:grid}.cm-x:hover{background:var(--ink);color:var(--paper)}.cm-body{overscroll-behavior:contain;flex:1;min-height:0;padding:18px 20px 24px;overflow-y:auto}.cm-orig{border-bottom:1.5px dashed var(--hair);grid-template-columns:38px minmax(0,1fr);gap:12px;margin-bottom:8px;padding-bottom:16px;display:grid}.cm-orig b{align-items:center;gap:7px;font-size:15px;display:inline-flex}.cm-orig p{color:var(--ink-2);margin:3px 0 0;font-size:15px;line-height:1.4}.cm-note{color:var(--muted);margin:14px 0;font-size:15px}.cm-item{padding:12px 0}.cm-row{grid-template-columns:36px minmax(0,1fr);align-items:start;gap:11px;display:grid}.cm-who{flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13.5px;font-weight:700;display:flex}.cm-who span{font-family:var(--font-mono);color:var(--muted);font-size:11px;font-weight:400}.cm-who em{background:var(--ink);color:var(--paper);font-family:var(--font-poster);letter-spacing:.06em;text-transform:uppercase;padding:1px 6px 0;font-size:11px;font-style:normal}.cm-text{overflow-wrap:anywhere;margin-top:2px;font-size:15px;line-height:1.4}.cm-reply{background:var(--sunk);box-shadow:inset 3px 0 0 var(--red);margin:10px 0 0 28px;padding:10px 12px}.cm-reply-in{animation:.7s cubic-bezier(.16,1,.3,1) both cm-in}@keyframes cm-in{0%{opacity:0;transform:translateY(10px)}}.cm-typing{align-items:center;gap:5px;height:14px;display:inline-flex}.cm-typing i{background:var(--ink);border-radius:50%;width:6px;height:6px;animation:1.1s ease-in-out infinite cm-dot}.cm-typing i:nth-child(2){animation-delay:.15s}.cm-typing i:nth-child(3){animation-delay:.3s}@keyframes cm-dot{0%,60%,to{opacity:.25;transform:none}30%{opacity:1;transform:translateY(-3px)}}.cm-bar{padding:12px 16px calc(14px + env(safe-area-inset-bottom));border-top:3px solid var(--ink);background:var(--card);gap:8px;display:flex}.cm-input{background:var(--sunk);border-radius:var(--radius-sm);min-width:0;height:48px;box-shadow:inset 0 0 0 1.5px var(--hair);border:0;outline:none;flex:1;padding:0 14px;font-size:16px}.cm-input:focus{box-shadow:inset 0 0 0 2px var(--ink)}.cm-send{background:var(--red);color:#fff;border-radius:var(--radius-sm);place-items:center;width:48px;height:48px;transition:background-color .15s,opacity .15s;display:grid;box-shadow:inset 0 -3px #00000024}.cm-send:hover:not(:disabled){background:var(--red-ink)}.cm-send:disabled{opacity:.4;cursor:not-allowed}.lb{z-index:95;opacity:0;background:#120f0cf0;place-items:center;padding:28px;transition:opacity .3s;display:grid;position:fixed;inset:0}.lb[data-in="1"]{opacity:1}.lb figure{justify-items:center;gap:12px;max-width:min(560px,100%);margin:0;display:grid}.lb figure img{object-fit:contain;max-width:100%;max-height:78svh;box-shadow:0 0 0 6px var(--card), 0 0 0 7.5px var(--ink), 0 30px 60px -20px #0009;background:#1b1713}.lb figcaption{text-align:center;max-width:38em;color:var(--on-sumi);margin-top:12px}.lb figcaption .ap-label{color:#b8ad9c}.lb figcaption p{margin:6px 0 0;font-size:16px;line-height:1.4}.lb-x,.lb-nav{background:var(--card);width:48px;height:48px;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink);place-items:center;transition:background-color .15s,color .15s;display:grid;position:absolute}.lb-x:hover,.lb-nav:hover{background:var(--red);color:#fff}.lb-x{top:20px;right:20px}.lb-nav{margin-top:-24px;top:50%}.lb-prev{left:20px}.lb-next{right:20px}@media (max-width:720px){.pc-h{padding:14px 14px 10px}.pc-clip,.pc-media{padding-left:12px;padding-right:12px}.pc-kind{left:24px}.pc-text{padding:12px 16px 4px}.cm-sheet{border-left:0;border-top:3px solid var(--ink);width:100%;height:84svh;max-height:84svh;top:auto;left:0;box-shadow:0 -30px 60px -30px #28180a8c}.lb{padding:14px}.lb-nav{margin-top:0;top:auto;bottom:18px}.lb-prev{left:18px}.lb-next{right:18px}}}
