/* Prompt for Agents: the banner's peeling corner, the prompt behind it, and the same over the docs, which have no banner. */
.i-robot{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.i-robot .eye{fill:currentColor;stroke:none}
.peel{position:absolute;top:0;right:0;z-index:3;display:block;padding:0;border:0;background:none;cursor:grab;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none}
.peel[hidden]{display:none}
.peel.pulling{cursor:grabbing}
.peel:focus-visible{outline:none}
.peel-under{position:absolute;inset:0;pointer-events:auto;color:#fff;clip-path:polygon(0 0,100% 0,100% 100%)}
.peel-under svg{position:absolute;top:6px;right:6px;width:22px;height:22px}
/* a wink shortly after the page loads, and on every hover or keyboard focus */
.rip-robot{position:absolute;top:6px;right:6px;z-index:4;width:22px;height:22px;color:#fff;pointer-events:none}
.rip-robot svg{display:block;width:100%;height:100%}
.peel .eye-r,.rip-robot .eye-r{transform-box:fill-box;transform-origin:center;animation:peel-wink .5s ease-in-out 2.5s}
.peel:focus-visible .eye-r,.peel:focus-visible~.rip-robot .eye-r{animation:peel-wink-again .5s ease-in-out}
@media(hover:hover){.peel:hover .eye-r,.peel:hover~.rip-robot .eye-r{animation:peel-wink-again .5s ease-in-out}}
@keyframes peel-wink{0%,100%{transform:none}35%,65%{transform:scaleY(.12)}}
@keyframes peel-wink-again{0%,100%{transform:none}35%,65%{transform:scaleY(.12)}}
@media(prefers-reduced-motion:reduce){.peel .eye-r,.rip-robot .eye-r,.peel:hover .eye-r,.peel:hover~.rip-robot .eye-r,.peel:focus-visible .eye-r,.peel:focus-visible~.rip-robot .eye-r{animation:none}}
.peel-hit{position:absolute;inset:0;pointer-events:auto;clip-path:polygon(0 0,100% 100%,0 100%)}
.peel-label{position:absolute;top:calc(100% + 8px);right:12px;padding:5px 10px;border-radius:7px;background:#0b0f1a;color:#e6edf3;font:600 12.5px Inter,system-ui,-apple-system,"Segoe UI",sans-serif;white-space:nowrap;box-shadow:0 8px 20px -8px rgba(0,0,0,.6);opacity:0;transition:opacity .12s;pointer-events:none}
.peel:focus-visible .peel-label{opacity:1}
@media(hover:hover){.peel:hover .peel-label{opacity:1}}
.peel.pulling .peel-label{opacity:0}
/* the fold, drawn by agent.js; --crease is how far the crease is from the corner */
.rip-flap{position:absolute;inset:0;z-index:2;pointer-events:none;filter:drop-shadow(-3px 4px 7px rgba(0,0,0,.55))}
.rip-flap i{position:absolute;inset:0;background:linear-gradient(225deg,#59637a var(--crease),#c6cedb calc(var(--crease) + 12px),#8c96aa calc(var(--crease) + 44px),#59637a calc(var(--crease) + 70px))}
/* behind the banner */
.rip-back{position:absolute;inset:0;background:linear-gradient(225deg,#ea580c,#f97316 35%,#fb923c);color:#1c0d03}
/* Open, the panel lifts above the clipped banner: fast scrolling doesn't respect the clip, so behind it the wheel would scroll the page. */
.banner.is-open .rip-in{z-index:1}
.banner.is-open .banner-front{cursor:pointer}
.rip-in{position:absolute;display:flex;flex-direction:column;gap:10px}
.rip-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;flex:none}
.rip-bar h2{white-space:nowrap;color:#1c0d03;font-size:16px;font-weight:600;letter-spacing:-.01em;margin:0}
.rip-bar button{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border:0;border-radius:7px;background:#0b0f1a;color:#e6edf3;font:600 13px Inter,system-ui,-apple-system,"Segoe UI",sans-serif;cursor:pointer}
.rip-bar button:hover:not(:disabled){background:#1f2433;color:#fff}
.rip-bar button:disabled{opacity:.5;cursor:default}
.rip-bar button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rip-copy .i-done,.rip-copy.done .i-copy{display:none}.rip-copy.done .i-done{display:block}.rip-copy.done{color:#7ee2b8}
.rip-close:not(:focus-visible){position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.rip-back pre{flex:1;min-height:0;margin:0;padding:14px 16px;overflow:auto;overscroll-behavior:contain;background:#151821;border:1px solid #1f2535;border-radius:10px;font:12.5px/1.6 'DM Mono',ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere;scrollbar-color:#2d3243 transparent}
.rip-back pre:focus-visible{outline:2px solid #fff;outline-offset:-2px}
.rip-back pre{color:#c9d1d9}
.rip-about{flex:none;margin:0;font-size:13px;line-height:1.4;font-weight:500;color:#1c0d03}
.rip-works{flex:none;display:flex;align-items:center;gap:12px;font-size:12px;font-weight:600;color:#1c0d03}
.rip-works span{margin-right:2px;white-space:nowrap}
.rip-works svg{width:18px;height:18px;flex:none;fill:currentColor}
@media(max-width:600px){.peel-under svg{top:4px;right:4px;width:16px;height:16px}.rip-robot{top:4px;right:4px;width:16px;height:16px}.rip-bar h2{font-size:15px}.rip-bar button{padding:0 8px}}
/* a page without a banner: the window's corner peels, in pale paper */
.peel-page{position:fixed;inset:0;z-index:55;overflow:hidden;pointer-events:none}
.peel-page .rip-back{pointer-events:auto}
.peel-page .rip-flap{filter:drop-shadow(-2px 3px 4px rgba(15,23,42,.4))}
.peel-page .rip-flap i{background:linear-gradient(225deg,#8f99aa var(--crease),#f8f9fc calc(var(--crease) + 12px),#dde2ea calc(var(--crease) + 44px),#c3cad6 calc(var(--crease) + 70px))}