.nv-punk { width:100%; background:#ffe600; background-image:radial-gradient(#171717 0.7px,transparent 0.9px); background-size:7px 7px; color:#111; font-family:inherit; font-size:13px; line-height:1.45; text-align:left; border:3px solid #111; overflow:hidden; isolation:isolate; color-scheme:light; }
.nv-punk, .nv-punk * { box-sizing:border-box; }
.nv-punk svg { width:19px; height:19px; vertical-align:middle; flex-shrink:0; }
.nv-punk h2, .nv-punk h3, .nv-punk h4, .nv-punk p { margin:0; }
.nv-punk.nv-main { height:600px; padding:22px 28px 28px; }
.nv-punk .pk-topline { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.nv-punk .pk-client { display:inline-block; background:#111; color:white; padding:5px 12px; font-size:12px; transform:rotate(-2deg); }
.nv-punk .pk-assist { display:flex; gap:7px; align-items:center; font-weight:600; background:#00e5ff; border:2px solid #111; padding:5px 11px; box-shadow:3px 3px 0 #111; transform:rotate(2deg); }
.nv-punk .pk-header { display:flex; gap:20px; align-items:center; margin:22px 0 27px; }
.nv-punk h2 { font-family:NUnbounded,sans-serif; font-size:30px; font-weight:900; letter-spacing:-1.4px; line-height:1.22; text-wrap:balance; background:#ffe600; }
.nv-punk .pk-sticker { display:flex; align-items:center; gap:7px; padding:7px 12px; background:#ff2d95; border:2px solid #111; box-shadow:3px 3px 0 #111; transform:rotate(9deg); font-size:19px; font-weight:800; }
.nv-punk .pk-workspace { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:25px; align-items:start; }
.nv-punk .pk-board { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px; }
.nv-punk .pk-lane { background:#f7f5ed; border:2px solid #111; box-shadow:5px 5px 0 #111; min-width:0; }
.nv-punk .pk-lane-heading { display:flex; gap:7px; align-items:center; padding:9px 11px; background:#00e5ff; border-bottom:2px solid #111; }
.nv-punk .pk-lane:nth-child(2) .pk-lane-heading { background:#ff9bcf; }
.nv-punk .pk-lane:nth-child(3) .pk-lane-heading { background:#ffe600; }
.nv-punk .pk-lane:nth-child(4) .pk-lane-heading { background:#baffb7; }
.nv-punk .pk-lane-heading i { width:10px; height:10px; flex-shrink:0; border:1px solid #111; background:var(--status); border-radius:50%; }
.nv-punk .pk-lane-heading h4 { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.25px; }
.nv-punk .pk-lane-heading > span { margin-left:auto; font-size:10px; width:18px; height:18px; display:grid; place-items:center; border:1px solid #111; border-radius:50%; background:white; }
.nv-punk .pk-task { padding:12px; min-width:0; background:#fff; }
.nv-punk .pk-task-top { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.nv-punk .pk-tag { font-size:10px; border:1px solid #111; padding:1px 5px; background:#f5f3ec; }
.nv-punk .pk-task-top small { font-size:10px; color:#666; }
.nv-punk .pk-task h3 { margin:14px 0 18px; font-size:17px; line-height:1.2; font-weight:700; }
.nv-punk .pk-task-foot { display:flex; align-items:center; justify-content:space-between; gap:7px; font-size:10px; }
.nv-punk .pk-due { display:flex; gap:4px; align-items:center; white-space:nowrap; }
.nv-punk .pk-due svg { width:13px; height:13px; }
.nv-punk .pk-who { display:flex; gap:4px; align-items:center; font-size:9px; }
.nv-punk .pk-who svg { width:15px; height:15px; }
.nv-punk .pk-avatar { display:grid; place-items:center; background:#ffe600; border:1px solid #111; width:19px; height:19px; border-radius:50%; font-weight:700; }
.nv-punk .pk-document { position:relative; background:#fffef8; border:2px solid #111; padding:24px 19px 20px; box-shadow:6px 6px 0 #111; transform:rotate(1.5deg); }
.nv-punk .pk-document::after { content:""; position:absolute; bottom:-8px; left:-2px; right:-2px; height:9px; background:linear-gradient(135deg,#111 25%,transparent 25%) -5px 0/12px 12px,linear-gradient(225deg,#111 25%,transparent 25%) -5px 0/12px 12px; }
.nv-punk .pk-tape { position:absolute; left:calc(50% - 38px); top:-12px; width:76px; height:23px; background:#ff2d95d9; border-inline:2px dashed #1116; transform:rotate(-8deg); }
.nv-punk .pk-doc-label { text-transform:uppercase; font-size:9px; letter-spacing:1.6px; }
.nv-punk .pk-document h3 { font-size:23px; line-height:1.12; margin:10px 0 16px; font-weight:750; }
.nv-punk .pk-document p { font-size:12px; line-height:1.6; }
.nv-punk .pk-document ol { list-style:none; padding:0; margin:18px 0; }
.nv-punk .pk-document li { font-size:11px; padding:10px 0; border-bottom:1px dashed #9c9b95; }
.nv-punk .pk-doc-bottom { display:flex; gap:6px; align-items:center; font-size:10px; font-weight:600; }
.nv-punk .pk-task:hover { background:#fffeee; }
.nv-punk.nv-ask { background-color:#ff2d95; padding:19px; min-height:380px; }
.nv-punk .pk-chat-head { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.nv-punk .pk-chat-head h3 { font-family:NUnbounded,sans-serif; font-size:19px; font-weight:900; background:#ff2d95; }
.nv-punk .pk-chat-spark { display:grid; place-items:center; width:34px; height:34px; background:#ffe600; border:2px solid #111; box-shadow:3px 3px 0 #111; transform:rotate(-8deg); }
.nv-punk .pk-chat-owner { margin-left:auto; background:#111; color:white; padding:4px 9px; font-size:11px; }
.nv-punk .pk-chat { padding-right:4px; }
.nv-punk .pk-question { margin:0 0 19px 42px; padding:13px 15px; border:2px solid #111; background:#00e5ff; box-shadow:4px 4px 0 #111; border-radius:13px 13px 0 13px; font-size:13px; }
.nv-punk .pk-answer { padding:17px; border:2px solid #111; background:#fffef8; box-shadow:5px 5px 0 #111; border-radius:13px 13px 13px 0; font-size:14px; line-height:1.65; min-height:135px; }
.nv-punk .pk-source { display:flex; gap:6px; align-items:center; border-top:1px dashed #aaa; margin-top:14px; padding-top:10px; font-size:11px; font-weight:600; }
.nv-punk .pk-source svg { width:15px; height:15px; }
.nv-punk .pk-chat-actions { display:flex; justify-content:flex-end; margin-top:15px; }
.nv-punk .pk-insert { display:flex; gap:16px; align-items:center; background:#ffe600; border:2px solid #111; box-shadow:3px 3px 0 #111; padding:7px 12px; font-weight:650; font-size:12px; }
.nv-punk .pk-meta { font-size:10px; margin-top:19px; padding:7px 9px; background:#111; color:#fff; line-height:1.6; }
.nv-punk [data-after] { visibility:hidden; }
.nv-punk.is-done [data-after] { visibility:visible; }
@container nv (max-width:899px) {
 .nv-punk.nv-main { padding:20px; }
 .nv-punk .pk-workspace { grid-template-columns:minmax(0,1fr) 220px; gap:20px; }
 .nv-punk h2 { font-size:25px; }
 .nv-punk .pk-task h3 { font-size:15px; }
 .nv-punk .pk-task-foot { flex-wrap:wrap; }
 .nv-punk .pk-document { padding:23px 14px 16px; }
}
@container nv (max-width:640px) {
 .nv-punk.nv-main { height:auto; padding:13px 13px 20px; }
 .nv-punk .pk-client { font-size:10px; padding:4px 7px; }
 .nv-punk .pk-assist { font-size:9px; padding:4px 6px; gap:4px; }
 .nv-punk .pk-assist svg { width:14px; height:14px; }
 .nv-punk .pk-header { gap:9px; margin:16px 0; }
 .nv-punk h2 { font-size:22px; letter-spacing:-.8px; }
 .nv-punk .pk-sticker { padding:4px 7px; font-size:14px; gap:4px; }
 .nv-punk .pk-sticker svg { width:15px; height:15px; }
 .nv-punk .pk-workspace { display:block; }
 .nv-punk .pk-board { gap:12px; }
 .nv-punk .pk-lane { box-shadow:3px 3px 0 #111; }
 .nv-punk .pk-lane-heading { padding:6px 7px; gap:4px; }
 .nv-punk .pk-lane-heading h4 { font-size:8px; letter-spacing:0; }
 .nv-punk .pk-lane-heading > span { width:15px; height:15px; font-size:8px; }
 .nv-punk .pk-lane-heading i { width:7px; height:7px; }
 .nv-punk .pk-task { padding:9px; }
 .nv-punk .pk-tag, .nv-punk .pk-task-top small { font-size:8px; }
 .nv-punk .pk-task h3 { font-size:14px; min-height:34px; margin:9px 0 10px; }
 .nv-punk .pk-task-foot { align-items:flex-start; flex-direction:column; gap:6px; font-size:9px; }
 .nv-punk .pk-who { font-size:8px; min-height:19px; }
 .nv-punk .pk-document { margin-top:20px; padding:13px 13px 11px; transform:none; box-shadow:4px 4px 0 #111; }
 .nv-punk .pk-tape { width:55px; left:auto; right:15px; height:18px; top:-9px; }
 .nv-punk .pk-doc-label { font-size:8px; }
 .nv-punk .pk-document h3 { font-size:18px; margin:4px 0 6px; }
 .nv-punk .pk-document p { font-size:10px; line-height:1.5; }
 .nv-punk .pk-document ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 10px; margin:8px 0 0; }
 .nv-punk .pk-document li { font-size:9px; padding:5px 0; }
 .nv-punk .pk-doc-bottom { display:none; }
 .nv-punk.nv-ask { padding:16px; }
 .nv-punk .pk-chat-head h3 { font-size:16px; }
 .nv-punk .pk-question { margin-left:22px; }
 .nv-punk .pk-answer { padding:14px; font-size:13px; }
}