.page-custom .custom{display: grid;grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);gap: calc(72 * var(--u));align-items: start;padding-block: calc(96 * var(--u)) calc(150 * var(--u))}.custom__side{display: flex;flex-direction: column;gap: 32px;min-width: 0;padding-top: 8px}.custom .display{font-size: calc(120 * var(--u))}.custom .lead{max-width: 460px}.layers{display: flex;flex-direction: column;gap: 6px;max-width: 460px;margin: 8px 0 0;padding: 0;list-style: none}.layers:empty{display: none}.layer__btn{display: grid;grid-template-columns: 18px auto minmax(0, 1fr);align-items: center;gap: 12px;width: 100%;min-height: 50px;padding: 10px 18px 10px 14px;border-radius: 0 var(--corner) 0 0;background: color-mix(in srgb, var(--fg) 8%, transparent);color: var(--fg);font: 500 15px/1.3 var(--sans);text-align: left;transform-origin: 0 50%;transition: background-color .2s, color .2s}.layer__btn:hover{background: color-mix(in srgb, var(--accent) 22%, transparent)}.layer__btn:focus-visible{outline: 3px solid var(--accent);outline-offset: 2px}.layer__ico{width: 18px;height: 18px;color: var(--accent)}.layer__k{font-weight: 700}.layer__v{min-width: 0;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;opacity: .78;transition: opacity .2s}.layer.is-on .layer__btn{background: var(--accent);color: var(--on-accent)}.layer.is-on .layer__ico{color: currentColor}.layer.is-landing .layer__v{opacity: 0}.token{position: fixed;left: 0;top: 0;z-index: 62;padding: 9px 16px;border-radius: 0 var(--corner) 0 0;background: var(--accent);color: var(--on-accent);font: 600 15px/1.25 var(--sans);white-space: nowrap;pointer-events: none;transform-origin: 0 0;box-shadow: 0 0 0 2px var(--bg)}.form.wizard{position: relative;align-self: start;gap: 20px;margin-top: 8px;padding: calc(var(--c) + 48px) calc(var(--c) + 72px) calc(var(--c) + 40px) calc(var(--c) + 46px);background: none;color: var(--fg);border-radius: 0;--lw: 10px;--hs: 30px;--hb: 8px;--c: calc(var(--hs) / 2);--R: 140px}.form.wizard :focus-visible{outline-color: var(--accent)}.wizard .field input:focus, .wizard .field textarea:focus{outline: 3px solid var(--accent);outline-offset: 2px}.cframe{position: absolute;z-index: 1;inset: 0;pointer-events: none}.cframe__box{position: absolute;inset: calc(var(--c) - var(--lw) / 2);border: var(--lw) solid var(--accent);border-radius: 0 calc(var(--R) + var(--lw) / 2) 0 0}.cframe .h{position: absolute;width: var(--hs);height: var(--hs);translate: -50% -50%;background: var(--bg);border: var(--hb) solid var(--accent);pointer-events: auto;touch-action: none;transition: scale .45s var(--spring-snappy, var(--ease))}.cframe .h::after{content: '';position: absolute;inset: -14px}.cframe .h--tl{left: var(--c);top: var(--c)}.cframe .h--bl{left: var(--c);top: calc(100% - var(--c))}.cframe .h--br{left: calc(100% - var(--c));top: calc(100% - var(--c))}.cframe :is(.h--tr, .h--r, .h--o){left: calc(100% - var(--c) - var(--R) + var(--R) * sin(var(--a)));top: calc(var(--c) + var(--R) - var(--R) * cos(var(--a)))}.cframe .h--tr{--a: 5.74deg}.cframe .h--r{--a: 85.22deg}.cframe .h--o{--a: 48.37deg;border-radius: 50%}.cframe :is(.h--tl, .h--br){cursor: nwse-resize}.cframe :is(.h--tr, .h--bl){cursor: nesw-resize}.cframe .h--r{cursor: ew-resize}.cframe .h--o{cursor: grab}.cframe .h:hover, .cframe .h.is-held{scale: 1.2}.wizard:not(.is-live) .cframe .h{pointer-events: none}.cframe__size{position: absolute;left: 50%;top: calc(100% - var(--c) + var(--lw) / 2 + 10px);translate: -50% 0;padding: 4px 10px;border-radius: 6px;background: var(--accent);color: var(--on-accent);font: 600 12px/1.3 var(--sans);font-variant-numeric: tabular-nums;white-space: nowrap;opacity: 0;scale: .85;transition: opacity .2s, scale .4s var(--spring-snappy, var(--ease));pointer-events: none;z-index: 3}.cframe__size.is-on{opacity: 1;scale: 1}.wizard__step{position: relative;display: flex;flex-direction: column;gap: 16px;margin: 0;padding: 0;border: 0;min-width: 0}.wizard__q{padding: 0;font: 900 36px/1.12 var(--serif);letter-spacing: -0.01em}.wizard__hint{font-size: 15px;opacity: .8}.wizard .field label{color: var(--fg)}.chips{display: flex;flex-wrap: wrap;gap: 10px}.chip{position: relative;display: inline-flex;align-items: center;min-height: 48px;padding: 12px 18px;border: 1.5px solid var(--accent);border-radius: 0 var(--corner) 0 0;color: var(--fg);font: 600 15px/1.25 var(--sans);cursor: pointer;transition: background-color .2s, color .2s, translate .25s var(--spring-snappy, ease)}.chip input{position: absolute;opacity: 0;pointer-events: none}.chip:hover{translate: 0 -2px}.chip:has(input:checked){background: var(--accent);color: var(--on-accent)}.chip:has(input:focus-visible){outline: 3px solid var(--accent);outline-offset: 3px}.chip--example{border-style: dashed;font-weight: 500}.wizard__step.is-missing .chips:not(.chips--examples) .chip{border-color: #ff8a7a}.wizard__nav{display: flex;align-items: center;justify-content: flex-end;gap: 16px;margin-top: auto;padding-top: 12px}.wizard__back{margin-right: auto;font: 600 15px/1 var(--sans);text-decoration: underline;text-underline-offset: 4px;color: var(--fg)}.form.wizard .btn{width: 240px;min-width: 0;flex: none}.form.wizard .wizard__back[hidden] ~ .wizard__next{width: auto;flex: 1}.form.wizard .btn--submit, .form.wizard .wizard__next{background: var(--accent);color: var(--on-accent)}.wizard .form__status{color: var(--fg)}.wizard:not(.is-live) .wizard__back, .wizard:not(.is-live) .wizard__next{display: none}.wizard:not(.is-live) .wizard__step + .wizard__step{padding-top: 28px}.is-figma-cursor .custom, .is-figma-cursor .custom :not(input, textarea, select, .h){cursor: none}.is-figma-cursor .cursor-ring{visibility: hidden}.custom__smile{position: absolute;z-index: 4;height: auto;color: var(--accent);overflow: visible}.custom__smile path{stroke-dasharray: 1 1;stroke-dashoffset: 1}@media (max-width: 1023px){.page-custom .custom{grid-template-columns: minmax(0, 1fr);gap: 28px;padding-block: 48px 120px}.custom__side{gap: 20px;padding-top: 0}.custom .display{font-size: 58px}.layers{margin-top: 4px}.layer__btn{min-height: 44px;padding: 8px 14px 8px 12px;font-size: 14px}.form.wizard{margin-top: 0;padding: calc(var(--c) + 28px) calc(var(--c) + 30px) calc(var(--c) + 24px) calc(var(--c) + 20px);--lw: 6px;--hs: 20px;--hb: 5px;--R: 64px}.wizard__q{font-size: 26px;padding-right: 8px}.chip{min-height: 44px;padding: 10px 14px;font-size: 14px}.form.wizard .btn{width: auto;flex: 1}.token{padding: 8px 12px;font-size: 14px}}