.xp-page{width:100%;max-width:560px;color:var(--ink);margin-inline:auto;padding:84px 20px 64px}.xp-h1{font-family:var(--font-display,inherit);letter-spacing:-.02em;margin:0 0 18px;font-size:clamp(26px,6.4vw,34px);font-weight:700;line-height:1.12}.xp{display:block}.xp-label{font-size:15.5px;font-weight:var(--fw-semibold);line-height:1.4;display:block}.xp-reassure{color:var(--ink-3);align-items:flex-start;gap:8px;margin:12px 0 0;font-size:12px;line-height:1.45;display:flex}.xp-reassure svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:14px;height:14px;margin-top:2px}.xp-login{color:var(--ink-2);text-align:center;margin:18px 0 0;font-size:14px}.xp-login a{font-weight:var(--fw-semibold);color:var(--info);margin-left:4px;text-decoration:none}.xp-login a:hover{text-underline-offset:3px;text-decoration:underline}.xp-kept{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--bg-elev);box-shadow:var(--shadow-card);margin:0 0 20px;padding:14px 16px}.xp-kept__label{font-size:12px;font-weight:var(--fw-semibold);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin:0 0 8px}.xp-kept__body{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font-size:16px;line-height:1.55}.xp-chip{border:1px solid var(--line);border-radius:var(--radius-pill);color:var(--ink-2);margin-top:10px;padding:3px 10px;font-size:12px;display:inline-flex}.xp-examples{gap:12px;margin:36px 0 0;padding:0;list-style:none;display:grid}.xp-example{border-radius:var(--radius-lg);background:var(--bg-soft);padding:14px 16px}.xp-example p{margin:0;font-size:15px;line-height:1.5}.xp-example span{color:var(--ink-3);margin-top:6px;font-size:12.5px;display:block}.xp-persp{--xp-persp-accent:var(--info);border-radius:var(--radius-lg);background:var(--bg-elev);box-shadow:inset 0 0 0 1px var(--line);margin:50px 0 0;padding:14px 14px 12px;transition:box-shadow .3s,opacity .3s}.xp-persp.is-ready{box-shadow:inset 0 0 0 1.5px var(--xp-persp-accent), 0 0 0 4px color-mix(in oklab, var(--xp-persp-accent) 12%, transparent);animation:.5s cubic-bezier(.2,.7,.2,1) xp-persp-arrive}@keyframes xp-persp-arrive{0%{opacity:.6;transform:translateY(6px)}to{opacity:1;transform:none}}.xp-persp__badge{border-radius:var(--radius-pill);background:color-mix(in oklab, var(--xp-persp-accent) 12%, transparent);color:var(--xp-persp-accent);font-size:11px;font-weight:var(--fw-semibold);vertical-align:2px;margin-left:8px;padding:2px 8px;display:inline-flex}.xp-persp.is-lit{box-shadow:inset 0 0 0 1px var(--xp-persp-accent), 0 0 0 3px color-mix(in oklab, var(--xp-persp-accent) 14%, transparent)}.xp-persp__title{font-size:14px;font-weight:var(--fw-semibold);margin:0 0 18px;line-height:1.35}.xp-persp__bar{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;height:44px;margin:0 6px;position:relative}.xp-persp__bar:before{content:"";background:var(--line);border-radius:2px;height:3px;position:absolute;top:50%;left:0;right:0;translate:0 -50%}.xp-pt{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;place-items:center;width:44px;height:44px;padding:0;transition:left .28s cubic-bezier(.2,.7,.2,1);display:grid;position:absolute;top:50%;translate:-50% -50%}.xp-pt__dot{background:var(--bg-elev);width:13px;height:13px;box-shadow:inset 0 0 0 1.6px var(--ink-3);border-radius:50%;transition:transform .22s cubic-bezier(.2,.7,.2,1),background .18s,box-shadow .18s}.xp-pt:hover .xp-pt__dot{box-shadow:inset 0 0 0 1.6px var(--ink-2)}.xp-pt.is-on .xp-pt__dot{background:var(--xp-persp-accent);box-shadow:none}.xp-pt.is-first .xp-pt__dot{transform:scale(1.42)}.xp-pt.is-drag{z-index:4;cursor:grabbing;transition:none}.xp-pt.is-drag .xp-pt__dot{transform:scale(1.5)}.xp-pt:focus-visible{outline:none}.xp-pt:focus-visible .xp-pt__dot{box-shadow:0 0 0 3px color-mix(in oklab, var(--xp-persp-accent) 35%, transparent)}.xp-pt__tip{white-space:nowrap;border-radius:var(--radius-pill);background:var(--ink);color:var(--bg-elev);opacity:0;pointer-events:none;padding:4px 9px;font-size:11.4px;transition:opacity .18s,transform .18s;position:absolute;bottom:34px;left:50%;transform:translateY(3px)}.xp-pt.is-live .xp-pt__tip,.xp-pt:hover .xp-pt__tip,.xp-pt:focus-visible .xp-pt__tip{opacity:1;transform:none}.xp-pt.tip-start .xp-pt__tip{left:-4px;translate:0}.xp-pt.tip-end .xp-pt__tip{left:auto;right:-4px;translate:0}.xp-pt.is-ghost{cursor:default}.xp-persp.is-off .xp-persp__bar{opacity:.55}.xp-persp.is-off .xp-pt__dot{box-shadow:inset 0 0 0 1.6px var(--line)}.xp-persp.is-loading .xp-pt.is-ghost .xp-pt__dot{animation:1.1s ease-in-out infinite xp-persp-pulse}.xp-persp.is-loading .xp-pt.is-ghost:nth-child(2) .xp-pt__dot{animation-delay:.15s}.xp-persp.is-loading .xp-pt.is-ghost:nth-child(3) .xp-pt__dot{animation-delay:.3s}.xp-persp.is-loading .xp-pt.is-ghost:nth-child(4) .xp-pt__dot{animation-delay:.45s}@keyframes xp-persp-pulse{0%,to{background:var(--bg-elev);transform:scale(1)}50%{background:color-mix(in oklab, var(--xp-persp-accent) 45%, transparent);transform:scale(1.35)}}@media (prefers-reduced-motion:reduce){.xp-pt,.xp-pt__dot,.xp-pt__tip{transition:none}.xp-persp.is-ready,.xp-persp.is-loading .xp-pt.is-ghost .xp-pt__dot{animation:none}}.xp-persp__line{min-height:2.9em;color:var(--ink-2);margin:10px 0 0;font-size:12.8px;line-height:1.45}.xp-persp__line strong{font-weight:var(--fw-semibold);color:var(--ink)}.xp-persp__hint{color:var(--ink-3);margin:6px 0 0;font-size:11.5px;line-height:1.4}.xp-readonly{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-soft);margin-top:10px;padding:14px 16px}.xp-readonly__head{justify-content:space-between;align-items:center;gap:12px;display:flex}.xp-readonly__label{font-size:12px;font-weight:var(--fw-semibold);color:var(--ink-3)}.xp-edit{font-size:13.5px;font-weight:var(--fw-semibold);color:var(--info);cursor:pointer;background:0 0;border:0;padding:4px 2px}.xp-edit:hover{text-underline-offset:3px;text-decoration:underline}.xp-edit:focus-visible{outline:2px solid var(--info);outline-offset:2px;border-radius:4px}.xp-readonly__body{color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0;font-size:16px;line-height:1.55}
