.intro-screen{position:absolute;z-index:4000;inset:0;color:var(--guestbook-intro-text);transition:opacity var(--intro-dismiss-duration, .48s)}.intro-screen:before{content:"";position:absolute;z-index:-1;inset:-2px;background:var(--guestbook-intro-loading-gradient) 2px 2px / calc(100% - 4px) calc(100% - 4px) no-repeat,var(--guestbook-intro-background);pointer-events:none}.intro-screen.is-dismissed{opacity:0;pointer-events:none}.intro-wedding-date{position:absolute;z-index:2;top:calc(var(--guestbook-intro-logo-top) + env(safe-area-inset-top,0px));left:0;right:0;margin:0;color:var(--guestbook-color-text);font-family:var(--guestbook-intro-label-font);font-size:var(--guestbook-intro-date-size);font-weight:400;line-height:1;letter-spacing:.08em;text-align:center;pointer-events:none}.intro-heart{position:absolute;z-index:1;left:var(--intro-heart-x, 50%);top:var(--intro-heart-y, 48%);width:calc(11px * var(--intro-heart-px, 3));line-height:0;transform:translate(-50%,-50%);pointer-events:none;animation:intro-entry-appear var(--intro-title-fade-duration, .7s) linear both}.intro-heart[hidden]{display:none}.intro-heart svg{display:block;width:100%;height:auto}.intro-brand-lockup{position:absolute;z-index:2;bottom:calc(48px + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;width:max-content;max-width:calc(100% - var(--guestbook-intro-controls-inset) * 2);pointer-events:none}.intro-brand-lockup[hidden]{display:none}.intro-brand-logo{display:block;flex:0 0 auto;width:var(--guestbook-intro-logo-width);line-height:0}.intro-brand-logo svg{display:block;width:100%;height:auto}.intro-canvas-host{position:absolute;z-index:0;inset:0;overflow:hidden}.intro-canvas-host canvas{display:block;width:100%;height:100%;image-rendering:auto}.intro-canvas-host .intro-heroes{position:absolute;inset:0;opacity:0;transition:opacity .35s linear;pointer-events:none}.intro-canvas-host .intro-heroes:is(.is-shown,.is-preview){opacity:1}.intro-character-loading{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}.intro-character-loading[hidden]{display:none}.intro-controls{position:absolute;z-index:2;bottom:calc(120px + env(safe-area-inset-bottom,0px));left:var(--guestbook-intro-controls-inset);right:var(--guestbook-intro-controls-inset);max-width:calc(100% - var(--guestbook-intro-controls-inset) * 2);text-align:center}.intro-controls:has(.intro-retry:not([hidden])){top:auto;bottom:calc(120px + env(safe-area-inset-bottom,0px))}.intro-entry-controls{position:absolute;z-index:2;left:var(--intro-controls-left, 50%);top:var(--intro-controls-top, 59%);transform:translate(-50%);width:min(calc(var(--intro-width, 300px) * var(--intro-frame-scale, 1)),calc(100% - var(--guestbook-intro-controls-inset) * 2));animation:intro-entry-appear var(--intro-title-fade-duration, .7s) linear both}.intro-entry-controls[hidden]{display:none}@keyframes intro-entry-appear{0%{opacity:0}to{opacity:1}}.intro-enter{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;min-height:max(44px,calc(var(--intro-height, 56px) * var(--intro-frame-scale, 1)));padding:max(6px,calc(var(--intro-padding-y, 12px) * var(--intro-frame-scale, 1))) max(8px,calc(var(--intro-padding-x, 18px) * var(--intro-frame-scale, 1)));gap:max(4px,calc(var(--intro-gap, 8px) * var(--intro-frame-scale, 1)));border:calc(var(--intro-border-width, 1px) * var(--intro-frame-scale, 1)) solid var(--guestbook-intro-button-border);border-radius:var(--guestbook-button-radius);background:var(--guestbook-intro-button-background);color:var(--guestbook-color-text);font-family:var(--guestbook-intro-label-font);font-size:max(var(--guestbook-font-size-caption),calc(var(--intro-font-size, var(--guestbook-font-size-input)) * var(--intro-frame-scale, 1)));font-weight:400;line-height:1;cursor:pointer;transition:var(--guestbook-button-transition)}.intro-enter:is(:hover,:focus-visible):not(:disabled){background:var(--guestbook-intro-button-hover);border-color:var(--guestbook-intro-button-hover-border)}.intro-enter:focus-visible{outline:none}.intro-enter:disabled{cursor:default}.intro-enter[aria-busy=true]{background:var(--guestbook-intro-button-loading);border-color:var(--guestbook-intro-button-loading-border)}.intro-enter>[hidden]{display:none}.intro-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);min-height:21px;margin:0 0 12px;color:#f5f1e8d1;font-family:var(--guestbook-font-family);font-size:var(--guestbook-font-size-input);line-height:1.5}.intro-controls:has(.intro-retry:not([hidden])) .intro-status,.intro-controls.is-unavailable .intro-status,.intro-controls:not(.is-ready):has(.intro-skip:not(:disabled)) .intro-status{position:static;width:auto;height:auto;overflow:visible;clip-path:none}.intro-controls.is-ready .intro-status{visibility:hidden}.intro-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(10px * var(--intro-frame-scale, 1));min-height:44px}.intro-skip,.intro-retry{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:min(112px,100%);min-height:max(44px,calc(var(--guestbook-button-height) * var(--intro-frame-scale, 1)));padding:max(6px,calc(14px * var(--intro-frame-scale, 1))) max(8px,calc(24px * var(--intro-frame-scale, 1)));border:1px solid transparent;border-radius:var(--guestbook-button-radius);font-family:var(--guestbook-intro-label-font);font-size:var(--guestbook-button-font-size);font-weight:400;line-height:1;cursor:pointer;transition:var(--guestbook-button-transition)}.intro-skip{position:absolute;bottom:calc(100% + 8px);right:0;box-shadow:none;background:transparent;color:var(--guestbook-intro-skip-text);flex:0 0 auto;width:auto;min-width:0;height:44px;min-height:44px;padding:0 8px;justify-content:center;border:0;border-radius:0;font-size:var(--guestbook-intro-skip-size);gap:8px;touch-action:manipulation;transition:color var(--intro-title-fade-duration, .7s) linear}.intro-skip.is-fading{opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--intro-title-fade-duration, .7s) linear,visibility 0s var(--intro-title-fade-duration, .7s)}.intro-skip-icon{font-family:var(--guestbook-font-emoji);font-size:var(--guestbook-font-size-input);line-height:1}.intro-skip-label{display:block;font-family:var(--guestbook-intro-label-font);line-height:1}.intro-skip-spinner{flex:0 0 16px;width:16px;height:16px;border:2px solid var(--guestbook-button-secondary-hover-border);border-top-color:var(--guestbook-color-text);border-radius:50%;animation:intro-button-spin var(--guestbook-spinner-duration) linear infinite}.intro-skip-spinner[hidden]{display:none}@keyframes intro-button-spin{to{transform:rotate(360deg)}}.intro-actions:has(.intro-retry:not([hidden])) .intro-skip{width:auto;min-height:max(44px,calc(var(--intro-height, 56px) * var(--intro-frame-scale, 1)));font-size:max(var(--guestbook-font-size-caption),calc(var(--intro-font-size, var(--guestbook-font-size-input)) * var(--intro-frame-scale, 1)))}.intro-retry{background:var(--guestbook-button-secondary-bg);border-color:var(--guestbook-button-secondary-border, var(--guestbook-button-secondary-border));color:var(--guestbook-button-secondary-text, var(--guestbook-color-text))}.intro-retry:is(:hover,:focus-visible){background:var(--guestbook-button-secondary-hover-bg, var(--guestbook-button-secondary-hover-bg));border-color:var(--guestbook-button-secondary-hover-border, var(--guestbook-button-secondary-hover-border))}.intro-skip:focus-visible,.intro-retry:focus-visible{outline:none}.intro-skip:hover:not(:disabled){color:var(--guestbook-intro-skip-text)}.intro-skip:disabled,.intro-skip:disabled:hover{cursor:default;transform:none}.intro-skip-icon[hidden],.intro-skip[hidden],.intro-retry[hidden]{display:none}.intro-accessibility{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.intro-skip .intro-skip-icon{display:none}.intro-skip .intro-skip-icon svg{width:100%;height:100%}.intro-skip-icon svg{display:block}.intro-skip-icon{font-size:calc(var(--intro-font-size, var(--guestbook-font-size-input)) * var(--intro-frame-scale, 1))}.intro-skip.is-loading{flex-direction:column;gap:calc(var(--intro-spinner-gap, 15px) * var(--intro-frame-scale, 1));font-size:max(var(--guestbook-font-size-caption),calc(var(--intro-font-size, var(--guestbook-font-size-input)) * var(--intro-frame-scale, 1)))}.intro-skip.is-loading,.intro-skip.is-loading:hover{color:var(--guestbook-intro-loading-text)}.intro-skip-spinner{flex:0 0 auto;box-sizing:border-box;width:calc(var(--intro-spinner-size, 20px) * var(--intro-frame-scale, 1));height:calc(var(--intro-spinner-size, 20px) * var(--intro-frame-scale, 1));border-width:calc(var(--intro-spinner-stroke, 2px) * var(--intro-frame-scale, 1))}.intro-tuner{position:fixed;right:12px;top:12px;z-index:10000;width:min(300px,calc(100vw - 24px));color:#eee;background:#242130;border:1px solid #655975;border-radius:12px;padding:12px;font:13px sans-serif;box-shadow:0 8px 24px #0006}.intro-tuner summary{cursor:pointer}.intro-tuner-body{max-height:65vh;overflow:auto;margin-top:12px}.intro-tuner label{display:grid;grid-template-columns:1fr 55px;gap:4px;margin:10px 0}.intro-tuner input{grid-column:1 / -1;width:100%;accent-color:#bc9ce4}.intro-tuner button,.intro-tuner select{background:#393145;color:#fff;border:1px solid #655975;border-radius:6px;padding:7px;margin:3px}.intro-tuner textarea{width:100%;box-sizing:border-box;height:90px;background:#17141f;color:#eee;font:11px monospace}.intro-tuner-preview{position:absolute;inset:0;z-index:4500;background:var(--guestbook-intro-background);pointer-events:none}.intro-loading-anchor{position:absolute;left:0;right:0;top:50%;transition:top .6s cubic-bezier(.2,.8,.2,1)}.intro-character-loading.is-instant .intro-loading-anchor{transition:none}.intro-character-loading.is-below .intro-loading-anchor{top:calc(var(--intro-controls-top, 59%) + max(22px,var(--intro-height, 56px) * var(--intro-frame-scale, 1) / 2))}.intro-loading-anchor .guestbook-entry-spinner{display:block;margin:calc(var(--guestbook-intro-spinner-size) / -2) auto 0}.intro-loading-anchor .entry-loading-message{top:calc(var(--guestbook-intro-spinner-size) / 2 + 20px)}
