:root{--body:'DM Sans',sans-serif;--display:'Bricolage Grotesque',sans-serif;--ink:#25251f;--blue:#2243ee;--paper:#f9f4e8}
*{box-sizing:border-box}body{margin:0;font:400 16px/1.5 var(--body);background:var(--paper);color:var(--ink);min-height:100svh}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
.logo{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:800;line-height:1}.skip{position:absolute;left:18px;top:-80px;padding:10px 16px;background:#fffdf8;color:var(--blue);z-index:10}.skip:focus{top:10px}
.plans-header{max-width:1100px;width:calc(100% - 80px);margin:0 auto;height:82px;border-bottom:1px solid #25251f18;display:flex;align-items:center;justify-content:space-between;gap:20px}
.plans-header .logo{font-size:32px;letter-spacing:-1.5px}.plans-header .logo svg{width:31px;height:33px}.plan-back{font-size:14px;color:#5c6056;display:flex;gap:9px;align-items:center}.plan-back:hover{color:var(--blue)}.plan-back span{font-size:21px}
.plans-main{width:calc(100% - 80px);max-width:1000px;margin:0 auto;padding:22px 0 36px}
.plans-heading{display:flex;align-items:center;justify-content:space-between;min-height:141px;padding-bottom:20px;gap:24px}.plans-eyebrow{font:700 12px/1.4 var(--body);letter-spacing:.1em;color:var(--blue);margin:0 0 9px}
.plans-heading h1{font:800 clamp(36px,4vw,48px)/1.07 var(--display);letter-spacing:-1.9px;margin:0 0 13px}.price-note{font-size:14px;color:#626759;margin:0}
.goose-welcome{position:relative;width:190px;height:127px;flex:none;margin-right:24px;pointer-events:none}.plan-goose{width:168px;height:175px;position:absolute;left:13px;top:-37px;transform-origin:50% 90%}.plan-goose .vision-hero-sprite{transform:scale(.7);transform-origin:top left}.goose-hello{position:absolute;bottom:-5px;left:0;width:100%;text-align:center;font-size:12px;color:#626759}.plan-goose.is-happy{animation:goose-happy .65s ease both}
@keyframes goose-happy{0%,100%{transform:translateY(0) rotate(0)}35%{transform:translateY(-9px) rotate(-3deg)}65%{transform:translateY(-2px) rotate(2deg)}}
.unlimited-banner{display:flex;align-items:center;justify-content:center;gap:18px;padding:15px 20px;margin:0 0 24px;background:#edf0ff;border:1px solid #2243ee25;border-radius:12px}.unlimited-symbol{font:600 54px/1 var(--display);color:var(--blue)}.unlimited-title{font:600 23px/1.25 var(--display);letter-spacing:-.45px;margin:0}.unlimited-title strong{font-weight:800;color:var(--blue)}.unlimited-note{font-size:12px;color:#545b77;margin:4px 0 0}
.plan-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:17px;padding:0;margin:0;border:0;min-width:0}
.plan-card{--plan-color:#f4d357;position:relative;border:1.5px solid var(--ink);border-radius:12px;background:var(--plan-color);box-shadow:3px 4px 0 var(--ink);transition:transform .18s,box-shadow .18s;min-width:0;overflow:visible}.plan-card:nth-of-type(2){--plan-color:#f5b7a1}.plan-card:nth-of-type(3){--plan-color:#c3cdf6}.plan-card:has(input:checked){box-shadow:5px 6px 0 var(--ink);transform:translate(-1px,-2px)}.plan-card:has(input:focus-visible){outline:3px solid var(--blue);outline-offset:6px}
.plan-badge-row{height:26px}.plan-badge{position:absolute;top:-20px;left:22px;z-index:2;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;font-size:12px;line-height:1.5;padding:11px 16px;font-weight:700;filter:drop-shadow(2px 3px 0 var(--ink));transform:rotate(-4deg)}.plan-badge:before,.plan-badge:after{content:'';position:absolute;pointer-events:none;clip-path:var(--sticker-shape)}.plan-badge:before{inset:0;background:var(--ink);z-index:-2}.plan-badge:after{inset:1.5px;background:var(--sticker-color);z-index:-1}.recommended-badge svg{width:15px;height:15px;fill:currentColor}.offer-badge{min-width:119px;transform:rotate(4deg);padding:10px 19px}.offer-badge strong{font-size:15px;letter-spacing:.035em}
.plan-pick{display:block;cursor:pointer;padding:11px 22px 19px}.plan-pick>input{position:absolute;opacity:0;width:1px;height:1px;top:54px;left:22px}.plan-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.plan-name{font:700 23px/1.3 var(--display);letter-spacing:-.5px}
.selection-mark{width:20px;height:20px;border:1.5px solid #909384;border-radius:50%;position:relative;background:#fffdf8;flex:none}.plan-pick input:checked~.plan-top .selection-mark{border-color:var(--blue);background:var(--blue)}.plan-pick input:checked~.plan-top .selection-mark:after{content:'';position:absolute;width:8px;height:4px;border-left:2px solid white;border-bottom:2px solid white;transform:rotate(-45deg);left:4px;top:5px}
.plan-price{display:flex;gap:8px;align-items:center;margin:17px 0 20px;min-height:48px}.plan-price>strong{font:700 43px/1 var(--display);letter-spacing:-1.8px;white-space:nowrap}.plan-price>span{font-size:13px;color:#656b5c;line-height:1.5}.plan-price del{display:block;font-size:14px;color:#656b5c}
.plan-credits{display:flex;flex-direction:column;padding:13px 17px 14px;background:#fffdf8;border:1px solid var(--ink);border-radius:8px;box-shadow:2px 2px 0 #25251f;color:var(--blue)}.credit-heading{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;line-height:1.4}.credit-heading svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5}.credit-amount{font:800 35px/1.15 var(--display);letter-spacing:-.8px;margin:3px 0}.credit-unit{font-size:12px;line-height:1.4;color:#555e98}
.plan-allowances{display:grid;gap:10px;margin-top:18px;font-size:14px}.plan-allowances>span{display:flex;align-items:center;justify-content:space-between;gap:8px}.plan-allowances>span>span{color:#626759}.plan-allowances strong{font-size:14px;font-weight:600;white-space:nowrap}.plan-allowances small{font-size:12px;font-weight:400;color:#6b7162}
.card-features{border-top:1px solid #25251f16;margin:0 22px}.card-features summary,.usage-details summary{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;list-style:none;font-size:14px;font-weight:600;min-height:51px}.card-features summary::-webkit-details-marker,.usage-details summary::-webkit-details-marker{display:none}summary svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;flex:none;transition:transform .2s}details[open]>summary svg{transform:rotate(180deg)}.card-features[open]>summary{color:var(--blue)}
.feature-content{padding:0 0 20px}.feature-content h2{font:700 12px/1.4 var(--body);text-transform:uppercase;letter-spacing:.06em;color:var(--blue);margin:20px 0 8px}.feature-content h2:first-child{margin-top:5px}.feature-content dl{margin:0}.feature-content dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #25251f10;font-size:13px;line-height:1.45}.feature-content dt{color:#5c6355;max-width:56%}.feature-content dd{margin:0;text-align:right;font-weight:600;white-space:nowrap}.feature-content small{display:block;font-size:11px;line-height:1.5;color:#747a6b;font-weight:400}.feature-note{font-size:12px;line-height:1.65;color:#6b7162;margin:18px 0 0}
.plan-next{text-align:center;margin-top:27px}.plan-continue{background:#f4d357;color:var(--ink);border:1px solid var(--ink);border-radius:8px;box-shadow:3px 4px 0 var(--ink);padding:14px 23px;font-size:15px;font-weight:700;min-width:260px;min-height:49px;display:inline-flex;gap:18px;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s}.plan-continue:hover{background:#f8db6e;transform:translateY(-2px);box-shadow:3px 6px 0 var(--ink)}.concept-note{font-size:12px;line-height:1.5;color:#68705e;margin:13px 0 0;min-height:18px}
.usage-details{margin-top:22px;border-top:1px solid #25251f15;padding-top:5px}.usage-details summary{width:max-content;margin:0 auto;font-size:13px;font-weight:500;color:#626759}.usage-copy{max-width:740px;margin:6px auto 0;font-size:14px;color:#626759;line-height:1.75}.usage-copy p{margin:0 0 15px}.usage-copy strong{color:var(--ink);font-weight:600}
.unlimited-banner{background:#fff7dd;border:1px solid var(--ink);border-radius:10px;box-shadow:2px 3px 0 var(--ink);margin-bottom:40px}.unlimited-note{color:#4b5044}
.recommended-badge{--sticker-color:#2243ee;--sticker-shape:polygon(6% 0,18% 8%,30% 0,42% 8%,54% 0,66% 8%,78% 0,90% 8%,97% 0,100% 23%,96% 50%,100% 77%,95% 100%,82% 92%,70% 100%,58% 92%,46% 100%,34% 92%,22% 100%,10% 92%,3% 100%,0 76%,4% 50%,0 24%);color:#fffdf8}.offer-badge{--sticker-color:#ff72ad;--sticker-shape:polygon(9% 0,91% 0,100% 18%,100% 35%,94% 50%,100% 65%,100% 82%,91% 100%,9% 100%,0 82%,0 65%,6% 50%,0 35%,0 18%);color:var(--ink)}
.selection-mark{width:22px;height:22px;border-color:var(--ink);box-shadow:1px 1px 0 var(--ink)}.plan-pick input:checked~.plan-top .selection-mark{border-color:var(--ink)}.plan-pick input:checked~.plan-top .selection-mark:after{width:12px;height:12px;left:50%;top:50%;border:0;transform:translate(-50%,-50%);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2.5 6 2.5 2.5 4.5-5' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.plan-price>span,.plan-price del,.plan-allowances>span>span,.plan-allowances small,.feature-content dt,.feature-content small,.feature-note{color:#4b5044}.plan-name{font-weight:800}
.card-features{border-top:1px solid #25251f70}.card-features[open]>summary,.feature-content h2{color:var(--ink)}.feature-content dl>div{border-bottom:1px solid #25251f25}.card-features summary:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.plan-continue{border-width:1.5px;box-shadow:3px 4px 0 var(--ink)}.plan-continue:active{transform:translate(2px,2px);box-shadow:1px 2px 0 var(--ink)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.plan-card:hover{transform:translate(-1px,-3px);box-shadow:5px 7px 0 var(--ink)}}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:960px){.plans-main,.plans-header{width:calc(100% - 48px)}.plan-options{gap:12px}.plan-pick{padding-left:17px;padding-right:17px}.plan-badge-row{padding-left:17px;padding-right:17px}.card-features{margin:0 17px}.plan-price>strong{font-size:36px}.plan-allowances,.plan-allowances strong{font-size:13px}.plan-badge{font-size:11px}.goose-welcome{margin-right:0}.feature-content dl>div{font-size:12px;gap:7px}}
@media(max-width:720px){.plans-header{height:76px;width:calc(100% - 36px)}.plans-header .logo{font-size:28px}.plans-header .logo svg{width:26px}.plan-back{font-size:12px;gap:5px}.plans-main{width:calc(100% - 36px);padding-top:21px}.plans-heading{min-height:125px;padding-bottom:18px;gap:0}.plans-heading h1{font-size:32px;max-width:220px;letter-spacing:-1.1px}.plans-eyebrow{font-size:12px}.price-note{font-size:12px}.goose-welcome{width:103px;height:120px}.plan-goose{transform:scale(.65);transform-origin:top left;left:-3px;top:-1px}.goose-hello{display:none}.unlimited-banner{justify-content:flex-start;gap:12px;padding:14px 17px;margin-bottom:19px}.unlimited-symbol{font-size:43px}.unlimited-title{font-size:20px;max-width:260px}.unlimited-note{font-size:12px;line-height:1.5;max-width:240px}.plan-options{grid-template-columns:1fr;gap:17px}.plan-badge-row{padding:14px 21px 0;height:40px}.plan-badge{font-size:12px}.plan-card:not(:has(.plan-badge)) .plan-badge-row{height:10px;padding:0}.plan-pick{padding:9px 21px 18px}.plan-name{font-size:23px}.plan-price{margin:10px 0 16px}.plan-price>strong{font-size:39px}.plan-credits{position:absolute;top:53px;right:21px;width:140px;padding:9px 11px}.credit-amount{font-size:27px}.credit-unit{font-size:11px}.plan-card:not(:has(.plan-badge)) .plan-credits{top:23px}.plan-top{padding-right:0}.selection-mark{position:absolute;top:18px;right:21px}.plan-card:not(:has(.plan-badge)) .selection-mark{top:14px;right:14px;width:16px;height:16px}.plan-allowances{margin-top:20px;font-size:14px;gap:9px}.plan-allowances strong{font-size:14px}.card-features{margin:0 21px}.feature-content dl>div{font-size:14px}.feature-content small{font-size:12px}.plan-continue{width:100%}.plan-goose.is-happy{animation:none}}
@media(max-width:720px){.unlimited-banner{margin-bottom:34px}.plan-options{gap:36px}.plan-badge-row{height:27px;padding:0}.plan-badge{left:20px}.plan-card:not(:has(.plan-badge)) .selection-mark{width:22px;height:22px}.plan-credits,.plan-card:not(:has(.plan-badge)) .plan-credits{position:static;width:auto;display:grid;grid-template-columns:1fr auto;column-gap:14px;padding:12px 15px}.credit-heading{grid-column:1;grid-row:1}.credit-unit{grid-column:1;grid-row:2;font-size:12px}.credit-amount{grid-column:2;grid-row:1 / 3;align-self:center;font-size:32px;margin:0}.plan-allowances{margin-top:17px}}
@media(max-width:380px){.plan-pick{padding-left:17px;padding-right:17px}.plan-price>strong{font-size:36px}.credit-amount{font-size:29px}.unlimited-title{font-size:18px}.plans-heading h1{font-size:29px}}
/* Reuse the mascot's pressed-washi material on the paper surfaces. */
body{background-image:url('./assets/washi-soft.webp');background-size:512px;background-blend-mode:multiply}
.plan-card{background-image:url('./assets/washi-soft.webp');background-size:384px;background-blend-mode:multiply;border-radius:4px 7px 5px 3px;box-shadow:3px 4px 0 var(--ink),inset 0 0 0 3px #ffffff18}
.plan-card:after{content:'';position:absolute;right:0;bottom:0;width:12px;height:12px;pointer-events:none;background:linear-gradient(135deg,transparent 47%,#25251f55 49%,#ffffff85 52%);border-radius:0 0 3px 0}
.plan-card:has(input:checked){box-shadow:5px 6px 0 var(--ink),inset 0 0 0 3px #ffffff18}
.plan-credits{background:#fffdf8;border-radius:4px 6px 3px 5px}
/* Keep the shared benefits calm; let the plan stickers provide the color. */
.unlimited-banner{position:relative;display:grid;grid-template-columns:210px 1fr;gap:26px;align-items:center;padding:22px 28px;margin:0 0 45px;background:#fffdf8 url('./assets/washi-soft.webp') repeat;background-size:512px;background-blend-mode:multiply;border:1px solid #25251f75;border-radius:3px;box-shadow:2px 3px 0 var(--ink)}
.unlimited-banner:before,.unlimited-banner:after{content:none}
.unlimited-heading{display:flex;gap:15px;align-items:center}.unlimited-symbol{font-size:57px;line-height:1}.unlimited-kicker{font-size:11px;font-weight:700;letter-spacing:.12em;color:#5c6256;margin:0 0 3px}.unlimited-title{font:800 31px/1.15 var(--display);letter-spacing:-.8px;color:var(--blue);margin:0}
.unlimited-benefits{border-left:1px dashed #a49b84;padding-left:26px;min-width:0}.unlimited-items{display:flex;justify-content:space-between;gap:20px;align-items:center}.unlimited-items>span{display:inline-flex;align-items:center;gap:10px;font:800 26px/1.2 var(--display);letter-spacing:-.5px}.unlimited-items svg{width:32px;height:32px;flex:none;stroke:var(--ink);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}.unlimited-note{font-size:12px;color:#626759;margin:10px 0 0}
.plan-badge-row{height:30px}.plan-badge{top:-24px;left:18px;min-height:48px;max-width:calc(100% - 36px);gap:8px;padding:10px 17px;border:0;border-radius:0;background:none;box-shadow:none;filter:drop-shadow(2px 3px 0 var(--ink));transform:none;font:700 16px/1.2 var(--body)}
.plan-badge:before,.plan-badge:after{display:block;content:'';position:absolute;pointer-events:none;clip-path:var(--sticker-shape);border:0;border-radius:0;width:auto;height:auto}.plan-badge:before{inset:0;background:var(--ink);z-index:-2}.plan-badge:after{inset:1.5px;background:var(--sticker-color);z-index:-1}
.recommended-badge{--sticker-color:#2243ee;--sticker-shape:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);color:#fffdf8}.recommended-badge .recommend-egg{width:24px;height:28px;flex:none}.recommend-copy{font-weight:700;letter-spacing:-.25px;white-space:nowrap}
.offer-badge{--sticker-color:#ff72ad;--sticker-shape:polygon(9% 0,91% 0,100% 18%,100% 35%,94% 50%,100% 65%,100% 82%,91% 100%,9% 100%,0 82%,0 65%,6% 50%,0 35%,0 18%);width:auto;height:auto;min-width:139px;padding:10px 20px;gap:6px;color:var(--ink)}.offer-badge strong{position:static;transform:none;font:800 25px/1 var(--display);letter-spacing:-.8px;color:inherit}.offer-badge>span{font:800 15px/1 var(--display);letter-spacing:.025em}
@media(max-width:1050px){.unlimited-banner{grid-template-columns:195px 1fr;padding:22px;gap:20px}.unlimited-benefits{padding-left:20px}.unlimited-items>span{font-size:24px;gap:8px}.unlimited-items svg{width:29px;height:29px}}
@media(max-width:960px){.unlimited-banner{grid-template-columns:1fr;gap:17px;padding:21px 24px}.unlimited-heading{justify-content:center}.unlimited-benefits{border-left:0;border-top:1px dashed #c3bbaa;padding:17px 0 0;text-align:center}.unlimited-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.unlimited-items>span{justify-content:center;flex-direction:column;gap:7px;font-size:25px}.unlimited-items svg{width:32px;height:32px}.unlimited-title{max-width:none}.unlimited-note{max-width:none;margin-top:14px}.plan-badge{left:12px;max-width:calc(100% - 24px);padding:9px 12px;font-size:14px;gap:7px}.recommended-badge .recommend-egg{width:22px;height:26px}.recommend-copy>span{display:block}.offer-badge{padding:10px 18px}}
@media(max-width:720px){.unlimited-banner{padding:19px 18px 17px;margin-bottom:41px}.unlimited-heading{gap:12px}.unlimited-symbol{font-size:49px}.unlimited-title{font-size:29px}.unlimited-kicker{font-size:10px}.unlimited-items>span{font-size:21px;letter-spacing:-.4px}.unlimited-items svg{width:30px;height:30px}.unlimited-note{font-size:12px}.plan-options{gap:36px}.plan-badge{left:18px;max-width:calc(100% - 36px);padding:10px 16px;font-size:15px;gap:8px}.recommend-copy>span{display:inline}.recommended-badge .recommend-egg{width:24px;height:28px}.offer-badge{padding:10px 20px}.plan-badge-row{height:30px}}
@media(max-width:380px){.unlimited-banner{padding-right:12px;padding-left:12px}.unlimited-items{gap:8px}.unlimited-items>span{font-size:18px;letter-spacing:-.5px}.unlimited-items svg{width:28px;height:28px}.plan-badge{font-size:14px;gap:6px;padding-left:12px;padding-right:12px}.offer-badge{padding-left:20px;padding-right:20px}}
@media(prefers-reduced-motion:reduce){.plan-goose.is-happy{animation:none}.plan-card,.plan-continue,summary svg{transition:none}}