:root{--jpb-track: #e8ecf4;--jpb-fill-start: #4f7cff;--jpb-fill-end: #8b5cf6;--jpb-text: #111827;--jpb-muted: #6b7280;--jpb-success: #16a34a;--jpb-warning: #f59e0b;--jpb-error: #dc2626;--jpb-radius: 999px;--jpb-height: 14px;--jpb-speed: 1.2s;--jpb-shadow: 0 12px 30px rgb(17 24 39 / 12%)}.jpb-field{display:grid;gap:.55rem;width:100%;color:var(--jpb-text);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.jpb-label-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;font-size:.875rem}.jpb-value-text,.jpb-status-text{color:var(--jpb-muted);font-variant-numeric:tabular-nums}.jpb-status-text[data-status=success]{color:var(--jpb-success)}.jpb-status-text[data-status=warning]{color:var(--jpb-warning)}.jpb-status-text[data-status=error]{color:var(--jpb-error)}.jpb{--jpb-percent: 0%;position:relative;overflow:hidden;width:100%;height:var(--jpb-height);border-radius:var(--jpb-radius);background:var(--jpb-track);isolation:isolate}.jpb__fill{position:absolute;inset-block:0;inset-inline-start:0;width:var(--jpb-percent);border-radius:inherit;background:linear-gradient(90deg,var(--jpb-fill-start),var(--jpb-fill-end));transition:width .28s ease,height .28s ease,inline-size .28s ease,block-size .28s ease}.jpb__marker{position:absolute;z-index:2;inset-block-start:50%;inset-inline-start:var(--jpb-percent);width:1.25rem;height:1.25rem;border-radius:999px;background:#fff;border:4px solid var(--jpb-fill-end);transform:translate(-50%,-50%);box-shadow:var(--jpb-shadow)}.jpb--gradient .jpb__fill:after,.jpb--download .jpb__fill:after,.jpb--lightsaber .jpb__fill:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(90deg,transparent,rgb(255 255 255 / 55%),transparent);animation:jpb-shine var(--jpb-speed) infinite}.jpb--icon{--jpb-height: 18px;overflow:visible}.jpb--icon .jpb__marker:before{content:"★";position:absolute;inset:-.9rem auto auto 50%;transform:translate(-50%);color:var(--jpb-fill-end);font-size:.8rem}.jpb--minimal{height:8px;--jpb-track: #edf2f7;background-image:radial-gradient(circle,#cbd5e1 1px,transparent 1px);background-size:14px 8px}.jpb--minimal .jpb__fill{background-image:radial-gradient(circle,white 1px,transparent 1px),linear-gradient(90deg,var(--jpb-fill-start),var(--jpb-fill-end));background-size:14px 8px,auto}.jpb--line-number{--jpb-height: 6px;--jpb-fill-start: #0f172a;--jpb-fill-end: #4f46e5}.jpb--download{--jpb-height: 34px;color:#fff;box-shadow:var(--jpb-shadow)}.jpb--download:before{content:"Download";position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:#fff;font-size:.82rem;font-weight:800;letter-spacing:.02em}.jpb--feedback[data-status=success] .jpb__fill{background:linear-gradient(90deg,var(--jpb-success),#86efac)}.jpb--feedback[data-status=warning] .jpb__fill{background:linear-gradient(90deg,var(--jpb-warning),#fde68a)}.jpb--feedback[data-status=error] .jpb__fill{background:linear-gradient(90deg,var(--jpb-error),#fb7185)}.jpb--vertical{inline-size:var(--jpb-height);block-size:170px;justify-self:center}.jpb--vertical .jpb__fill{inset-block-start:auto;inline-size:100%;block-size:var(--jpb-percent)}.jpb--heart{--jpb-fill-start: #fb7185;--jpb-fill-end: #f472b6;height:18px;overflow:visible}.jpb--heart .jpb__marker{border:0;background:transparent;box-shadow:none}.jpb--heart .jpb__marker:before{content:"♥";color:var(--jpb-fill-end);font-size:1.65rem;filter:drop-shadow(0 8px 18px rgb(244 114 182 / .35))}.jpb--game{--jpb-height: 24px;--jpb-track: #2b2140;--jpb-fill-start: #facc15;--jpb-fill-end: #fb7185;border:4px solid #ffffff;box-shadow:var(--jpb-shadow)}.jpb--music{--jpb-height: 10px;--jpb-fill-start: #14b8a6;--jpb-fill-end: #06b6d4}.jpb--bubble{overflow:visible}.jpb--bubble .jpb__marker:after{content:attr(data-label);position:absolute;inset-block-end:1.65rem;inset-inline-start:50%;transform:translate(-50%);padding:.22rem .5rem;border-radius:.6rem;background:#0f172a;color:#fff;font-size:.72rem;font-weight:800}.jpb--capsule3d{--jpb-height: 26px;border:1px solid rgb(15 23 42 / .08);box-shadow:inset 0 3px 7px #ffffffe6,inset 0 -8px 18px #0f172a14,var(--jpb-shadow)}.jpb--capsule3d .jpb__fill{box-shadow:inset 0 2px 4px #ffffff8c,inset 0 -7px 12px #0f172a29}.jpb--lightsaber,.jpb--neon{--jpb-track: #0f172a;--jpb-fill-start: #22d3ee;--jpb-fill-end: #f472b6;box-shadow:0 0 0 1px #ffffff29,0 0 24px #22d3ee4d}.jpb--lightsaber .jpb__fill,.jpb--neon .jpb__fill{box-shadow:0 0 18px #f472b68c}.jpb--color-ball{--jpb-fill-start: #22c55e;--jpb-fill-end: #f97316;overflow:visible}.jpb--color-ball .jpb__marker{background:radial-gradient(circle at 35% 35%,#fff,#f97316 45%,#7c3aed);border:0}.jpb--player{--jpb-height: 8px;--jpb-fill-start: #ef4444;--jpb-fill-end: #f97316;overflow:visible}.jpb--helix{height:18px;background-image:repeating-linear-gradient(135deg,#dbeafe 0,#dbeafe 8px,#eff6ff 8px,#eff6ff 16px)}.jpb--helix .jpb__fill{background-image:repeating-linear-gradient(135deg,var(--jpb-fill-start) 0 8px,var(--jpb-fill-end) 8px 16px)}.jpb--thai-pattern{--jpb-fill-start: #c084fc;--jpb-fill-end: #f59e0b;border:1px solid rgb(192 132 252 / .35)}.jpb--thai-pattern .jpb__fill{background-image:radial-gradient(circle at 10px 50%,rgb(255 255 255 / .45) 0 3px,transparent 4px),linear-gradient(90deg,var(--jpb-fill-start),var(--jpb-fill-end));background-size:22px 100%,auto}.jpb--indeterminate .jpb__fill{width:40%;animation:jpb-indeterminate 1.2s infinite ease-in-out}.jpb-circle{--jpb-size: 120px;--jpb-percent: 0;display:inline-grid;place-items:center;position:relative;inline-size:var(--jpb-size);block-size:var(--jpb-size);color:var(--jpb-text);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.jpb-circle svg{inline-size:100%;block-size:100%;transform:rotate(-90deg)}.jpb-circle__track{fill:none;stroke:var(--jpb-track);stroke-width:10}.jpb-circle__value{fill:none;stroke:url(#jpb-circle-gradient);stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .28s ease}.jpb-circle--dashboard .jpb-circle__track{stroke-dasharray:4 6}.jpb-circle--neon .jpb-circle__value{filter:drop-shadow(0 0 8px rgb(34 211 238 / 70%))}.jpb-circle--watch .jpb-circle__track,.jpb-circle--watch .jpb-circle__value{stroke-width:8}.jpb-circle--indeterminate .jpb-circle__value{animation:jpb-spin 1.3s linear infinite;transform-origin:60px 60px}.jpb-circle__content{position:absolute;display:grid;place-items:center;gap:.1rem;text-align:center;font-weight:700}.jpb-circle__content span:last-child{color:var(--jpb-muted);font-size:.85rem}.jpb-steps{display:flex;align-items:center;gap:.5rem;color:var(--jpb-text);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.jpb-step{display:grid;place-items:center;min-width:2rem;height:2rem;padding-inline:.55rem;border-radius:999px;background:var(--jpb-track);color:var(--jpb-muted);font-size:.875rem;font-weight:800;white-space:nowrap}.jpb-step[data-state=complete]{background:var(--jpb-success);color:#fff}.jpb-step[data-state=current]{background:var(--jpb-fill-start);color:#fff;box-shadow:0 0 0 4px #4f7cff29}.jpb-steps--emoji .jpb-step,.jpb-steps--order .jpb-step{min-width:2.4rem}.jpb-step-line{flex:1;height:2px;min-width:2rem;background:var(--jpb-track)}.jpb-step-line[data-state=complete]{background:var(--jpb-success)}@keyframes jpb-shine{to{transform:translate(100%)}}@keyframes jpb-indeterminate{0%{inset-inline-start:-40%}to{inset-inline-start:100%}}@keyframes jpb-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.jpb *,.jpb__fill,.jpb-circle__value,.jpb-circle--indeterminate .jpb-circle__value{animation:none!important;transition:none!important}}*{box-sizing:border-box}:root{--paper: #f6f1e8;--panel: #fffefa;--ink: #181512;--muted: #6e675d;--line: #ded5c6;--blue: #2446ff;--green: #17745f;--orange: #c44b2b;--violet: #6a46b5;--shadow: 0 18px 50px rgb(24 21 18 / 10%)}body{margin:0;background:var(--paper);color:var(--ink);font-family:Aptos,Segoe UI,ui-sans-serif,system-ui,sans-serif}a{color:inherit}.page{width:min(1240px,calc(100% - 32px));margin:0 auto;padding:28px 0 44px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0 18px;font-size:.92rem;font-weight:800}.topbar div,.hero-actions,.doc-links,.section-actions,.source-actions,.tag-list,.tabs{display:flex;flex-wrap:wrap;gap:8px}.topbar a{text-decoration:none}.topbar div a,.brand{border:1px solid var(--line);border-radius:6px;padding:8px 10px;background:#fffefaad}.brand{color:var(--blue)}.hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);gap:18px;align-items:stretch}.hero-copy,.hero-panel,.toolbar,.proof-strip,.card,.empty-state{border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:var(--shadow)}.hero-copy{display:grid;align-content:center;padding:34px}.eyebrow{margin:0 0 10px;color:var(--orange);font-size:.8rem;font-weight:900;letter-spacing:0;text-transform:uppercase}.hero h1{margin:0;max-width:820px;font-family:Georgia,Cambria,Times New Roman,serif;font-size:4rem;line-height:1;letter-spacing:0}.hero p{max-width:720px;margin:16px 0 0;color:var(--muted);font-size:1.08rem;line-height:1.65}.hero-actions{margin-top:22px}.hero-actions code,.command-line{display:inline-flex;max-width:100%;overflow:auto;border:1px solid #201a14;border-radius:6px;background:#201a14;color:#fff8e8;padding:9px 11px;font-size:.82rem;font-weight:800}.hero-panel{display:grid;align-content:center;gap:20px;min-height:360px;padding:26px;background:linear-gradient(135deg,#fffefaf5,#f4ebdbeb),repeating-linear-gradient(90deg,rgb(24 21 18 / 8%) 0 1px,transparent 1px 24px)}.panel-head,.section-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.panel-head span,.panel-head strong,.proof-strip span,.toolbar label span,dt,.a11y strong{font-size:.78rem;font-weight:900;letter-spacing:0;text-transform:uppercase}.panel-head strong{color:var(--blue)}.proof-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;overflow:hidden;margin-top:16px;padding:0;background:var(--line)}.proof-strip div{display:grid;gap:4px;padding:18px;background:var(--panel)}.proof-strip strong{font-size:1.8rem;line-height:1}.proof-strip span{color:var(--muted)}.toolbar{display:grid;grid-template-columns:minmax(220px,1fr) 160px 160px 180px 150px;gap:12px;margin-top:16px;padding:14px;box-shadow:none}.toolbar label{display:grid;gap:7px;color:var(--muted)}.toolbar input,.toolbar select{width:100%;min-height:42px;border:1px solid var(--line);border-radius:6px;padding:8px 10px;background:#fff;color:var(--ink);font:700 .96rem Aptos,Segoe UI,ui-sans-serif,system-ui,sans-serif}.toolbar input[type=range]{accent-color:var(--green);padding-inline:0}.tabs{margin-top:16px}.tabs button,.copy,.section-actions a,.section-actions button,.empty-state button{min-height:38px;border:1px solid var(--line);border-radius:6px;padding:8px 11px;background:#fffefa;color:var(--ink);font-weight:900;cursor:pointer;text-decoration:none}.tabs button.is-active{border-color:var(--blue);background:var(--blue);color:#fff}.section-header{margin-top:16px;color:var(--muted);font-weight:800}.section-header p{margin:0}.section-header small{color:#8d8376}.section-actions a:nth-child(3n+1){color:var(--blue)}.section-actions a:nth-child(3n+2){color:var(--green)}.section-actions a:nth-child(3n+3){color:var(--orange)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(315px,1fr));gap:16px;margin-top:16px}.card{display:grid;gap:16px;min-height:400px;padding:18px;box-shadow:none}.card-link{color:inherit;text-decoration:none}.card-link:hover{color:var(--blue)}.card h2{margin:9px 0 6px;font-family:Georgia,Cambria,Times New Roman,serif;font-size:1.35rem;line-height:1.15;letter-spacing:0}.card p{margin:0;color:var(--muted);line-height:1.5}.card-meta{display:flex;flex-wrap:wrap;gap:6px}.tag,.tag-list li{display:inline-flex;width:fit-content;border:1px solid #c9ddff;border-radius:6px;background:#edf4ff;color:#173e9a;padding:4px 7px;font-size:.75rem;font-weight:900}.tag--muted{border-color:#d9d0c2;background:#f4ead9;color:#67543c}.tag--id{border-color:#badfcf;background:#e9f7ef;color:#176146}.preview{display:grid;min-height:150px;place-items:center;border:1px solid var(--line);border-radius:8px;padding:18px;background:linear-gradient(180deg,#fffefa,#f4ecdf),repeating-linear-gradient(0deg,rgb(24 21 18 / 7%) 0 1px,transparent 1px 18px)}.preview .jpb-field{width:100%}.tag-list{padding:0;margin:0}.tag-list li{list-style:none;border-color:var(--line);background:#fff8ec;color:var(--muted);font-size:.72rem}.details-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}.details-grid div,.a11y{border:1px solid var(--line);border-radius:8px;padding:10px;background:#fff9ef}dt,.a11y strong{color:var(--ink)}dd{margin:4px 0 0;color:var(--muted);font-size:.88rem}.a11y ul{margin:7px 0;padding-left:18px;color:var(--muted);font-size:.84rem}.a11y p{margin-top:6px;font-size:.88rem}summary{cursor:pointer;font-weight:900}.copy{margin:10px 0 0;border-color:#201a14;background:#201a14;color:#fff}.copy--muted{border-color:#d8c7ff;background:#f0e9ff;color:var(--violet)}.command-line{display:block;margin:8px 0 10px;border-color:var(--line);background:#fff8ec;color:var(--ink)}pre{max-height:310px;overflow:auto;margin:0;border-radius:8px;padding:14px;background:#201a14;color:#fff8e8;font-size:.78rem;line-height:1.55}.empty-state{margin-top:16px;padding:24px;text-align:center}.empty-state h2{margin:0 0 8px}@media(max-width:980px){.hero{grid-template-columns:1fr}.hero h1{font-size:3rem}.toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.page{width:min(100% - 20px,1240px);padding-top:16px}.topbar,.panel-head,.section-header{align-items:flex-start;flex-direction:column}.hero-copy,.hero-panel{padding:18px}.hero h1{font-size:2.25rem}.proof-strip,.toolbar,.details-grid{grid-template-columns:1fr}}