:root{--paper:#f9f5ed;--ink:#172b45;--muted:#657184;--line:#ded8cd;--orange:#bd4428;--mint:#bce0d0;--navy:#172b45}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);margin:0;font:16px/1.5 Arial,PingFang SC,Microsoft YaHei,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,pre:focus-visible{outline:3px solid var(--orange);outline-offset:3px}.wrap{width:min(1160px,100% - 48px);margin:auto}.site-header{justify-content:space-between;align-items:center;gap:28px;width:min(1160px,100% - 48px);min-height:76px;margin:auto;display:flex}.brand{letter-spacing:-.04em;white-space:nowrap;font-size:19px;font-weight:800}.brand span{background:var(--orange);color:#fff;border-radius:50%;place-items:center;width:30px;height:30px;margin-right:7px;font-size:12px;display:inline-grid}.site-header nav{gap:22px;font-size:14px;font-weight:700;display:flex}.site-header nav a:hover,.text-link:hover{color:var(--orange)}.site-footer{border-top:1px solid var(--line);color:var(--muted);justify-content:space-between;gap:20px;margin-top:80px;padding:26px max(24px,50% - 580px);font-size:13px;display:flex}.site-footer p{margin:0}.site-footer nav{color:var(--ink);flex-wrap:wrap;gap:14px;margin-top:8px;font-weight:700;display:flex}.site-footer nav a:hover{color:var(--orange)}.hero{grid-template-columns:1.08fr .92fr;align-items:center;gap:64px;min-height:590px;padding-block:62px;display:grid}.eyebrow{color:var(--orange);letter-spacing:.15em;margin:0 0 12px;font-size:11px;font-weight:800}.hero h1,.page h1{letter-spacing:-.07em;margin:0 0 24px;font-size:clamp(42px,6.5vw,76px);line-height:.98}.hero h1 em{color:var(--orange);font-family:Georgia,serif;font-weight:400}.hero__copy>p:not(.eyebrow),.lede{max-width:620px;color:var(--muted);margin:0;font-size:17px}.actions{align-items:center;gap:24px;margin-top:30px;display:flex}.button{border:1px solid var(--navy);background:var(--navy);color:#fff;border-radius:99px;justify-content:center;align-items:center;padding:13px 20px;font-size:14px;font-weight:800;transition:all .2s;display:inline-flex}.button:hover{background:#28486b;transform:translateY(-2px)}.text-link{font-size:14px;font-weight:800}.hero__tickets{align-content:center;gap:16px;min-height:390px;display:grid;position:relative;transform:rotate(-3deg)}.hero__tickets .ticket:nth-child(2){justify-self:end;width:75%;transform:translateY(-10px)rotate(7deg)}.section{padding-top:70px}.section-heading{justify-content:space-between;align-items:end;gap:20px;margin-bottom:26px;display:flex}.section-heading h2,.studio-callout h2,.code-panel h2{letter-spacing:-.05em;margin:0;font-size:34px;line-height:1.04}.ticket-grid{grid-template-columns:repeat(3,1fr);gap:19px;display:grid}.ticket-grid--all{margin-top:28px}.ticket-link{transition:transform .2s;display:block}.ticket-link:hover{transform:translateY(-5px)}.ticket{--ticket-bg:#f5d8cc;--ticket-ink:#172b45;--ticket-accent:#e56a49;background:var(--ticket-bg);min-height:208px;color:var(--ticket-ink);border-radius:22px;padding:20px 22px 17px;position:relative;overflow:hidden;box-shadow:0 8px #172b4514}.ticket:before,.ticket:after{content:"";background:var(--paper);border-radius:50%;width:22px;height:22px;position:absolute;top:51%;transform:translateY(-50%)}.ticket:before{left:-11px}.ticket:after{right:-11px}.ticket__topline,.ticket__foot{letter-spacing:.05em;justify-content:space-between;gap:8px;font-size:10px;font-weight:800;display:flex}.ticket__main{border-bottom:1px dashed #172b4559;justify-content:space-between;align-items:end;gap:14px;padding:22px 0 15px;display:flex}.ticket__subtitle{margin:0 0 4px;font-size:11px;font-weight:700}.ticket h3{letter-spacing:-.05em;margin:0;font-size:21px;line-height:1.1}.ticket__condition{margin:8px 0 0;font-size:11px}.ticket__value{text-align:right;white-space:nowrap;flex-direction:column;align-items:end;display:flex}.ticket__value strong{color:var(--ticket-accent);letter-spacing:-.08em;font-size:44px;line-height:.8}.ticket__value span{margin-top:4px;font-size:11px;font-weight:800}.ticket__foot{color:#172b45b3;padding-top:12px}.ticket--compact{transform-origin:100%;min-height:160px;transform:scale(.92)}.ticket--compact .ticket__main{padding:15px 0 11px}.ticket--compact .ticket__value strong{font-size:34px}.ticket--divider .ticket__main{border-bottom-style:dotted;border-bottom-width:2px}.ticket--corners{clip-path:polygon(16px 0,calc(100% - 16px) 0,100% 16px,100% calc(100% - 16px),calc(100% - 16px) 100%,16px 100%,0 calc(100% - 16px),0 16px)}.ticket--corners:before,.ticket--corners:after,.ticket--scallop:before,.ticket--scallop:after{display:none}.ticket--scallop{border-inline:9px dotted var(--paper)}.ticket--combo{clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}.category-grid{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.category-card{border:1px solid var(--line);border-radius:16px;flex-direction:column;min-height:216px;padding:22px;transition:all .2s;display:flex}.category-card:hover{background:#fff;transform:translateY(-3px)}.category-card>span{background:var(--mint);border-radius:50%;place-items:center;width:35px;height:35px;font-weight:800;display:grid}.category-card h3{margin:20px 0 7px;font-size:19px}.category-card p{color:var(--muted);margin:0;font-size:13px}.category-card b{margin-top:auto;padding-top:20px;font-size:12px}.studio-callout{background:var(--navy);color:#fff;border-radius:26px;grid-template-columns:1fr .8fr;align-items:center;gap:50px;margin-top:70px;padding:46px;display:grid}.studio-callout p:not(.eyebrow){color:#c8d4df;max-width:470px}.button--light{color:var(--navy);background:#fff;border-color:#fff;margin-top:13px}.studio-callout pre{color:#bce0d0;background:#0e1e33;border-radius:15px;margin:0;padding:25px;line-height:1.8;overflow:auto}.page{padding-top:64px}.page>.lede{margin-bottom:28px}.chip-nav{border-bottom:1px solid var(--line);flex-wrap:wrap;gap:9px;padding-bottom:23px;display:flex}.chip-nav a{border:1px solid var(--line);border-radius:99px;padding:7px 12px;font-size:13px;font-weight:700}.chip-nav a:hover{border-color:var(--orange);color:var(--orange)}.breadcrumbs{color:var(--muted);gap:9px;margin-bottom:24px;font-size:13px;display:flex}.detail__grid{grid-template-columns:.92fr 1.08fr;align-items:center;gap:72px;display:grid}.detail__grid>.ticket{transform:scale(1.05)}.detail h1{font-size:52px}.coupon-facts{border-top:1px solid var(--line);grid-template-columns:1fr 1fr;margin:30px 0;display:grid}.coupon-facts div{border-bottom:1px solid var(--line);padding:13px 0}.coupon-facts dt{color:var(--muted);font-size:11px}.coupon-facts dd{margin:3px 0 0;font-size:14px;font-weight:700}.guide{max-width:800px}.guide ol{gap:28px;margin:45px 0;padding:0;list-style:none;display:grid}.guide li{grid-template-columns:62px 1fr;gap:14px;display:grid}.guide li>span{color:var(--orange);padding-top:5px;font-size:13px;font-weight:800}.guide h2{margin:0 0 6px;font-size:25px}.guide li p{color:var(--muted);margin:0}.not-found{align-content:center;min-height:480px;display:grid}.playground__heading{justify-content:space-between;align-items:start;gap:25px;display:flex}.demo-note{border:1px solid var(--line);white-space:nowrap;border-radius:99px;padding:7px 10px;font-size:12px;font-weight:700}.playground__grid{grid-template-columns:1.18fr .82fr;gap:24px;margin-top:34px;display:grid}.preview-stage{background:#efe8db;border-radius:24px;place-items:center;padding:45px 30px;display:grid;overflow:hidden}.preview-ticket{width:min(100%,530px);height:326px;position:relative;overflow:hidden;box-shadow:0 16px 30px #172b4524}.preview-ticket--editor{-webkit-user-select:none;user-select:none}.ticket-layer{z-index:3;left:var(--x);top:var(--y);box-sizing:border-box;overflow-wrap:anywhere;cursor:grab;touch-action:none;position:absolute}.ticket-layer:hover,.ticket-layer:focus-visible{outline-offset:3px;background:color-mix(in srgb, currentColor 8%, transparent);outline:1px dashed}.ticket-layer:focus-visible{outline-style:solid}.ticket-layer:active{cursor:grabbing}.ticket-layer--topline,.ticket-layer--category{width:min(64%,calc(100% - var(--x)));letter-spacing:.08em;font-size:10px;font-weight:800;line-height:1.15}.ticket-layer--title{width:min(62%,calc(100% - var(--x)));letter-spacing:-.06em;font-size:30px;font-weight:800;line-height:1.05}.ticket-layer--condition{width:min(58%,calc(100% - var(--x)));font-size:13px;line-height:1.3}.ticket-layer--price{width:28%;color:var(--ticket-accent);letter-spacing:-.08em;text-align:right;overflow-wrap:anywhere;font-size:60px;font-weight:800;line-height:.8}.ticket-layer--price i{color:currentColor;letter-spacing:0;font-size:12px;font-style:normal;line-height:1.15;display:block}.ticket-layer--expiry,.ticket-layer--footer{width:min(46%,calc(100% - var(--x)));font-size:11px;font-weight:700;line-height:1.15}.preview-divider{z-index:2;opacity:.35;pointer-events:none;position:absolute}.preview-ticket[data-direction=vertical] .preview-divider{left:0;right:0;top:calc(50% + var(--offset));border-top:1px dashed}.preview-ticket[data-direction=horizontal] .preview-divider{top:0;bottom:0;left:calc(50% + var(--offset));border-left:1px dashed}.controls{border:1px solid var(--line);border-radius:18px;align-content:start;gap:15px;padding:22px;display:grid}.control{gap:7px;font-size:13px;font-weight:700;display:grid}.control span{justify-content:space-between;display:flex}.control output{color:var(--orange);font-variant-numeric:tabular-nums}.control input[type=range]{width:100%;accent-color:var(--orange)}.control input[type=text],.control select{border:1px solid var(--line);width:100%;color:var(--ink);font:inherit;background:#fff;border-radius:8px;padding:9px}.content-fields{border:1px solid var(--line);border-radius:10px;gap:11px;margin:0;padding:14px;display:grid}.content-fields legend{padding:0 5px;font-size:12px;font-weight:800}.color-row{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.control input[type=color]{border:1px solid var(--line);background:#fff;border-radius:8px;width:100%;height:38px;padding:3px}.secondary-button{border:1px solid var(--line);color:var(--ink);font:inherit;cursor:pointer;background:#fff;border-radius:8px;padding:10px 13px;font-weight:800}.secondary-button:hover{border-color:var(--orange);color:var(--orange)}.code-panel{color:#eff6f3;background:#13263e;border-radius:20px;grid-template-columns:1fr auto;gap:15px;margin-top:24px;padding:25px;display:grid}.code-panel h2{font-size:24px}.code-actions{flex-wrap:wrap;justify-content:end;gap:9px;display:flex}.copy-button{color:#fff;font:inherit;cursor:pointer;background:#213a57;border:1px solid #5c7087;border-radius:8px;align-self:start;padding:9px 13px;font-weight:800}.copy-button:disabled{cursor:wait;opacity:.7}.code-panel pre{white-space:pre;background:#0e1d30;border-radius:11px;grid-column:1/-1;margin:0;padding:18px;font-size:12px;line-height:1.65;overflow-x:auto}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (max-width:1000px){.hero,.detail__grid,.playground__grid,.studio-callout{grid-template-columns:1fr}.hero{min-height:auto}.hero__tickets{width:100%;max-width:620px;min-height:280px;margin:auto}.detail__grid>.ticket{max-width:560px;transform:none}.ticket-grid,.category-grid{grid-template-columns:repeat(2,1fr)}.preview-stage{min-height:420px}.preview-ticket{width:min(530px,100%)}.studio-callout pre{margin:0}}@media (max-width:640px){.wrap,.site-header{width:calc(100% - 32px)}.site-header{min-height:70px}.site-header nav{gap:12px;font-size:12px;overflow:auto}.site-header nav a:nth-child(2),.site-header nav a:nth-child(4){display:none}.brand{font-size:16px}.hero{gap:25px;padding-top:38px}.hero h1,.page h1{font-size:46px}.hero__tickets{min-height:245px}.ticket-grid,.category-grid{grid-template-columns:1fr}.section{padding-top:50px}.site-footer{padding:24px 16px;display:block}.site-footer p+p{margin-top:8px}.section-heading{flex-direction:column;align-items:start}.studio-callout{margin-top:50px;padding:29px 24px}.detail__grid{gap:38px}.coupon-facts{grid-template-columns:1fr}.playground__heading{display:block}.demo-note{margin-top:14px;display:inline-block}.preview-stage{min-height:350px;padding:25px 14px}.preview-ticket{height:290px}.ticket-layer--title{font-size:24px}.ticket-layer--price{font-size:45px}.controls{padding:18px}.code-panel{grid-template-columns:1fr;padding:20px}.code-actions{justify-content:start}.copy-button{justify-self:start}.guide li{grid-template-columns:45px 1fr}}
