:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#181716;background:#ece9e3;font-synthesis:none;--paper: #fffdf9;--paper-soft: #faf7f1;--line: #ded3c2;--line-strong: #c6ad82;--gold: #a67c34;--gold-dark: #78541d;--navy: #0d1b2a;--brown: #4c3924;--muted: #735f4a;--green: #3e6b4d;--green-bg: #edf5ef;--red: #9c3f37;--red-bg: #fbefed;--amber: #8d601c;--amber-bg: #fbf3e4;--shadow: 0 14px 38px rgba(55, 43, 27, .09);--radius: 7px}*{box-sizing:border-box}html{min-width:320px}body{margin:0;min-height:100vh}button,input,select,textarea{font:inherit}button,.button{border:1px solid var(--gold-dark);border-radius:6px;background:var(--gold);color:#fff;min-height:42px;padding:9px 16px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;transition:background .16s ease,border-color .16s ease,transform .16s ease}button:hover,.button:hover{background:#946d2d}button:active,.button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:not-allowed;transform:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #c69542;outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.button--danger{background:var(--red);border-color:var(--red)}.empty--error{border-color:#e6b7b1;background:var(--red-bg);gap:10px}.secondary{background:var(--paper);color:var(--gold-dark);border-color:var(--line-strong)}.secondary:hover{background:#f8f1e5}a.secondary{border:1px solid var(--line-strong);border-radius:6px;min-height:42px;padding:9px 16px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;transition:background .16s ease,border-color .16s ease,transform .16s ease}a.secondary:active{transform:translateY(1px)}.button--small{min-height:36px;padding:6px 12px}.icon-button{width:42px;min-width:42px;height:42px;padding:0;background:var(--paper);color:var(--brown);border-color:var(--line)}.icon-text{white-space:nowrap}.link-button{border:0;background:transparent;color:var(--gold-dark);box-shadow:none;min-height:36px}h1,h2,h3{font-family:Georgia,Times New Roman,serif;font-weight:400;letter-spacing:0;color:#111;margin:0}h1{font-size:34px;line-height:1.12}h2{font-size:21px}p{color:var(--muted);line-height:1.5}label{display:grid;gap:6px;color:var(--muted);font-size:13px}input,select,textarea{width:100%;min-height:42px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:#161310;padding:10px 12px}textarea{resize:vertical}select{cursor:pointer}.mono{font-family:SFMono-Regular,Consolas,monospace;font-size:.92em}.center-screen{min-height:100vh;display:grid;place-items:center}.brand{text-align:center;color:var(--gold)}.brand__name{font-family:Georgia,Times New Roman,serif;font-size:32px;letter-spacing:.025em;white-space:nowrap}.brand__sub{display:grid;grid-template-columns:minmax(32px,1fr) auto minmax(32px,1fr);align-items:center;gap:12px;color:var(--navy);letter-spacing:.22em;font-family:Georgia,Times New Roman,serif;font-size:14px}.brand__sub span{height:1px;background:#94a0aa}.brand--compact .brand__name{font-size:23px}.brand--compact .brand__sub{font-size:10px;gap:8px}.login-page{min-height:100vh;padding:32px 18px;display:grid;place-items:center;background:#eeece7}.login-card{width:min(100%,470px);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:34px 38px 30px}.login-title{text-align:center;margin:28px 0 24px}.login-title>span{color:var(--gold);display:inline-grid;place-items:center;margin-bottom:10px}.login-title--plain{margin:24px 0 26px}.login-title h1{font-size:40px}.login-title p{margin:8px 0 0}.login-card form{display:grid;gap:16px}.code-input{text-align:center;font-size:25px;letter-spacing:.24em}.demo-hint{margin-top:22px;padding-top:18px;border-top:1px solid var(--line);display:grid;gap:5px;color:var(--muted);font-size:12px;text-align:center}.app-shell{min-height:100vh;display:grid;grid-template-columns:228px 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"topbar topbar" "sidebar main" "sidebar footer"}.topbar{grid-area:topbar;position:sticky;top:0;z-index:30;display:grid;grid-template-columns:230px minmax(280px,720px) 1fr;gap:24px;align-items:center;background:#fffdf9fa;border-bottom:1px solid var(--line);padding:12px 26px}.demo-banner{margin:0 0 18px;padding:9px 12px;border:1px solid #c7d9ca;border-radius:6px;background:var(--green-bg);color:var(--green);font-size:12px}.mobile-overlay,.mobile-menu{display:none}.global-search{position:relative;display:flex;align-items:center;color:var(--muted)}.global-search>svg{position:absolute;left:13px;pointer-events:none}.global-search input{padding-left:40px;background:#fbf9f5}.search-results{position:absolute;top:calc(100% + 7px);left:0;right:0;max-height:460px;overflow:auto;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:7px;z-index:50}.search-results button{width:100%;min-height:0;display:grid;grid-template-columns:90px 1fr;justify-content:start;text-align:left;background:transparent;color:#171411;border:0;padding:10px 12px}.search-results button:hover{background:var(--paper-soft)}.search-results small{grid-column:2;color:var(--muted)}.search-type{color:var(--gold-dark);font-size:11px;text-transform:uppercase}.user-menu{display:flex;align-items:center;justify-content:flex-end;gap:16px;min-width:0}.user-menu>div{min-width:0;display:grid;text-align:right}.user-menu span{font-size:12px;color:var(--muted)}.password-field{position:relative;display:block}.password-field input{padding-right:50px}.password-field button{position:absolute;right:0;top:0;min-height:42px;height:42px}.demo-toggle{width:100%;margin-top:10px;font-size:12px}.demo-account{min-height:30px;padding:4px 0;display:flex;justify-content:space-between;background:transparent;color:var(--brown);border:0;border-radius:0;font-weight:500;text-align:left;box-shadow:none}.demo-account:hover{background:transparent;color:var(--gold-dark)}.demo-account code,.demo-hint code{font-size:11px}.sidebar{grid-area:sidebar;padding:24px 14px;background:var(--paper);border-right:1px solid var(--line)}.environment{margin:0 8px 22px;padding:9px 10px;display:flex;gap:8px;align-items:center;border:1px solid #bed1c2;border-radius:5px;background:var(--green-bg);color:var(--green);font-size:11px}.sidebar nav{margin-bottom:24px}.sidebar nav>p{margin:0 10px 8px;color:#9a8266;text-transform:uppercase;font-size:10px;font-weight:800;letter-spacing:.12em}.sidebar a{min-height:42px;display:flex;align-items:center;gap:11px;padding:9px 11px;margin:2px 0;border-radius:5px;text-decoration:none;color:#4d3b28;font-weight:650;font-size:14px}.sidebar a:hover{background:#f7f2e9}.sidebar a.active{background:#f2eadc;color:#17110b;box-shadow:inset 3px 0 0 var(--gold)}.main-content{grid-area:main;width:min(100%,1540px);padding:34px 38px 56px}.legal-footer{grid-area:footer;min-height:62px;display:flex;justify-content:center;align-items:center;gap:7px;font-size:11px;color:#a28d75;padding:18px}.legal-footer a{color:inherit;text-decoration:none}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:24px}.page-header p{margin:7px 0 0;max-width:760px}.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px;box-shadow:0 8px 26px #3f2f1c0a}.panel__head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:16px;border-bottom:1px solid #e9dfd1;margin-bottom:12px}.panel__head p{margin:4px 0 0;font-size:13px}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px;margin-bottom:22px}.kpi{background:var(--paper);border:1px solid var(--line);color:#171411;min-height:116px;display:grid;justify-items:start;align-content:center;gap:3px;padding:18px;box-shadow:none}.kpi:hover{background:#fbf7f0;border-color:var(--line-strong)}.kpi svg{color:var(--gold);margin-bottom:5px}.kpi strong{font-family:Georgia,serif;font-size:30px;font-weight:400}.kpi span{color:var(--muted);font-size:12px}.kpi.static{cursor:default}.compact-kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.task-list{display:grid}.task-list>button,.task-list>div{border:0;border-bottom:1px solid #eadfd0;border-radius:0;background:transparent;color:#171411;box-shadow:none;min-height:64px;width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;padding:11px 3px}.task-list>button:hover{background:#fbf8f2}.task-list span{display:grid;gap:4px}.task-list small{color:var(--muted)}.task-list.compact>div{min-height:56px}.filterbar{display:grid;grid-template-columns:minmax(240px,1fr) repeat(3,minmax(150px,210px));gap:10px;margin-bottom:14px}.customer-filterbar{grid-template-columns:minmax(260px,1.4fr) repeat(4,minmax(140px,.7fr)) auto;align-items:end}.customer-filterbar .secondary{white-space:nowrap}.demo-hint{margin:-4px 0 12px;color:var(--muted);font-size:12px}.customer-actions{position:relative;flex-wrap:nowrap}.action-menu{position:relative}.action-menu__list{position:absolute;z-index:10;right:0;top:calc(100% + 6px);display:grid;min-width:210px;padding:6px;border:1px solid var(--line);border-radius:6px;background:var(--paper);box-shadow:0 12px 30px #32230f1f}.action-menu__list button{border:0;background:transparent;color:var(--ink);text-align:left;padding:9px 10px;font:inherit;font-size:12px;font-weight:700;cursor:pointer}.action-menu__list button:hover{background:#f7f1e7}.action-menu__list .action-menu__danger{color:var(--red)}.customer-form{display:grid;gap:22px}.customer-form section{padding-top:18px;border-top:1px solid #e8ded0}.customer-form section:first-child{padding-top:0;border-top:0}.customer-form h3{margin:0 0 12px;font-size:18px}.customer-form h3 small,.customer-form small{color:var(--muted);font-size:12px;font-weight:400}.customer-privacy{background:#f8f4ec;border-radius:6px;padding:14px 16px}.customer-privacy p{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:0 0 6px}.field-error{display:block;margin-top:5px;color:var(--red)!important;font-size:11px!important}.customer-detail{display:grid;gap:12px}.customer-detail h3{margin:0}.customer-detail dl{display:grid;grid-template-columns:minmax(160px,.75fr) 1fr;gap:0;margin:0;border-top:1px solid #e8ded0}.customer-detail dt,.customer-detail dd{margin:0;padding:10px 0;border-bottom:1px solid #e8ded0}.customer-detail dt{color:var(--muted);font-size:12px}.customer-detail dd{font-weight:600}.support-filterbar{grid-template-columns:minmax(260px,1.45fr) repeat(5,minmax(130px,.72fr)) auto;align-items:end}.support-filterbar label:not(.search-field){display:grid;gap:5px;color:var(--muted);font-size:12px}.ticket-detail{display:grid;gap:18px}.ticket-detail__badges,.ticket-detail__links,.inline-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.ticket-detail__links{padding:12px;border:1px solid #e8ded0;border-radius:8px;justify-content:space-between;font-size:13px}.ticket-detail dl{display:grid;grid-template-columns:minmax(150px,.7fr) 1fr;gap:0;margin:0;border-top:1px solid #e8ded0}.ticket-detail dt,.ticket-detail dd{margin:0;padding:9px 0;border-bottom:1px solid #e8ded0}.ticket-detail dt{color:var(--muted);font-size:12px}.ticket-detail dd{font-weight:600}.ticket-request{padding:14px;border:1px solid #e8ded0;border-radius:8px;background:#fffdf9}.ticket-request h3{margin:0 0 6px}.ticket-request p{margin:0}.ticket-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.ticket-controls label,.ticket-compose label{display:grid;gap:6px;color:var(--muted);font-size:12px}.ticket-timeline{display:grid;gap:8px;max-height:270px;overflow:auto;padding-right:4px}.ticket-timeline article{border-left:2px solid #d8ad5c;padding:8px 12px;background:#fffdf9}.ticket-timeline article div{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.ticket-timeline article span{color:var(--muted);font-size:12px}.ticket-timeline article p{margin:6px 0 0}.ticket-compose{display:grid;gap:10px}.search-field{position:relative}.search-field svg{position:absolute;top:13px;left:13px}.search-field input{padding-left:39px}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);box-shadow:0 8px 28px #3628180a}table{width:100%;border-collapse:collapse;font-size:13px}th{position:sticky;top:0;z-index:1;background:#f7f1e7;color:#6e4f28;text-align:left;text-transform:uppercase;letter-spacing:.04em;font-size:10px;padding:13px 12px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:13px 12px;border-bottom:1px solid #e8ded0;vertical-align:top}tbody tr:hover{background:#fdf9f2}tbody tr:last-child td{border-bottom:0}td>span{color:var(--muted);font-size:11px}.badge{display:inline-flex;align-items:center;min-height:26px;padding:4px 8px;border-radius:999px;border:1px solid var(--line);background:#f5f2ed;color:#554a3d;font-size:10px;text-transform:uppercase;font-weight:800;white-space:nowrap}.badge--good{color:var(--green);background:var(--green-bg);border-color:#b8d0be}.badge--warn{color:var(--amber);background:var(--amber-bg);border-color:#e1c78f}.badge--danger{color:var(--red);background:var(--red-bg);border-color:#e4b4ae}.pagination{display:flex;justify-content:flex-end;align-items:center;gap:12px;color:var(--muted);font-size:12px;padding:14px 0}.pagination label{display:flex;align-items:center;gap:7px}.pagination select{min-height:36px;padding:5px 8px}.notice{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:6px;padding:11px 14px;margin:0 0 16px;background:#f7f3ed;color:#5e4d3c}.notice--success{background:var(--green-bg);border-color:#bdd2c2;color:var(--green)}.notice--error{background:var(--red-bg);border-color:#e3b8b2;color:var(--red)}.loading,.empty{min-height:160px;display:flex;gap:10px;align-items:center;justify-content:center;color:var(--muted);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius)}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;background:#14110d75;padding:20px}.modal{width:min(100%,660px);max-height:min(90vh,820px);overflow:auto;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 26px 70px #140f0a40;padding:24px}.modal__head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.modal form{display:grid;gap:15px}.modal-actions,.wizard-actions,.card-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:20px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.form-full,.review-full{grid-column:1 / -1}.wizard{width:min(100%,920px);margin:0 auto}.stepper{display:grid;grid-template-columns:auto minmax(30px,1fr) auto minmax(30px,1fr) auto;align-items:center;max-width:360px;margin:0 auto 28px}.stepper span{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;color:var(--muted)}.stepper span.active{background:var(--gold);color:#fff;border-color:var(--gold)}.stepper i{height:1px;background:var(--line)}.wizard-actions span{flex:1}.review-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 24px}.review-grid>div{display:grid;gap:4px;padding:14px 0;border-bottom:1px solid #eadfd0}.review-grid span{color:var(--muted);font-size:12px}.check-row{display:flex;grid-template-columns:auto 1fr;align-items:center}.check-row input{width:20px;min-height:20px}.success-card{margin:0 auto;max-width:620px;padding:38px;text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.one-time-secret{width:max-content;margin:18px auto;padding:14px 22px;font-family:monospace;font-size:22px;letter-spacing:.12em;background:var(--navy);color:#fff;border-radius:5px}.tabs{display:flex;gap:4px;overflow:auto;border-bottom:1px solid var(--line);margin-bottom:20px}.tabs button{border:0;border-radius:0;background:transparent;color:var(--muted);box-shadow:none;white-space:nowrap;padding:10px 13px}.tabs button.active{color:#21160b;box-shadow:inset 0 -2px 0 var(--gold)}.detail-columns{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);gap:18px}.detail-list{display:grid}.detail-list>div{min-height:52px;display:grid;grid-template-columns:minmax(130px,.65fr) 1fr;align-items:center;gap:20px;border-bottom:1px solid #eadfd0}.detail-list>div:last-child{border-bottom:0}.detail-list span:first-child{color:var(--muted);font-size:12px}.inline-actions{display:flex;align-items:center;gap:8px}.row-list{display:grid}.row-list>div{min-height:58px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:10px 2px;border-bottom:1px solid #eadfd0}.row-list>div:last-child{border-bottom:0}.row-list>div>span:first-child{display:grid;gap:4px}.row-list small{color:var(--muted)}.process-list>div{min-height:0;padding:8px 2px;gap:12px}.process-list>div>span:first-child{min-width:0}.process-list .badge{flex:0 0 auto}.timeline{display:grid;border-left:1px solid var(--line-strong);margin-left:6px}.timeline>div{position:relative;display:grid;gap:3px;padding:0 0 20px 22px}.timeline>div:before{content:"";position:absolute;left:-5px;top:4px;width:9px;height:9px;border-radius:50%;background:var(--gold)}.timeline time,.timeline span{color:var(--muted);font-size:11px}.production-grid,.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(320px,1fr));align-items:start;gap:16px}.production-card{display:grid;gap:14px;padding:20px}.production-card__head{align-items:start;margin:0}.production-card__head h2{margin-bottom:3px}.production-card__head p{margin:0}.production-card__process{display:grid;border-top:1px solid #eadfd0}.production-card__process>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid #eadfd0}.production-card__process>div>span:first-child{font-weight:700}.production-card__meta{display:grid;gap:5px;color:var(--muted);font-size:12px}.production-card__overdue{color:#a53d2d;font-weight:700}.production-card__actions{justify-content:space-between;margin-top:2px}.production-badge{display:inline-flex;width:max-content;align-items:center;min-height:25px;padding:4px 9px;border:1px solid transparent;border-radius:999px;font-size:11px;font-weight:800;line-height:1;white-space:nowrap}.production-badge--neutral{color:#655c51;background:#f2efe9;border-color:#ded7ca}.production-badge--gold{color:#875f1c;background:#fbf3e4;border-color:#e7c986}.production-badge--dark{color:#fff;background:var(--navy);border-color:var(--navy)}.production-badge--good{color:#2f6d48;background:#edf6ef;border-color:#b8d6c1}.production-badge--danger{color:#a53d2d;background:#fbeeee;border-color:#eab8b1}.eyebrow{display:block;margin-bottom:5px;color:var(--gold-dark);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:18px}.service-grid .panel{display:flex;justify-content:space-between;align-items:center;padding:16px}.system-section{margin-bottom:16px}.system-overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px}.compact-definition{display:grid;grid-template-columns:minmax(120px,.7fr) 1fr;gap:0;margin:12px 0 0;border-top:1px solid #e8ded0}.compact-definition dt,.compact-definition dd{margin:0;padding:9px 0;border-bottom:1px solid #e8ded0}.compact-definition dt{color:var(--muted);font-size:12px}.compact-definition dd{font-weight:600}.settings-section{min-height:0}.settings-grid pre{margin:14px 0 0;padding:12px;overflow:auto;background:#f4efe7;border-radius:5px;color:#463624;font-size:12px}@media(max-width:1100px){.app-shell{grid-template-columns:200px 1fr}.topbar{grid-template-columns:200px minmax(260px,1fr) auto;gap:14px}.main-content{padding:30px 24px 50px}.kpi-grid{grid-template-columns:repeat(2,1fr)}.detail-columns{grid-template-columns:1fr}.user-menu>div{display:none}.user-menu .icon-text{font-size:0;width:42px;padding:0}}@media(max-width:820px){.mobile-overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;border:0;border-radius:0;background:#12100d47;z-index:35}.app-shell{display:block;min-height:100vh}.topbar{position:sticky;display:grid;grid-template-columns:44px 1fr 44px;padding:10px 14px}.mobile-menu{display:inline-flex}.topbar .brand{grid-column:2;grid-row:1}.global-search{grid-column:1 / -1;grid-row:2;margin-top:8px}.user-menu{grid-column:3;grid-row:1}.sidebar{position:fixed;z-index:40;top:0;left:0;bottom:0;width:min(84vw,300px);transform:translate(-105%);transition:transform .18s ease;box-shadow:20px 0 50px #140f0a2e;overflow:auto;padding-top:78px}.sidebar--open{transform:translate(0)}.main-content{width:100%;padding:24px 16px 40px}.legal-footer{padding-bottom:28px}.page-header{align-items:flex-start}h1{font-size:30px}.filterbar{grid-template-columns:1fr 1fr}.filterbar>:first-child{grid-column:1 / -1}.support-filterbar{grid-template-columns:1fr 1fr}.support-filterbar>:first-child{grid-column:1 / -1}.customer-filterbar{grid-template-columns:1fr 1fr}.customer-filterbar>:first-child{grid-column:1 / -1}.production-grid,.settings-grid,.system-overview{grid-template-columns:1fr}.production-card__actions{align-items:stretch}.production-card__actions>*{flex:1;justify-content:center}}@media(max-width:640px){.brand--compact .brand__name{font-size:20px}.brand--compact .brand__sub{font-size:8px;letter-spacing:.16em}.login-page{padding:0;align-items:stretch}.login-card{min-height:100vh;padding:34px 20px;border:0;border-radius:0}.login-title{margin-top:34px}.login-title h1{font-size:35px}.page-header{display:grid;gap:14px}.page-header>:last-child:not(:first-child){justify-self:start}.kpi-grid{grid-template-columns:1fr 1fr;gap:8px}.kpi{min-height:102px;padding:14px}.panel{padding:18px 16px}.filterbar{grid-template-columns:1fr}.filterbar>:first-child{grid-column:auto}.support-filterbar{grid-template-columns:1fr}.support-filterbar>:first-child{grid-column:auto}.table-wrap{border:0;background:transparent;box-shadow:none;overflow:visible}table,thead,tbody,tr,th,td{display:block}thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}tbody{display:grid;gap:10px}tr{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:10px 14px}td{min-height:38px;display:grid;grid-template-columns:minmax(105px,.7fr) 1fr;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid #eee4d7}td:before{content:attr(data-label);color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:800}td:last-child{border-bottom:0}td .button--small{width:100%}.customer-actions{display:grid;grid-template-columns:1fr 1fr auto}.customer-actions .icon-button{min-width:40px}.customer-actions .button--small{min-width:0}.customer-detail dl{grid-template-columns:1fr;gap:0}.ticket-detail dl,.ticket-controls,.compact-definition{grid-template-columns:1fr}.compact-definition dt{padding-bottom:2px;border-bottom:0}.compact-definition dd{padding-top:2px}.ticket-detail dt{padding-bottom:2px;border-bottom:0}.ticket-detail dd{padding-top:2px}.ticket-detail__links,.ticket-timeline article div{align-items:flex-start;flex-direction:column;gap:4px}.customer-detail dt{padding-bottom:2px;border-bottom:0}.customer-detail dd{padding-top:2px}.pagination{justify-content:center;flex-wrap:wrap}.form-grid,.review-grid{grid-template-columns:1fr}.form-full,.review-full{grid-column:auto}.wizard{padding:18px 14px}.detail-list>div{grid-template-columns:110px 1fr;gap:12px}.tabs{margin-inline:-16px;padding-inline:16px}.modal-backdrop{padding:0;align-items:end}.modal{width:100%;max-height:94vh;border-radius:7px 7px 0 0;padding:20px 16px}.row-list>div{align-items:flex-start}.process-list>div{align-items:center}}.guest-shell{--guest-ink: #24211d;--guest-muted: #6f675d;--guest-paper: #fffdf9;--guest-canvas: #e9e6e0;--guest-line: #d7d0c5;--guest-gold: #8b6932;--guest-gold-dark: #684919;--guest-navy: #152737;--guest-red: #9c3f37;width:100%;min-height:100svh;margin:0;padding:20px max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));display:flex;flex-direction:column;background:var(--guest-paper);color:var(--guest-ink)}.guest-shell>header{min-height:82px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.guest-brand{max-width:min(100%,270px);color:var(--guest-gold);font-family:Georgia,Times New Roman,serif;font-size:20px;font-weight:700;letter-spacing:.18em;line-height:1;white-space:nowrap}.guest-brand span{margin-left:.05em;font-size:.44em;vertical-align:super}.guest-environment{min-height:28px;display:inline-flex;align-items:center;padding:5px 8px;border:1px solid #b8c9bc;border-radius:5px;background:#edf5ef;color:#315c3f;font-size:10px;font-weight:800;text-transform:uppercase}.guest-shell>footer{margin-top:auto;padding-top:24px;color:#8a8278;font-size:10px;line-height:1.5;text-align:center}.guest-status,.guest-preview{width:min(100%,410px);margin:auto;display:flex;flex-direction:column;align-items:center;text-align:center}.guest-status__icon{width:68px;height:68px;margin-bottom:24px;display:grid;place-items:center;border:1px solid #ccb98f;border-radius:50%;color:var(--guest-gold-dark);background:#faf5eb}.guest-status__icon svg{width:28px;height:28px}.guest-status h1,.guest-preview h1,.guest-capture h1{max-width:370px;font-family:Georgia,Times New Roman,serif;font-size:30px;line-height:1.15;font-weight:500;letter-spacing:0}.guest-status__copy{width:100%}.guest-status p,.guest-preview>p,.guest-capture__controls p{max-width:350px;margin:14px auto 0;color:var(--guest-muted);font-size:15px;line-height:1.55}.couple-overage{display:grid;grid-template-columns:1fr auto;gap:10px 20px;margin:28px 0;text-align:left}.couple-overage div{display:contents}.couple-overage dt{color:var(--guest-muted)}.couple-overage dd{margin:0;font-weight:700}.guest-actions{width:100%;margin-top:28px;display:grid;gap:10px}.guest-actions--row{grid-template-columns:1fr 1fr;margin:16px 0 10px}.guest-button{width:100%;min-height:54px;padding:12px 16px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid var(--guest-gold-dark);background:var(--guest-gold);color:#fff;font-size:14px;font-weight:750}.guest-button svg{width:19px;height:19px;flex:0 0 auto}.guest-button:hover{background:#775623}.guest-button:focus-visible{outline:3px solid #d5a84f;outline-offset:3px}.guest-button--secondary{border-color:#bfb5a6;background:var(--guest-paper);color:#3c3329}.guest-button--secondary:hover,.guest-button--quiet:hover{background:#f5f1e9}.guest-button--danger{border-color:var(--guest-red);background:var(--guest-red)}.guest-button--quiet{border-color:transparent;background:transparent;color:var(--guest-muted)}.guest-permission-list{margin:22px auto 0;display:flex;justify-content:center;gap:10px}.guest-permission-list span{min-height:42px;padding:8px 12px;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--guest-line);border-radius:6px;color:#4f463c;font-size:12px;font-weight:700}.guest-permission-list svg{width:17px;height:17px;color:var(--guest-gold)}.guest-shell--capture{padding:0;background:#090a0b}.guest-shell--capture>header,.guest-shell--capture>footer{display:none}.guest-capture{min-height:100svh;display:grid;grid-template-rows:minmax(0,1fr) auto;background:#090a0b;color:#fff}.guest-camera{min-height:0;position:relative;overflow:hidden;background:#111}.guest-camera video{width:100%;height:100%;min-height:52svh;display:block;object-fit:contain;transform:scaleX(-1)}.guest-countdown{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#00000047;color:#fff;font-family:Georgia,Times New Roman,serif;font-size:92px;font-weight:500}.guest-recording-status{position:absolute;top:max(16px,env(safe-area-inset-top));left:50%;transform:translate(-50%);min-width:92px;min-height:38px;padding:7px 12px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:6px;background:#080808c2;font-variant-numeric:tabular-nums}.guest-recording-status span{width:10px;height:10px;border-radius:50%;background:#e84d43}.guest-capture__controls{min-height:238px;padding:24px 20px max(22px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;background:#161718;text-align:center}.guest-capture__controls h1{color:#fff;font-size:25px}.guest-capture__controls p{margin:8px 0 18px;color:#c8c9c9}.guest-capture__controls .guest-button{width:min(100%,390px);margin-top:12px}.guest-preview{align-items:stretch}.guest-preview h1,.guest-preview>p{align-self:center}.guest-preview video{width:100%;max-height:52svh;margin-top:22px;border-radius:7px;background:#111}.guest-progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:10px;margin:24px 0 10px;overflow:hidden;border:0;border-radius:5px;background:#e6ded1}.guest-progress::-webkit-progress-bar{background:#e6ded1}.guest-progress::-webkit-progress-value{background:var(--guest-gold)}.guest-progress::-moz-progress-bar{background:var(--guest-gold)}.guest-reference{font-family:SFMono-Regular,Consolas,monospace;font-size:11px!important}.guest-spin{animation:guest-spin 1.1s linear infinite}@keyframes guest-spin{to{transform:rotate(360deg)}}@media(min-width:640px){body:has(.guest-shell){background:var(--guest-canvas);padding:24px}.guest-shell:not(.guest-shell--capture){width:min(100%,470px);min-height:min(760px,calc(100svh - 48px));margin:0 auto;border:1px solid var(--guest-line);border-radius:8px;box-shadow:0 22px 60px #221e1824}.guest-shell--capture{width:min(100%,470px);min-height:min(820px,calc(100svh - 48px));margin:0 auto;border-radius:8px;overflow:hidden;box-shadow:0 22px 60px #00000038}.guest-capture{min-height:min(820px,calc(100svh - 48px))}}@media(max-width:380px){.guest-brand{font-size:15px}.guest-actions--row{grid-template-columns:1fr}.guest-status h1,.guest-preview h1{font-size:27px}}.guest-shell--welcome{--guest-ink: #302419;--guest-muted: #706558;--guest-paper: #fffdf8;--guest-line: #ded2bd;--guest-gold: #a77931;--guest-gold-dark: #72511f;background:radial-gradient(ellipse at 86% 4%,rgba(238,211,156,.78),transparent 34%),radial-gradient(ellipse at 5% 94%,rgba(232,214,179,.68),transparent 35%),linear-gradient(140deg,#fffdf8,#f4eddf 58%,#ebe0cd)!important}.guest-shell--welcome:before,.guest-shell--welcome:after{display:none}.guest-shell--welcome .guest-brand{color:#9a702d;text-shadow:none}.guest-shell--welcome>footer{color:#8b806f}.guest-shell--welcome .guest-intro{max-width:390px;padding:44px 12px 18px}.guest-shell--welcome .guest-kicker{color:#9a7132}.guest-shell--welcome .guest-intro h1{max-width:340px;color:#302419;font-size:clamp(35px,8.6vw,45px);text-shadow:none}.guest-shell--welcome .guest-intro__lead{max-width:330px;margin:17px auto 0;color:#675c50;font-size:16px;line-height:1.58}.guest-shell--welcome .guest-choice-grid{margin-top:34px}.guest-shell--welcome .guest-choice{min-height:106px;grid-template-columns:30px 1fr;border-color:#b48a43;border-radius:12px;background:linear-gradient(135deg,#b18438,#8b6328);box-shadow:inset 0 1px #fff8e16b,0 16px 28px #5339112b;color:#fffaf0}.guest-shell--welcome .guest-choice:hover{transform:translateY(-1px);border-color:#875f21;background:linear-gradient(135deg,#bf9449,#8d6428)}.guest-shell--welcome .guest-choice>span{color:#fff4d7;text-shadow:none}.guest-shell--welcome .guest-choice small{color:#fff2d5}.guest-shell--welcome .guest-choice em{color:#fce5ab}.guest-text-choice{margin:7px auto 0;padding:10px 8px;border:0;background:transparent;color:#725a34;font:inherit;font-size:14px;text-decoration:underline;text-decoration-color:#725a3457;text-underline-offset:4px}.guest-text-choice span{margin-left:4px}.guest-shell--welcome .guest-intro__footer{margin-top:24px;color:#8a7c68}@media(min-width:640px){body:has(.guest-shell--welcome){background:#e5ddcf}.guest-shell--welcome{box-shadow:0 30px 72px #45301833!important}}@media(prefers-reduced-motion:reduce){.guest-spin{animation:none}}.guest-intro,.guest-anniversary,.guest-anniversary-list,.guest-seal-screen{width:min(100%,410px);margin:auto;text-align:center}.guest-intro h1,.guest-anniversary-list h1,.guest-seal-screen h1{margin:10px auto 12px;font-family:Georgia,Times New Roman,serif;font-size:clamp(29px,7.2vw,38px);font-weight:500;line-height:1.13}.guest-intro>p:not(.guest-kicker):not(.guest-intro__footer),.guest-anniversary-list>p,.guest-seal-screen>p{color:var(--guest-muted);line-height:1.55}.guest-kicker{margin:0;color:var(--guest-gold-dark);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.guest-choice-grid{display:grid;gap:12px;margin-top:32px}.guest-choice{min-height:122px;padding:17px 18px;border:1px solid var(--guest-line);border-radius:10px;display:grid;grid-template-columns:34px 1fr;column-gap:11px;text-align:left;background:#fffefa;color:var(--guest-ink)}.guest-choice>span{grid-row:span 3;color:var(--guest-gold);font-family:Georgia,serif;font-size:26px}.guest-choice strong{font-size:16px}.guest-choice small{margin-top:5px;color:var(--guest-muted);font-size:13px;line-height:1.35}.guest-choice em{margin-top:9px;color:#6d5727;font-size:10px;font-style:normal;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.guest-choice--primary{border-color:var(--guest-gold);box-shadow:inset 0 0 0 1px #8b693229;background:#fbf6eb}.guest-intro__footer{margin-top:34px;color:#8a8278;font-size:11px}.guest-back{margin:0 auto 18px;padding:8px 0;border:0;background:transparent;color:var(--guest-muted);font:inherit;font-size:13px}.guest-anniversary-card{position:relative;min-height:270px;overflow:hidden;border-radius:12px;background:#3a2a1c;box-shadow:0 14px 30px #3425122e}.guest-anniversary-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(transparent 35%,#120c07bd)}.guest-anniversary-card img{width:100%;height:270px;display:block;object-fit:cover}.guest-anniversary-card div{position:absolute;z-index:1;right:20px;bottom:20px;left:20px;color:#fffaf0;text-align:left}.guest-anniversary-card strong{display:block;font-family:Georgia,serif;font-size:28px;font-weight:500}.guest-anniversary-card span{display:block;margin-top:4px;color:#efe2bc;font-size:15px}.guest-ornament{width:132px;height:22px;margin:20px auto;display:grid;place-items:center}.guest-ornament:before,.guest-ornament:after{content:"";width:47px;height:1px;background:#cbb37d}.guest-ornament{grid-template-columns:1fr 15px 1fr;gap:9px}.guest-ornament span{width:9px;height:9px;border:1px solid #b38c45;transform:rotate(45deg)}.guest-consent{margin:0;display:flex;gap:11px;align-items:flex-start;text-align:left;color:#51483d;font-size:13px;line-height:1.45}.guest-consent input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--guest-gold);flex:0 0 auto}.guest-legal{margin:11px 0 19px;color:var(--guest-muted);font-size:11px}.guest-legal a,.guest-shell>footer a{color:inherit}.guest-anniversary-list{text-align:left}.guest-anniversary-list h1,.guest-anniversary-list>p{text-align:center}.guest-anniversary-list>div{display:grid;gap:8px;margin-top:20px}.guest-anniversary-option{min-height:64px;padding:0;border:1px solid var(--guest-line);border-radius:8px;display:grid;grid-template-columns:62px 1fr;overflow:hidden;text-align:left;background:#fffefa;color:var(--guest-ink)}.guest-anniversary-option img{width:62px;height:62px;object-fit:cover}.guest-anniversary-option span{padding:11px 13px}.guest-anniversary-option strong,.guest-anniversary-option small{display:block}.guest-anniversary-option small{margin-top:3px;color:var(--guest-muted)}.guest-seal-screen{display:flex;min-height:440px;flex-direction:column;align-items:center;justify-content:center}.guest-seal-screen>p{max-width:330px;margin:3px 0 28px}.guest-seal-screen>p strong,.guest-seal-screen>p span{display:block}.guest-seal-screen>p strong{margin-bottom:7px;color:var(--guest-ink);font-family:Georgia,serif;font-size:22px;font-weight:500}.guest-seal-screen .guest-button{width:100%}.guest-seal-mark{width:108px;height:108px;margin-bottom:28px;border:2px solid #9a7538;border-radius:50%;display:grid;place-items:center;color:#8b6932;box-shadow:inset 0 0 0 8px #fffdf9,inset 0 0 0 10px #d6c08e,0 0 28px #9a753829;font-family:Georgia,serif;font-size:43px}.guest-seal-mark--spinning{border-style:dashed;animation:guest-seal-spin 1.4s linear infinite}.guest-seal-mark--complete{background:#9a7538;color:#fff8e9}@keyframes guest-seal-spin{to{transform:rotate(360deg)}}@media(max-width:340px){.guest-choice{min-height:108px}.guest-anniversary-card,.guest-anniversary-card img{min-height:235px;height:235px}.guest-anniversary-card strong{font-size:24px}}.guest-shell:not(.guest-shell--capture){--guest-ink: #f8f0df;--guest-muted: #d8cbb6;--guest-paper: #20170f;--guest-line: rgba(234, 205, 143, .28);--guest-gold: #b78a3c;--guest-gold-dark: #f3d79a;position:relative;overflow:hidden;background:radial-gradient(ellipse at 12% 5%,rgba(191,139,53,.23),transparent 34%),radial-gradient(ellipse at 88% 81%,rgba(123,74,23,.28),transparent 36%),linear-gradient(145deg,#110c09,#26180f 52%,#120d0a)}.guest-shell:not(.guest-shell--capture):before,.guest-shell:not(.guest-shell--capture):after{content:"";position:absolute;z-index:0;width:250px;height:250px;border:1px solid rgba(232,200,130,.12);border-radius:50%;pointer-events:none}.guest-shell:not(.guest-shell--capture):before{top:-172px;right:-92px;box-shadow:0 0 0 26px #e8c88206,0 0 0 66px #e8c88205}.guest-shell:not(.guest-shell--capture):after{bottom:-178px;left:-118px;box-shadow:0 0 0 30px #e8c88206,0 0 0 70px #e8c88205}.guest-shell:not(.guest-shell--capture)>header,.guest-shell:not(.guest-shell--capture)>footer,.guest-shell:not(.guest-shell--capture)>section{position:relative;z-index:1}.guest-shell>header{min-height:66px;align-items:center}.guest-brand{color:#f1d69a;font-size:17px;letter-spacing:.22em;text-shadow:0 1px 14px rgba(233,185,81,.22)}.guest-shell>footer{color:#e8d8bca8;font-size:10px}.guest-shell>footer a{text-decoration-color:#e8d8bc54;text-underline-offset:3px}.guest-intro{padding:32px 9px 16px}.guest-intro h1{max-width:350px;color:#fff8e9;font-size:clamp(32px,8vw,43px);letter-spacing:-.025em;text-shadow:0 4px 22px rgba(0,0,0,.34)}.guest-intro>p:not(.guest-kicker):not(.guest-intro__footer){color:#decfb8;font-size:16px}.guest-kicker{color:#efd596;letter-spacing:.19em}.guest-choice-grid{gap:13px;margin-top:38px}.guest-choice{min-height:124px;border-color:#efcf8f40;border-radius:14px;background:linear-gradient(135deg,#fff8e61b,#fff8e609);box-shadow:inset 0 1px #fff7e114,0 14px 30px #0000002e;color:#fff8e9;transition:transform .22s ease,border-color .22s ease,background .22s ease}.guest-choice:hover{transform:translateY(-2px);border-color:#efcf8fb3;background:linear-gradient(135deg,#fff8e626,#fff8e60f)}.guest-choice>span{color:#f1d492;text-shadow:0 0 18px rgba(231,179,77,.48)}.guest-choice small{color:#dcccb4}.guest-choice em{color:#f4d998}.guest-choice--primary{border-color:#ecc675c4;background:linear-gradient(135deg,#b78a3c5c,#482b1352);box-shadow:inset 0 1px #fff8e029,0 18px 36px #00000047}.guest-intro__footer{color:#ebdab8b8;letter-spacing:.03em}.guest-back{color:#e7d4ad;text-decoration:underline;text-decoration-color:#e7d4ad59;text-underline-offset:4px}.guest-anniversary{padding:12px 3px 16px}.guest-anniversary-card{min-height:320px;border:1px solid rgba(245,213,149,.45);border-radius:16px;box-shadow:0 24px 52px #0000006b,inset 0 0 0 1px #fff6dc1a}.guest-anniversary-card:after{background:linear-gradient(180deg,#100a0605 25%,#120a05e6)}.guest-anniversary-card img{height:320px;filter:saturate(.8) contrast(1.06) brightness(.88);transform:scale(1.015)}.guest-anniversary-card div{right:24px;bottom:24px;left:24px}.guest-anniversary-card strong{color:#fff8eb;font-size:31px;text-shadow:0 2px 15px rgba(0,0,0,.55)}.guest-anniversary-card span{color:#f3d99c}.guest-ornament:before,.guest-ornament:after{background:linear-gradient(90deg,transparent,#d9b96d,transparent)}.guest-ornament span{border-color:#edcf88;box-shadow:0 0 16px #e0b04a59}.guest-consent{padding:15px;border:1px solid rgba(237,207,143,.18);border-radius:10px;background:#fff6e00e;color:#e9ddc9}.guest-consent input{accent-color:#d3a64f}.guest-legal{color:#cfc0a8}.guest-legal a{color:#f1d59a;text-underline-offset:3px}.guest-anniversary .guest-button{margin-top:3px;border-color:#d9b461;background:linear-gradient(135deg,#d3a64d,#8c6024);box-shadow:inset 0 1px #fffae05c,0 12px 26px #0000004d}.guest-anniversary .guest-button:disabled{border-color:#e5ce9f38;background:#e7d2a738;color:#fffae98a;box-shadow:none}.guest-anniversary-list{padding:9px 2px}.guest-anniversary-list h1{color:#fff8e9}.guest-anniversary-list>p{color:#dbcab2}.guest-anniversary-option{border-color:#efcf8f3d;border-radius:10px;background:#fff8e613;color:#fff8e9}.guest-anniversary-option:hover{border-color:#efcf8f9e;background:#fff8e61f}.guest-anniversary-option img{filter:saturate(.78) brightness(.82)}.guest-anniversary-option small{color:#d9c8ae}.guest-shell--ceremony{justify-content:center}.guest-seal-screen{min-height:500px;padding:25px 10px}.guest-seal-screen h1{color:#fff8e9;font-size:clamp(31px,7vw,40px);text-shadow:0 4px 22px rgba(0,0,0,.35)}.guest-seal-screen>p{color:#dfceb5;font-size:16px}.guest-seal-screen>p strong{color:#f4d69a;font-size:24px}.guest-seal-screen .guest-button{border-color:#dcb668;background:linear-gradient(135deg,#d5a64a,#85591d);box-shadow:inset 0 1px #fff9dd59,0 15px 32px #00000057}.guest-seal-mark{width:126px;height:126px;border-color:#e6c16e;background:radial-gradient(circle at 34% 28%,#e6c572,#a7792d 58%,#5b3914);color:#fff6d9;box-shadow:inset 0 0 0 7px #41250a8f,inset 0 0 0 10px #fae19cc7,0 0 0 8px #e7c36f1a,0 0 44px #e0aa4645;text-shadow:0 2px 4px rgba(48,27,4,.62)}.guest-seal-mark--complete{background:radial-gradient(circle at 34% 28%,#e6c572,#a7792d 58%,#5b3914)}.guest-shell--capture .guest-capture__controls{position:relative;background:linear-gradient(155deg,#15100d,#26170e)}.guest-shell--capture .guest-capture__controls:before{content:"";position:absolute;top:0;right:12%;left:12%;height:1px;background:linear-gradient(90deg,transparent,#d2aa58,transparent)}.guest-shell--capture .guest-capture__controls h1{color:#fff6e5;font-family:Georgia,Times New Roman,serif;font-size:29px;font-weight:500}.guest-shell--capture .guest-capture__controls p{color:#dcc7a8}.guest-shell--capture .guest-button{border-color:#d7ae5d;background:linear-gradient(135deg,#c89941,#835718)}@media(min-width:640px){body:has(.guest-shell){background:#100c09}.guest-shell:not(.guest-shell--capture){border-color:#e8cc923b;box-shadow:0 35px 90px #0000009e}}@media(max-width:380px){.guest-intro{padding-top:15px}.guest-choice{min-height:110px}.guest-anniversary-card,.guest-anniversary-card img{min-height:267px;height:267px}}.guest-shell--light{--guest-ink: #2d2b29;--guest-muted: #716a61;--guest-paper: #fbf7ef;--guest-line: #d7c8b3;--guest-gold: #ad7f2c;--guest-gold-dark: #805b1d;isolation:isolate;background:radial-gradient(circle at 50% 93%,rgba(255,238,190,.72),transparent 22%),linear-gradient(180deg,#fffaf3,#fbf6ed 76%,#f7ead5)!important;color:var(--guest-ink);animation:guest-light-in .55s ease both}.guest-shell.guest-shell--light:before{display:block;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0;border-radius:0;background:url(/assets/guest-invitation-paper-wmUvPSH9.png) center / cover no-repeat;box-shadow:none;opacity:1;filter:none}.guest-shell.guest-shell--light:after{display:none;inset:auto 0 0;width:100%;height:26%;border:0;border-radius:0;background:radial-gradient(circle at 7% 44%,rgba(255,255,244,.92) 0 7px,transparent 8px),radial-gradient(circle at 21% 68%,rgba(255,255,246,.82) 0 10px,transparent 11px),radial-gradient(circle at 36% 32%,rgba(255,255,245,.9) 0 8px,transparent 9px),radial-gradient(circle at 51% 72%,rgba(255,255,245,.82) 0 11px,transparent 12px),radial-gradient(circle at 68% 38%,rgba(255,255,245,.86) 0 8px,transparent 9px),radial-gradient(circle at 87% 69%,rgba(255,255,245,.8) 0 10px,transparent 11px),linear-gradient(180deg,transparent,rgba(224,180,91,.2));box-shadow:none;opacity:.72}.guest-shell--light>header,.guest-shell--light>footer,.guest-shell--light>section{position:relative;z-index:1}.guest-shell--light .guest-brand{color:#98702c;text-shadow:none}.guest-shell--light>footer{color:#847b70}.guest-shell--light>footer a{text-decoration-color:#847b7059}.guest-shell--welcome>header{display:none}.guest-shell--welcome .guest-intro{width:min(100%,390px);margin:auto;padding:clamp(40px,8svh,72px) 8px 24px}.guest-shell--welcome .guest-intro h1{max-width:360px;margin:0 auto;color:#2c2b2a;font-family:Georgia,Times New Roman,serif;font-size:clamp(43px,12vw,62px);font-weight:400;line-height:.98;letter-spacing:-.045em;overflow-wrap:anywhere;text-shadow:none}.guest-shell--welcome .guest-intro h1 span{display:block;margin-bottom:5px;font-size:.72em;letter-spacing:-.025em}.guest-intro__ornament{width:142px;height:22px;margin:28px auto 22px;display:grid;grid-template-columns:1fr 28px 1fr;align-items:center;gap:9px}.guest-intro__ornament:before,.guest-intro__ornament:after{content:"";height:1px;background:linear-gradient(90deg,transparent,#c69b4d)}.guest-intro__ornament:after{transform:rotate(180deg)}.guest-intro__ornament span:before{content:"❧";color:#b9822e;font-family:Georgia,serif;font-size:24px}.guest-shell--light.guest-shell--welcome .guest-intro>.guest-intro__lead{max-width:290px;margin:0 auto;color:#373430;font-family:Georgia,Times New Roman,serif;font-size:clamp(20px,5.5vw,25px);line-height:1.3}.guest-assignment{width:min(100%,310px);margin:32px auto 0;padding:0;border:0;display:grid;gap:17px;text-align:left}.guest-assignment legend{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.guest-assignment__option{min-height:48px;display:grid;grid-template-columns:28px 1fr;align-items:center;gap:13px;color:#777267;cursor:pointer}.guest-assignment__option input{position:absolute;width:1px;height:1px;opacity:0}.guest-assignment__radio{width:24px;height:24px;border:1.5px solid #aaa08c;border-radius:50%;display:grid;place-items:center;background:#fffcf5a6}.guest-assignment__radio:after{content:"";width:12px;height:12px;border-radius:50%;background:transparent}.guest-assignment__option strong,.guest-assignment__option small{display:block}.guest-assignment__option strong{font-family:Georgia,Times New Roman,serif;font-size:17px;font-weight:400}.guest-assignment__option small{margin-top:3px;color:#a16f20;font-family:Georgia,Times New Roman,serif;font-size:12px}.guest-assignment__option.is-selected{color:#9b6f23}.guest-assignment__option.is-selected .guest-assignment__radio{border-color:#ad7b24;box-shadow:0 0 0 2px #ad7b2414}.guest-assignment__option.is-selected .guest-assignment__radio:after{background:#bd8a2f}.guest-assignment__option:has(input:focus-visible) .guest-assignment__radio{outline:3px solid rgba(190,143,52,.42);outline-offset:3px}.guest-welcome-cta{width:min(100%,330px);min-height:66px;margin:34px auto 0;padding:15px 22px;border:1px solid #92651d;border-radius:8px;background:linear-gradient(110deg,rgba(255,238,174,.16),transparent 35%,rgba(255,244,195,.11) 70%,transparent),linear-gradient(135deg,#bd913c,#9a6a22);box-shadow:inset 0 1px #fff8d77a,0 13px 27px #6443153d;color:#fffaf0;font-family:Georgia,Times New Roman,serif;font-size:20px;font-weight:400;letter-spacing:.01em;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.guest-welcome-cta:hover{transform:translateY(-1px);background:linear-gradient(135deg,#c79a45,#8f601f);box-shadow:inset 0 1px #fff8d785,0 16px 31px #64431547}.guest-welcome-cta:focus-visible{outline:3px solid rgba(190,143,52,.45);outline-offset:4px}.guest-shell--light .guest-back{color:#776d61}.guest-shell--light .guest-kicker{color:#9b712d}.guest-shell--light .guest-anniversary-list h1{color:#302d29;text-shadow:none}.guest-shell--light .guest-anniversary-list>p{color:#746b61}.guest-shell--light .guest-anniversary-option{border-color:#d7c8b3;background:#fffdf8d6;color:#38332e;box-shadow:0 5px 15px #5d45240f}.guest-shell--light .guest-anniversary-option:hover{border-color:#af8540;background:#fffdf8}.guest-shell--light .guest-anniversary-option img{filter:saturate(.88) brightness(.98)}.guest-shell--light .guest-anniversary-option small{color:#756c62}.guest-shell--light .guest-consent{border-color:#ddcfbb;background:#fffdf8d1;color:#4f4841}.guest-shell--light .guest-legal{color:#71685e}.guest-shell--light .guest-legal a{color:#805b1d}.guest-shell--light .guest-anniversary .guest-button{border-color:#92651d;background:linear-gradient(135deg,#bd913c,#91611f);box-shadow:inset 0 1px #fff8d76b,0 12px 24px #6443152e}.guest-shell--light .guest-anniversary .guest-button:disabled{border-color:#d1c5b5;background:#ddd4c6;color:#968d82}.guest-shell--success .guest-seal-screen h1{color:#302d29;text-shadow:none}.guest-shell--success .guest-seal-screen>p{color:#71685e}.guest-shell--success .guest-seal-mark{border-color:#b58735;background:radial-gradient(circle at 34% 28%,#dfbc69,#ae7d2b 58%,#714817);box-shadow:inset 0 0 0 7px #5d39115c,inset 0 0 0 10px #ffebacb8,0 0 38px #bb893233}.guest-shell--transition{isolation:isolate;overflow:hidden;background:#fbf7ef!important;color:#fff6e5}.guest-shell.guest-shell--transition:before{display:block;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:0;border-radius:0;background:url(/assets/guest-invitation-paper-wmUvPSH9.png) center / cover no-repeat;box-shadow:none;animation:guest-floral-out .65s ease both}.guest-shell.guest-shell--transition:after{display:block;top:0;right:0;bottom:0;left:0;z-index:0;width:100%;height:100%;border:0;border-radius:0;background:radial-gradient(ellipse at 50% 36%,rgba(145,94,34,.2),transparent 38%),linear-gradient(155deg,#24170f,#120d0a 72%);box-shadow:none;animation:guest-dim-in .65s ease both}.guest-shell--transition>header,.guest-shell--transition>footer{opacity:0}.guest-shell--transition>section{position:relative;z-index:1;animation:guest-dark-copy-in .65s ease both}.guest-shell--transition .guest-status__icon{border-color:#deb7679e;background:#fff6e014;color:#efd28f}.guest-shell--transition .guest-status h1{color:#fff6e5}.guest-shell--transition .guest-status p{color:#d8c6aa}.guest-shell--capture,.guest-shell--capture .guest-capture,.guest-shell--capture .guest-camera{background-color:#100c09}.guest-shell:not(.guest-shell--light) .guest-status h1{color:#fff6e5;text-shadow:0 4px 22px rgba(0,0,0,.35)}.guest-shell:not(.guest-shell--light) .guest-status p{color:#d8c6aa}@keyframes guest-light-in{0%{opacity:.78}to{opacity:1}}@keyframes guest-dim-in{0%{opacity:0}to{opacity:1}}@keyframes guest-floral-out{0%{opacity:.72}to{opacity:0}}@keyframes guest-dark-copy-in{0%{color:#302d29}to{color:#fff6e5}}@media(min-width:640px){body:has(.guest-shell--light){background:#e6ddd1}.guest-shell--light{border-color:#d6c9b8!important;box-shadow:0 30px 76px #4f3a2133!important}}@media(max-width:380px){.guest-shell--welcome .guest-intro{padding-top:34px}.guest-shell--welcome .guest-intro h1{font-size:clamp(39px,12vw,51px)}.guest-intro__ornament{margin-top:22px;margin-bottom:17px}.guest-assignment{margin-top:25px;gap:11px}.guest-welcome-cta{min-height:60px;margin-top:27px}}@media(prefers-reduced-motion:reduce){.guest-shell--light,.guest-shell--transition:before,.guest-shell--transition:after,.guest-shell--transition>section{animation:none}}

/* ============================================================
   LEUCHTSIEGEL – WELCOME REFERENZ-LOCK
   MASTER: 429 x 690 px

   Nur .guest-shell--welcome.
   Keine Wirkung auf andere Gäste-Seiten.
   Keine Änderung an Logik/Funktion.
   ============================================================ */

body:has(.guest-shell--welcome) {
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Gesamter erster Screen */
.guest-shell--welcome {
  position: relative !important;
  display: block !important;

  width: 100% !important;
  height: 100dvh !important;
  min-height: 100svh !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: hidden !important;
}

/*
  Die Referenz ist 429 px breit.
  Auf breiteren Screens bleibt die Gestaltung exakt in dieser
  Referenzbreite und wird horizontal mittig gesetzt.
*/
.guest-shell--welcome .guest-intro {
  position: absolute !important;
  inset: 0 !important;

  width: min(100%, 429px) !important;
  max-width: 429px !important;
  height: 100% !important;

  margin: 0 auto !important;
  padding: 0 !important;

  display: block !important;
  text-align: center !important;
}


/* ============================================================
   1. HEUTE AUFGENOMMEN / FÜR DIE ZUKUNFT BESTIMMT
   Referenz: sichtbarer Bereich ca. Y 57–101
   ============================================================ */

.guest-shell--welcome
.guest-intro > .guest-intro__lead {

  position: absolute !important;

  top: 7.6% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;

  width: min(320px, calc(100% - 24px)) !important;
  max-width: 320px !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #2c2b2a !important;

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  line-height: 1.18 !important;
  letter-spacing: -0.015em !important;

  text-align: center !important;
}

.guest-shell--welcome
.guest-intro > .guest-intro__lead span {
  color: #a77931 !important;
}


/* ============================================================
   2. ORNAMENT
   Referenzzentrum ca. Y 164
   ============================================================ */

.guest-shell--welcome .guest-intro__ornament {

  position: absolute !important;

  top: 23.8% !important;
  left: 50% !important;

  transform: translate(-50%, -50%) !important;

  width: 142px !important;
  height: 22px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: grid !important;
  grid-template-columns: 1fr 28px 1fr !important;
  align-items: center !important;
  gap: 9px !important;
}


/* ============================================================
   3. ANNA & JONAS
   Referenz: ca. Y 217–256
   ============================================================ */

.guest-shell--welcome .guest-intro h1 {

  position: absolute !important;

  top: 34.3% !important;
  left: 50% !important;

  transform: translate(-50%, -50%) !important;

  width: min(360px, calc(100% - 20px)) !important;
  max-width: 360px !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #2c2b2a !important;

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 54px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;

  white-space: nowrap !important;
  overflow-wrap: normal !important;
  text-align: center !important;

  text-shadow: none !important;
}


/* ============================================================
   4. HOCHZEITSDATUM
   Referenz: ca. Y 280–309
   Groß + dunkel – exakt wie Vorlage.
   ============================================================ */

.guest-shell--welcome .guest-event-date {

  position: absolute !important;

  top: 42.7% !important;
  left: 50% !important;

  transform: translate(-50%, -50%) !important;

  width: min(300px, calc(100% - 20px)) !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #2c2b2a !important;

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 40px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: -0.025em !important;

  text-align: center !important;
}


/* ============================================================
   5. AUSWAHLBEREICH
   Referenz:
   Automatisch ca. Y 384–415
   Hochzeitstag ca. Y 460–476

   Feldset selbst exakt horizontal mittig.
   ============================================================ */

.guest-shell--welcome .guest-assignment {

  position: absolute !important;

  top: 54.2% !important;
  left: 50% !important;

  transform: translateX(-50%) !important;

  box-sizing: border-box !important;

  width: min(310px, calc(100% - 16px)) !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  display: grid !important;
  gap: 20px !important;

  text-align: left !important;
}

.guest-shell--welcome .guest-assignment__option {

  box-sizing: border-box !important;

  width: 100% !important;
  min-height: 48px !important;

  margin: 0 !important;
  padding: 0 0 0 36px !important;

  display: grid !important;
  grid-template-columns: 24px 1fr !important;
  align-items: center !important;
  gap: 13px !important;
}

.guest-shell--welcome .guest-assignment__radio {

  width: 24px !important;
  height: 24px !important;
}

.guest-shell--welcome .guest-assignment__option strong {

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
}

.guest-shell--welcome .guest-assignment__option small {

  margin-top: 3px !important;

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
}


/* ============================================================
   6. BUTTON
   Referenz: ca. Y 538–598
   Breite ca. 305 px.
   ============================================================ */

.guest-shell--welcome .guest-welcome-cta {

  position: absolute !important;

  top: 78.0% !important;
  left: 50% !important;

  transform: translateX(-50%) !important;

  box-sizing: border-box !important;

  width: min(305px, calc(100% - 24px)) !important;
  height: 61px !important;
  min-height: 61px !important;

  margin: 0 !important;
  padding: 0 20px !important;

  border-radius: 8px !important;

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1 !important;

  text-align: center !important;
}


/* ============================================================
   7. FOOTER
   Referenz direkt am unteren Rand.
   ============================================================ */

.guest-shell--welcome > footer {

  position: absolute !important;

  left: 50% !important;
  bottom: 14px !important;

  transform: translateX(-50%) !important;

  box-sizing: border-box !important;

  width: min(100%, 429px) !important;

  margin: 0 !important;
  padding: 0 10px !important;

  font-size: 8px !important;
  line-height: 1 !important;

  text-align: center !important;

  white-space: nowrap !important;
}


/* ============================================================
   SAFE AREA
   Nur Schutz gegen Home-Indicator / Notch.
   Keine Designverschiebung auf Geräten ohne Safe Area.
   ============================================================ */

@supports (padding: env(safe-area-inset-bottom)) {

  .guest-shell--welcome > footer {
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
  }
}



/* ============================================================
   LEUCHTSIEGEL WELCOME – RESPONSIVE ERGÄNZUNG

   Hochformat-Mobile bleibt vollständig unangetastet.

   1. Smartphone Querformat:
      Referenzhöhe 690 px beibehalten + vertikal scrollen.

   2. Desktop:
      exakt dieselbe Referenzgestaltung proportional vergrößern.
   ============================================================ */


/* ------------------------------------------------------------
   SMARTPHONE / TABLET QUERFORMAT
   NICHT zusammenpressen.
   Stattdessen 429 × 690 Master-Komposition beibehalten
   und vertikales Scrollen erlauben.
   ------------------------------------------------------------ */

@media
  (orientation: landscape)
  and (max-height: 650px)
  and (max-width: 1100px) {

  html {
    overflow-y: auto !important;
  }

  body:has(.guest-shell--welcome) {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    min-height: 690px !important;
  }

  .guest-shell--welcome {
    position: relative !important;

    width: 100% !important;

    height: 690px !important;
    min-height: 690px !important;

    overflow: visible !important;
  }

  .guest-shell--welcome .guest-intro {
    position: absolute !important;

    inset: 0 !important;

    width: min(100%, 429px) !important;
    max-width: 429px !important;

    height: 690px !important;
    min-height: 690px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    transform: none !important;
  }

  /*
    Wichtig:
    Alle Prozentpositionen innerhalb guest-intro beziehen sich
    jetzt wieder auf exakt 690 px Höhe.

    Dadurch bleibt die abgenommene Hochformat-Geometrie erhalten,
    statt auf z.B. 390 px Displayhöhe zusammengedrückt zu werden.
  */

  .guest-shell--welcome > footer {
    position: absolute !important;
    bottom: 14px !important;
  }
}


/* ------------------------------------------------------------
   DESKTOP

   Keine neue Gestaltung.
   Die komplette 429 × 690 Referenz wird als Einheit
   proportional vergrößert und mittig platziert.
   ------------------------------------------------------------ */

@media
  (min-width: 900px)
  and (min-height: 700px) {

  body:has(.guest-shell--welcome) {
    overflow: hidden !important;
  }

  .guest-shell--welcome {
    position: relative !important;

    width: 100% !important;
    height: 100dvh !important;
    min-height: 100svh !important;

    overflow: hidden !important;
  }

  .guest-shell--welcome .guest-intro {
    position: absolute !important;

    inset: auto !important;
    top: 50% !important;
    left: 50% !important;

    width: 429px !important;
    max-width: 429px !important;

    height: 690px !important;
    min-height: 690px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform:
      translate(-50%, -50%)
      scale(1.10) !important;

    transform-origin: center center !important;
  }

  .guest-shell--welcome > footer {
    bottom: 14px !important;
    font-size: 9px !important;
  }
}


/* Größere Desktop-Bildschirme */
@media
  (min-width: 1300px)
  and (min-height: 820px) {

  .guest-shell--welcome .guest-intro {
    transform:
      translate(-50%, -50%)
      scale(1.18) !important;
  }
}


/* Sehr große Desktop-Bildschirme */
@media
  (min-width: 1700px)
  and (min-height: 980px) {

  .guest-shell--welcome .guest-intro {
    transform:
      translate(-50%, -50%)
      scale(1.28) !important;
  }
}


/* ============================================================
   DESKTOP FINAL
   Mobile Hochformat + Mobile Querformat NICHT verändern.
   ============================================================ */

@media (min-width: 900px) and (min-height: 700px) {

  body:has(.guest-shell--welcome) {
    overflow: hidden !important;
  }

  .guest-shell--welcome {
    position: relative !important;
    width: 100% !important;
    height: 100dvh !important;
    min-height: 100svh !important;
    overflow: hidden !important;
  }

  /*
    Mobile-Master bleibt 429 × 690.
    Auf Desktop wird er als EINHEIT deutlich größer dargestellt.
  */
  .guest-shell--welcome .guest-intro {
    position: absolute !important;

    inset: auto !important;
    top: 50% !important;
    left: 50% !important;

    width: 429px !important;
    max-width: 429px !important;

    height: 690px !important;
    min-height: 690px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform:
      translate(-50%, -50%)
      scale(1.28) !important;

    transform-origin: center center !important;
  }

  .guest-shell--welcome > footer {
    position: absolute !important;
    bottom: 12px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    width: 100% !important;
    font-size: 9px !important;
    text-align: center !important;
  }
}


/* Größere Desktop-Auflösung */
@media (min-width: 1400px) and (min-height: 800px) {

  .guest-shell--welcome .guest-intro {
    transform:
      translate(-50%, -50%)
      scale(1.55) !important;
  }
}


/* Große Desktop-Monitore */
@media (min-width: 1700px) and (min-height: 900px) {

  .guest-shell--welcome .guest-intro {
    transform:
      translate(-50%, -50%)
      scale(1.48) !important;
  }
}


/* Sehr große Monitore */
@media (min-width: 2100px) and (min-height: 1100px) {

  .guest-shell--welcome .guest-intro {
    transform:
      translate(-50%, -50%)
      scale(1.62) !important;
  }
}


/* ============================================================
   LEUCHTSIEGEL – DESKTOP CARD
   NUR Desktop.
   Mobile Hochformat und Mobile Querformat bleiben unverändert.
   ============================================================ */

@media (min-width: 900px) {

  html {
    min-height: 100%;
    background: #e5ddcf !important;
  }

  body:has(.guest-shell--welcome) {
    box-sizing: border-box !important;

    min-height: 100vh !important;

    margin: 0 !important;
    padding: 20px 0 !important;

    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    background: #e5ddcf !important;
  }

  /*
     Die gesamte Gäste-Seite selbst wird zur Karte.
     Keine Skalierung.
     Keine Vollbilddarstellung.
  */
  .guest-shell--welcome {
    position: relative !important;

    flex: 0 0 auto !important;

    width: 429px !important;
    min-width: 429px !important;
    max-width: 429px !important;

    height: 690px !important;
    min-height: 690px !important;
    max-height: 690px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    border-radius: 8px !important;

    box-shadow:
      0 24px 55px rgba(66, 48, 25, .18),
      0 4px 12px rgba(66, 48, 25, .08) !important;
  }

  /*
     Mobile-Master innerhalb der Karte exakt 1:1.
     Keine Desktop-Skalierung mehr.
  */
  .guest-shell--welcome .guest-intro {
    position: absolute !important;

    inset: 0 !important;

    width: 429px !important;
    min-width: 429px !important;
    max-width: 429px !important;

    height: 690px !important;
    min-height: 690px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;
  }

  /*
     Footer bleibt innerhalb der Karte.
  */
  .guest-shell--welcome > footer {
    position: absolute !important;

    left: 50% !important;
    bottom: 14px !important;

    transform: translateX(-50%) !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 10px !important;

    text-align: center !important;
  }
}



/* ============================================================
   LEUCHTSIEGEL – GUEST PERFORMANCE PATCH
   Keine Layout-, Farb-, Typografie- oder Größenänderungen.
   Nur unnötige Übergangs-/Touch-Verzögerungen entfernen.
   ============================================================ */


/* ------------------------------------------------------------
   1. Helle Gästeseiten sofort vollständig darstellen.
   Entfernt den alten opacity .78 -> 1 Fade.
   ------------------------------------------------------------ */

.guest-shell--light {
  animation: none !important;
}


/* ------------------------------------------------------------
   2. Alten Dark-/Gray-Transition-Layer außerhalb der
      eigentlichen Kamera-/Capture-Seite neutralisieren.

   Dadurch kein dunkler/grauer Zwischenframe mehr.
   ------------------------------------------------------------ */

.guest-shell--transition:not(.guest-shell--capture) {
  background: #fbf7ef !important;
  color: inherit !important;
}

.guest-shell.guest-shell--transition:not(.guest-shell--capture)::before {
  animation: none !important;
  opacity: 1 !important;
}

.guest-shell.guest-shell--transition:not(.guest-shell--capture)::after {
  display: none !important;
  animation: none !important;
}

.guest-shell--transition:not(.guest-shell--capture) > header,
.guest-shell--transition:not(.guest-shell--capture) > footer {
  opacity: 1 !important;
}

.guest-shell--transition:not(.guest-shell--capture) > section {
  animation: none !important;
}


/* ------------------------------------------------------------
   3. Touch-Reaktion beschleunigen.
   ------------------------------------------------------------ */

.guest-shell button,
.guest-shell .guest-assignment__option {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}


/* ------------------------------------------------------------
   4. Auf echten Touch-Geräten keine hängenbleibenden
      Hover-/Active-Animationen.

   Desktop-Maus-Hover bleibt unangetastet.
   ------------------------------------------------------------ */

@media (hover: none), (pointer: coarse) {

  .guest-shell button {
    transition: none !important;
  }

  .guest-shell button:active {
    transform: none !important;
  }

  .guest-shell .guest-welcome-cta {
    transition: none !important;
  }

  .guest-shell .guest-welcome-cta:hover,
  .guest-shell .guest-welcome-cta:active {
    background:
      linear-gradient(
        110deg,
        rgba(255,238,174,.16),
        transparent 35%,
        rgba(255,244,195,.11) 70%,
        transparent
      ),
      linear-gradient(135deg,#bd913c,#9a6a22) !important;

    box-shadow:
      inset 0 1px #fff8d77a,
      0 13px 27px #6443153d !important;
  }
}



/* ============================================================
   LEUCHTSIEGEL – MOBILE CTA TOUCH POSITION FIX
   Button darf beim Antippen seine Zentrierung nicht verlieren.
   ============================================================ */

@media (hover: none), (pointer: coarse) {

    .guest-shell--welcome .guest-welcome-cta:active {
        transform: translateX(-50%) !important;
    }

}



/* ============================================================
   LEUCHTSIEGEL – PAGE 2 DESIGN
   Nur Jubiläums-/Einwilligungsseite.
   Keine Änderung an Seite 1, Kamera oder Aufnahme-Logik.
   ============================================================ */


/* Wortmarke gemäß Brand-System */
.guest-shell--light .guest-brand {
    color: #C8A56A !important;
    text-shadow: none !important;
}


/* Ruhigere Hierarchie oberhalb der Jubiläumskarte */
.guest-shell--light .guest-anniversary .guest-kicker {
    color: #846B4A !important;
}


/* ------------------------------------------------------------
   Jubiläumstext wie freigegebene Referenz:
   2. Hochzeitstag
   Baumwollhochzeit

   Keine Trennlinie / kein Ornament zwischen den beiden Zeilen.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary-card strong {
    display: block !important;
    font-size: 24px !important;
    line-height: 1.08 !important;
    font-weight: 600 !important;
    color: #fff8eb !important;
    text-shadow: 0 2px 12px rgba(0,0,0,.48) !important;
}

.guest-shell--light .guest-anniversary-card div > span {
    display: block !important;
    margin-top: 5px !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    color: #e0b75f !important;
}


/* Garantiert keine dekorative Linie innerhalb des Kartentextes */
.guest-shell--light .guest-anniversary-card div::before,
.guest-shell--light .guest-anniversary-card div::after {
    display: none !important;
    content: none !important;
}


/* ------------------------------------------------------------
   Datenschutz/Widerruf direkt zwischen Checkbox und Kamera-
   Button entfernen. Der reguläre Footer unten bleibt bestehen.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary .guest-legal {
    display: none !important;
}


/* Einwilligung bleibt im bestehenden Design */
.guest-shell--light .guest-anniversary .guest-consent {
    margin-bottom: 14px !important;
}




/* ============================================================
   LEUCHTSIEGEL – PAGE 2 LAYOUT V2

   Nur Seite mit .guest-anniversary.
   Seite 1 / Kamera / Logik / Bilder bleiben unangetastet.
   ============================================================ */


/* ------------------------------------------------------------
   SEITE 2 eindeutig begrenzen
   ------------------------------------------------------------ */

.guest-shell--light:has(.guest-anniversary) {
    position: relative !important;
}


/* ------------------------------------------------------------
   KOPFZEILE

   LEUCHTSIEGEL links.
   Zurück rechts auf derselben visuellen Ebene.
   ------------------------------------------------------------ */

.guest-shell--light:has(.guest-anniversary) > header {
    position: relative !important;
    z-index: 3 !important;

    margin: 0 !important;
    padding: 28px 18px 0 !important;
}

.guest-shell--light:has(.guest-anniversary) .guest-brand {
    color: #C8A56A !important;
    text-shadow: none !important;
}


/* Zurück aus dem alten zentrierten Platz lösen */

.guest-shell--light .guest-anniversary .guest-back {
    position: absolute !important;

    top: -48px !important;
    right: 2px !important;
    left: auto !important;

    width: auto !important;

    margin: 0 !important;
    padding: 6px 0 !important;

    color: #766348 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    transform: none !important;
}


/* ------------------------------------------------------------
   SEITENINHALT NACH OBEN

   Alter Stand saß sichtbar zu tief.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary {
    width: min(100%, 410px) !important;

    margin: 0 auto !important;

    transform: translateY(-38px) !important;
}


/* ------------------------------------------------------------
   KICKER
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary .guest-kicker {
    margin: 0 0 4px !important;

    color: #846B4A !important;

    font-size: 11px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;

    letter-spacing: .17em !important;
}


/* ------------------------------------------------------------
   JUBILÄUMSKARTE

   Breite bleibt praktisch wie bisher.
   Höhe wird dem neuen Entwurf angepasst.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary-card {
    width: 100% !important;

    height: 400px !important;
    min-height: 400px !important;

    margin: 0 !important;

    border-radius: 16px !important;

    overflow: hidden !important;
}


/* Bild füllt die größere Karte */
.guest-shell--light .guest-anniversary-card img {
    width: 100% !important;

    height: 400px !important;
    min-height: 400px !important;

    object-fit: cover !important;

    transform: scale(1.015) !important;
}


/* ------------------------------------------------------------
   KARTENTEXT

   Exakt die bereits gewünschte kleine Darstellung.
   KEINE Linie dazwischen.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary-card div {
    right: 24px !important;
    bottom: 24px !important;
    left: 24px !important;
}

.guest-shell--light .guest-anniversary-card strong {
    display: block !important;

    font-size: 24px !important;
    line-height: 1.08 !important;
    font-weight: 600 !important;

    color: #fff8eb !important;
}

.guest-shell--light .guest-anniversary-card div > span {
    display: block !important;

    margin-top: 5px !important;

    font-size: 14px !important;
    line-height: 1.2 !important;

    color: #e0b75f !important;
}

.guest-shell--light .guest-anniversary-card div::before,
.guest-shell--light .guest-anniversary-card div::after {
    display: none !important;
    content: none !important;
}


/* ------------------------------------------------------------
   ORNAMENT NACH DER KARTE

   Etwas kompakter, damit Einwilligung/Button ihre bisherige
   Position weitgehend behalten.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary > .guest-ornament {
    margin-top: 13px !important;
    margin-bottom: 13px !important;
}


/* ------------------------------------------------------------
   EINWILLIGUNG

   Inhalt/Text bleibt exakt im aktuellen neuen Stand.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary .guest-consent {
    margin-top: 0 !important;
    margin-bottom: 14px !important;
}


/* Der zusätzliche Datenschutzblock zwischen den Elementen
   bleibt entfernt. Footer unten bleibt bestehen. */

.guest-shell--light .guest-anniversary .guest-legal {
    display: none !important;
}


/* ============================================================
   SEHR KLEINE HANDYS
   Höhe leicht reduzieren, nicht Layout zusammendrücken.
   ============================================================ */

@media (max-width: 380px) {

    .guest-shell--light .guest-anniversary-card,
    .guest-shell--light .guest-anniversary-card img {
        height: 370px !important;
        min-height: 370px !important;
    }

}



/* LEUCHTSIEGEL – Seite 2 Header-Fix
   Entfernt ausschließlich den fehlerhaften -38px Gesamtversatz. */

.guest-shell--light .guest-anniversary {
    transform: none !important;
}



/* ============================================================
   LEUCHTSIEGEL – PAGE 2 MOBILE FIT
   Nur Jubiläums-/Einwilligungsseite.
   ============================================================ */


/* Falls das Display sehr klein ist, darf NUR Seite 2 scrollen. */
@media (max-width: 639px) {

    html:has(.guest-shell--light .guest-anniversary),
    body:has(.guest-shell--light .guest-anniversary) {
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    .guest-shell--light:has(.guest-anniversary) {
        height: auto !important;
        min-height: 100dvh !important;
        overflow: visible !important;
    }

}


/* ------------------------------------------------------------
   Jubiläumskarte:
   statt fixer 400px responsive an Bildschirmhöhe anpassen.

   Texte / Typografie bleiben unverändert.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary-card,
.guest-shell--light .guest-anniversary-card img {
    height: clamp(290px, 46dvh, 325px) !important;
    min-height: 0 !important;
}


/* Bild bleibt vollflächig und im bisherigen Zuschnitt. */
.guest-shell--light .guest-anniversary-card img {
    width: 100% !important;
    object-fit: cover !important;
}


/* ------------------------------------------------------------
   Vertikalraum reduzieren, ohne das Design zu verändern.
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary > .guest-ornament {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
}

.guest-shell--light .guest-anniversary .guest-consent {
    padding: 12px 14px !important;
    margin-top: 0 !important;
    margin-bottom: 10px !important;
}

.guest-shell--light .guest-anniversary .guest-button {
    margin-top: 0 !important;
}


/* ------------------------------------------------------------
   Sehr kurze Smartphone-Displays.
   ------------------------------------------------------------ */

@media (max-height: 700px) and (max-width: 639px) {

    .guest-shell--light .guest-anniversary-card,
    .guest-shell--light .guest-anniversary-card img {
        height: clamp(275px, 43dvh, 300px) !important;
    }

    .guest-shell--light .guest-anniversary .guest-kicker {
        margin-bottom: 2px !important;
    }

    .guest-shell--light .guest-anniversary > .guest-ornament {
        margin-top: 6px !important;
        margin-bottom: 6px !important;
    }

    .guest-shell--light .guest-anniversary .guest-consent {
        padding: 10px 12px !important;
        margin-bottom: 8px !important;
    }

}


/* LEUCHTSIEGEL – PAGE 2 BACK BUTTON FIX */

.guest-shell--light .guest-anniversary {
    position: relative !important;
    z-index: 2 !important;
}

.guest-shell--light .guest-anniversary .guest-back {
    position: absolute !important;
    z-index: 999 !important;

    pointer-events: auto !important;
    touch-action: manipulation !important;

    min-width: 72px !important;
    min-height: 40px !important;

    cursor: pointer !important;
}


/* LEUCHTSIEGEL – PAGE 2 BACK LAYER FIX */

/*
   Der Header liegt optisch über dem Bereich des Zurück-Buttons.
   Er enthält auf Seite 2 keine notwendige Touch-Aktion.
*/
.guest-shell--light:has(.guest-anniversary) > header {
    z-index: 1 !important;
    pointer-events: none !important;
}

/* Die eigentliche Seite liegt darüber. */
.guest-shell--light .guest-anniversary {
    position: relative !important;
    z-index: 3 !important;
}

/* Zurück bleibt explizit touchbar. */
.guest-shell--light .guest-anniversary .guest-back {
    z-index: 4 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 VISUAL FINE
   Ausschließlich visuelle Seite-2-Korrektur.
   Keine Navigation / kein JS / keine Logik.
   ============================================================ */


/* ------------------------------------------------------------
   1. Kicker sauber über der Karte
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary .guest-kicker {
    margin: 0 0 7px !important;
    padding: 0 !important;
}


/* ------------------------------------------------------------
   2. Karte
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary-card {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* Originalbild wieder natürlicher / heller */
.guest-shell--light .guest-anniversary-card img {
    filter: none !important;
}


/* Nur unten dunkler Verlauf für gute Textlesbarkeit */
.guest-shell--light .guest-anniversary-card::after {
    background:
        linear-gradient(
            180deg,
            rgba(20,14,10,0) 48%,
            rgba(20,14,10,.05) 60%,
            rgba(20,14,10,.22) 74%,
            rgba(20,14,10,.64) 100%
        ) !important;
}


/* ------------------------------------------------------------
   3. Kartentext
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary-card div {
    bottom: 22px !important;
}

.guest-shell--light .guest-anniversary-card strong {
    margin: 0 !important;
}


/* Baumwollhochzeit größer */
.guest-shell--light .guest-anniversary-card div > span {
    display: block !important;

    margin-top: 6px !important;

    font-size: 17px !important;
    line-height: 1.15 !important;
    font-weight: 500 !important;
}


/* weiterhin KEINE Linie zwischen den beiden Texten */
.guest-shell--light .guest-anniversary-card div::before,
.guest-shell--light .guest-anniversary-card div::after {
    display: none !important;
    content: none !important;
}


/* ------------------------------------------------------------
   4. Gleichmäßiger vertikaler Rhythmus
   ------------------------------------------------------------ */

/* Karte -> Ornament */
.guest-shell--light .guest-anniversary > .guest-ornament {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}


/* Ornament -> Einwilligung / Einwilligung -> Button */
.guest-shell--light .guest-anniversary .guest-consent {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
}


/* Button nicht zusätzlich wegdrücken */
.guest-shell--light .guest-anniversary .guest-button {
    margin-top: 0 !important;
}


/* ------------------------------------------------------------
   5. gleiche Außenkanten
   ------------------------------------------------------------ */

.guest-shell--light .guest-anniversary-card,
.guest-shell--light .guest-anniversary .guest-consent,
.guest-shell--light .guest-anniversary .guest-button {
    box-sizing: border-box !important;
    width: 100% !important;
}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 CANONICAL LAYOUT
   EIN Layout-Block für Seite 2.

   - keine translateY-Abstandskorrekturen
   - Grün über echte Abstände
   - Gelb über genau einen Abstand
   - Rosa über Flex-Auto-Abstände
   - Navigation / JS unverändert
   ============================================================ */

@media (max-width: 639px) {

    /* --------------------------------------------------------
       GESAMTSEITE
       -------------------------------------------------------- */

    .guest-shell--light:has(.guest-anniversary) {
        --p2-side: 24px;
        --p2-head-gap: 20px;
        --p2-ornament-gap: 18px;
        --p2-action-gap: 12px;

        box-sizing: border-box !important;

        display: flex !important;
        flex-direction: column !important;

        width: 100% !important;
        min-height: 100dvh !important;
        height: auto !important;
    }


    /* --------------------------------------------------------
       GRÜN 1:
       Oberkante -> LEUCHTSIEGEL = 20px
       -------------------------------------------------------- */

    .guest-shell--light:has(.guest-anniversary) > header {
        box-sizing: border-box !important;

        width: 100% !important;
        min-height: 0 !important;

        margin: 0 !important;

        padding:
            var(--p2-head-gap)
            var(--p2-side)
            0 !important;

        flex: 0 0 auto !important;

        position: relative !important;
        z-index: 1 !important;

        pointer-events: none !important;
    }


    .guest-shell--light:has(.guest-anniversary) .guest-brand {
        transform: none !important;
    }


    /* --------------------------------------------------------
       HAUPTBEREICH

       padding-top = ebenfalls 20px.

       Damit entsteht derselbe echte Abstand zwischen
       LEUCHTSIEGEL-Zeile und Kicker.
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary {
        box-sizing: border-box !important;

        width: calc(100% - 48px) !important;
        max-width: 410px !important;

        flex: 1 1 auto !important;
        min-height: 0 !important;

        margin: 0 auto !important;
        padding:
            var(--p2-head-gap)
            0
            0 !important;

        display: flex !important;
        flex-direction: column !important;

        /* alte zusätzliche Flex-Abstände neutralisieren */
        gap: 0 !important;

        position: relative !important;
        z-index: 3 !important;

        transform: none !important;
    }


    /* --------------------------------------------------------
       ZURÜCK

       Keine translateY-Korrektur mehr.
       Touch-/Layer-Fix bleibt erhalten.
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary .guest-back {
        margin: 0 !important;

        transform: none !important;

        z-index: 4 !important;

        pointer-events: auto !important;
        touch-action: manipulation !important;
    }


    /* --------------------------------------------------------
       KICKER -> BILD
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary .guest-kicker {
        margin: 0 0 8px !important;
        padding: 0 !important;
    }


    /* --------------------------------------------------------
       BILD
       Bestehende Größe und Optik bleiben.
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary-card {
        flex: 0 0 auto !important;

        margin: 0 !important;

        transform: none !important;
    }


    /* --------------------------------------------------------
       GELB:
       genau EINE Abstandsquelle unter dem Bild.
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary > .guest-ornament {
        flex: 0 0 22px !important;

        margin:
            var(--p2-ornament-gap)
            auto
            0 !important;
    }


    /* --------------------------------------------------------
       ROSA OBEN:

       margin-top:auto nimmt freien Platz zwischen
       Ornament und Einwilligung ein.
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary .guest-consent {
        flex: 0 0 auto !important;

        margin:
            auto
            0
            0 !important;

        transform: none !important;
    }


    /* Checkbox-Korrektur bleibt */
    .guest-shell--light .guest-anniversary .guest-consent input {
        transform: translateY(-2px) !important;
    }


    /* alten Mittelblock weiterhin nicht anzeigen */
    .guest-shell--light .guest-anniversary .guest-legal {
        display: none !important;
    }


    /* --------------------------------------------------------
       BUTTON + ROSA UNTEN

       margin-bottom:auto erhält denselben Anteil des
       freien Flex-Raums wie margin-top:auto am Consent.
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary .guest-button {
        flex: 0 0 auto !important;

        margin:
            var(--p2-action-gap)
            0
            auto !important;

        transform: none !important;
    }


    /* --------------------------------------------------------
       FOOTER

       Das alte margin-top:auto würde gegen unsere
       rosa Flex-Verteilung arbeiten -> neutralisieren.
       -------------------------------------------------------- */

    .guest-shell--light:has(.guest-anniversary) > footer {
        flex: 0 0 auto !important;

        margin-top: 0 !important;
    }

}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 HEADER ALIGN
   Nur Kopfbereich.
   Keine Änderungen an Karte / Consent / Button / Footer / JS.
   ============================================================ */

@media (max-width: 639px) {

    .guest-shell--light:has(.guest-anniversary) {
        --p2-header-side: 24px;
        --p2-header-gap: 22px;
        --p2-header-line: 18px;

        /* gemeinsame echte Bezugskante */
        position: relative !important;

        /* eventuell geerbten oberen Shell-Abstand ausschließen */
        padding-top: 0 !important;
    }


    /* --------------------------------------------------------
       LOGO-ZEILE
       -------------------------------------------------------- */

    .guest-shell--light:has(.guest-anniversary) > header {
        box-sizing: border-box !important;

        width: 100% !important;
        height: calc(
            var(--p2-header-gap) +
            var(--p2-header-line)
        ) !important;

        min-height: 0 !important;

        margin: 0 !important;

        padding:
            var(--p2-header-gap)
            var(--p2-header-side)
            0 !important;

        position: relative !important;

        flex: 0 0 auto !important;
    }


    .guest-shell--light:has(.guest-anniversary) .guest-brand {
        box-sizing: border-box !important;

        height: var(--p2-header-line) !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;

        line-height: var(--p2-header-line) !important;

        transform: none !important;
    }


    /* --------------------------------------------------------
       WICHTIG:
       .guest-anniversary darf nicht mehr das Bezugssystem
       des Zurück-Buttons sein.
       Dadurch positioniert sich Zurück direkt an der Shell.
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary {
        position: static !important;

        /* gleicher Abstand Logo -> Kicker wie oben -> Logo */
        padding-top: var(--p2-header-gap) !important;
    }


    /* --------------------------------------------------------
       ZURÜCK AUF EXAKT DIESELBE ZEILE WIE LEUCHTSIEGEL
       -------------------------------------------------------- */

    .guest-shell--light .guest-anniversary .guest-back {
        position: absolute !important;

        top: var(--p2-header-gap) !important;
        right: var(--p2-header-side) !important;
        left: auto !important;

        box-sizing: border-box !important;

        width: auto !important;
        height: var(--p2-header-line) !important;
        min-width: 0 !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;

        line-height: var(--p2-header-line) !important;

        transform: none !important;

        z-index: 20 !important;

        pointer-events: auto !important;
        touch-action: manipulation !important;
    }

}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 DESKTOP PARITY

   Gleiche Seite-2-Geometrie auf Mobile und Desktop.
   KEINE neuen Abstände.
   KEINE neuen Designwerte.
   Nur Entfernung der bisherigen max-width:639px-Beschränkung.
   ============================================================ */


/* ============================================================
   GESAMTSEITE
   ============================================================ */

.guest-shell--light:has(.guest-anniversary) {
    --p2-side: 24px;
    --p2-head-gap: 22px;
    --p2-ornament-gap: 18px;
    --p2-action-gap: 12px;

    --p2-header-side: 24px;
    --p2-header-gap: 22px;
    --p2-header-line: 18px;

    box-sizing: border-box !important;

    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;
    min-height: 100dvh !important;
    height: auto !important;

    position: relative !important;

    padding-top: 0 !important;
}


/* ============================================================
   HEADER
   ============================================================ */

.guest-shell--light:has(.guest-anniversary) > header {
    box-sizing: border-box !important;

    width: 100% !important;

    height: calc(
        var(--p2-header-gap) +
        var(--p2-header-line)
    ) !important;

    min-height: 0 !important;

    margin: 0 !important;

    padding:
        var(--p2-header-gap)
        var(--p2-header-side)
        0 !important;

    flex: 0 0 auto !important;

    position: relative !important;
    z-index: 1 !important;

    pointer-events: none !important;
}


.guest-shell--light:has(.guest-anniversary) .guest-brand {
    box-sizing: border-box !important;

    height: var(--p2-header-line) !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;

    line-height: var(--p2-header-line) !important;

    transform: none !important;
}


/* ============================================================
   HAUPTBEREICH
   ============================================================ */

.guest-shell--light .guest-anniversary {
    box-sizing: border-box !important;

    width: calc(100% - 48px) !important;
    max-width: 410px !important;

    flex: 1 1 auto !important;
    min-height: 0 !important;

    margin: 0 auto !important;

    padding:
        var(--p2-header-gap)
        0
        0 !important;

    display: flex !important;
    flex-direction: column !important;

    gap: 0 !important;

    position: static !important;

    transform: none !important;
}


/* ============================================================
   ZURÜCK – gleiche Linie wie LEUCHTSIEGEL
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-back {
    position: absolute !important;

    top: var(--p2-header-gap) !important;
    right: var(--p2-header-side) !important;
    left: auto !important;

    box-sizing: border-box !important;

    width: auto !important;
    height: var(--p2-header-line) !important;

    min-width: 0 !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    line-height: var(--p2-header-line) !important;

    transform: none !important;

    z-index: 20 !important;

    pointer-events: auto !important;
    touch-action: manipulation !important;
}


/* ============================================================
   KICKER
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-kicker {
    margin: 0 0 8px !important;
    padding: 0 !important;
}


/* ============================================================
   BILDKARTE
   ============================================================ */

.guest-shell--light .guest-anniversary-card {
    flex: 0 0 auto !important;

    margin: 0 !important;

    transform: none !important;
}


/* ============================================================
   ORNAMENT
   ============================================================ */

.guest-shell--light .guest-anniversary > .guest-ornament {
    flex: 0 0 22px !important;

    margin:
        var(--p2-ornament-gap)
        auto
        0 !important;
}


/* ============================================================
   EINWILLIGUNG
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-consent {
    flex: 0 0 auto !important;

    margin:
        auto
        0
        0 !important;

    transform: none !important;
}


.guest-shell--light .guest-anniversary .guest-consent input {
    transform: translateY(-2px) !important;
}


.guest-shell--light .guest-anniversary .guest-legal {
    display: none !important;
}


/* ============================================================
   BUTTON
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-button {
    flex: 0 0 auto !important;

    margin:
        var(--p2-action-gap)
        0
        auto !important;

    transform: none !important;
}


/* ============================================================
   FOOTER
   ============================================================ */

.guest-shell--light:has(.guest-anniversary) > footer {
    flex: 0 0 auto !important;

    margin-top: 0 !important;
}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 DESKTOP CARD FIX

   Seite 2 erhält auf Desktop dasselbe Hochformat-Prinzip
   wie Seite 1.

   Mobile wird NICHT verändert.
   Innere Seite-2-Geometrie wird NICHT verändert.
   ============================================================ */

@media (min-width: 640px) {

    body:has(.guest-shell--light .guest-anniversary) {
        background: #e6ddd1 !important;
    }

    .guest-shell--light:has(.guest-anniversary) {

        /* NICHT mehr Browserbreite */
        width: 430px !important;
        max-width: 430px !important;

        /* gleiches Hochformat wie Seite 1 */
        height: 690px !important;
        min-height: 690px !important;
        max-height: 690px !important;

        box-sizing: border-box !important;

        margin:
            8px
            auto
            0 !important;

        overflow: hidden !important;

        /* vorhandene Card-Optik erhalten */
        border-radius: inherit !important;
    }

}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 FLUID EQUAL ZONES

   A = LEUCHTSIEGEL -> Bild
   B = Bild -> Einwilligung
   C = Button -> Impressum

   A = B = C

   Die Höhe wird NICHT fest vorgegeben.
   Drei identische 1fr-Tracks teilen den verfügbaren Raum.

   Nur Seite 2.
   ============================================================ */


.guest-shell--light:has(.guest-anniversary) {

    /*
       Nur Mindestwerte.
       Die tatsächliche Zone wächst dynamisch mit dem Display.
    */
    --p2-zone-min: clamp(12px, 2.2dvh, 18px);
    --p2-action-gap: clamp(8px, 1.4dvh, 12px);

    display: flex !important;
    flex-direction: column !important;

    box-sizing: border-box !important;
}


/* ============================================================
   HEADER
   Die bestehende Ausrichtung von LEUCHTSIEGEL / Zurück bleibt.
   ============================================================ */

.guest-shell--light:has(.guest-anniversary) > header {
    flex: 0 0 auto !important;
}


/* ============================================================
   HAUPTBEREICH

   7 Reihen:

   1 = A
   2 = Bild
   3 = B
   4 = Consent
   5 = kleiner Funktionsabstand
   6 = Button
   7 = C

   Die Reihen 1 / 3 / 7 sind identisch: 1fr.
   ============================================================ */

.guest-shell--light .guest-anniversary {

    flex: 1 1 auto !important;
    min-height: 0 !important;

    display: grid !important;

    grid-template-columns: 1fr !important;

    grid-template-rows:
        minmax(var(--p2-zone-min), 1fr)
        auto
        minmax(var(--p2-zone-min), 1fr)
        auto
        var(--p2-action-gap)
        auto
        minmax(var(--p2-zone-min), 1fr)
        !important;

    gap: 0 !important;

    margin: 0 auto !important;
    padding: 0 !important;

    transform: none !important;

    /*
       Wichtig:
       Zurück bleibt absolut an der Shell ausgerichtet
       und wird kein Grid-Element.
    */
    position: static !important;
}


/* ============================================================
   A – LEUCHTSIEGEL -> BILD

   Kicker sitzt nur INNERHALB der flexiblen Zone.
   Er erzeugt selbst keinen zusätzlichen Abstand.
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-kicker {

    grid-row: 1 !important;

    align-self: center !important;
    justify-self: center !important;

    margin: 0 !important;
    padding: 0 !important;

    height: auto !important;

    line-height: 1.2 !important;
}


/* ============================================================
   BILDKARTE

   Höhe reagiert auf die verfügbare Displayhöhe.
   Kein fixer 325px-Zwang.
   ============================================================ */

.guest-shell--light .guest-anniversary-card {

    grid-row: 2 !important;

    width: 100% !important;

    height: clamp(220px, 46dvh, 325px) !important;
    min-height: 0 !important;

    margin: 0 !important;

    align-self: stretch !important;

    transform: none !important;
}


.guest-shell--light .guest-anniversary-card img {

    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;

    object-fit: cover !important;
}


/* ============================================================
   B – BILD -> EINWILLIGUNG

   Ornament sitzt nur INNERHALB derselben flexiblen Zone.
   Keine margin-top / margin-bottom-Abstandsberechnung mehr.
   ============================================================ */

.guest-shell--light .guest-anniversary > .guest-ornament {

    grid-row: 3 !important;

    align-self: center !important;
    justify-self: center !important;

    width: 132px !important;
    height: 22px !important;

    margin: 0 !important;
    padding: 0 !important;

    flex: none !important;
}


/* ============================================================
   EINWILLIGUNG
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-consent {

    grid-row: 4 !important;

    align-self: stretch !important;

    width: 100% !important;

    margin: 0 !important;

    transform: none !important;
}


/* bestehende kleine Checkbox-Ausrichtung beibehalten */

.guest-shell--light .guest-anniversary .guest-consent input {
    transform: translateY(-2px) !important;
}


/* vorhandener Mittel-Legalblock bleibt ausgeblendet */

.guest-shell--light .guest-anniversary .guest-legal {
    display: none !important;
}


/* ============================================================
   BUTTON

   Grid-Reihe 5 ist automatisch der kleine Abstand zwischen
   Consent und Button.
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-button {

    grid-row: 6 !important;

    align-self: stretch !important;

    width: 100% !important;

    margin: 0 !important;

    transform: none !important;
}


/* ============================================================
   C – BUTTON -> IMPRESSUM

   Leere siebte Grid-Reihe.
   Sie ist exakt dieselbe 1fr-Höhe wie A und B.
   ============================================================ */

.guest-shell--light .guest-anniversary::after {

    content: "" !important;

    display: block !important;

    grid-row: 7 !important;

    min-width: 1px !important;
    min-height: 0 !important;

    pointer-events: none !important;
}


/* ============================================================
   FOOTER

   Kein zusätzliches margin/padding oberhalb.
   Abstand zum Button kommt ausschließlich aus Zone C.
   ============================================================ */

.guest-shell--light:has(.guest-anniversary) > footer {

    flex: 0 0 auto !important;

    margin: 0 !important;

    padding-top: 0 !important;
    padding-bottom:
        max(8px, env(safe-area-inset-bottom))
        !important;
}


/* ============================================================
   DESKTOP

   430 × 690 bleibt nur die IDEALE MAXIMALGRÖSSE.

   Bei kleinerem Browserfenster schrumpft die Seite automatisch.
   ============================================================ */

@media (min-width: 640px) {

    .guest-shell--light:has(.guest-anniversary) {

        width:
            min(
                430px,
                calc(100vw - 16px)
            )
            !important;

        max-width: 430px !important;

        height:
            min(
                690px,
                calc(100dvh - 16px)
            )
            !important;

        min-height: 0 !important;
        max-height: 690px !important;

        margin: 8px auto 0 !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

}


/* ============================================================
   MOBILE

   gesamte tatsächlich verfügbare Viewporthöhe verwenden.
   dvh reagiert auch auf Safari-Browserleisten.
   ============================================================ */

@media (max-width: 639px) {

    .guest-shell--light:has(.guest-anniversary) {

        width: 100% !important;
        max-width: none !important;

        height: 100dvh !important;
        min-height: 100dvh !important;
        max-height: 100dvh !important;

        margin: 0 auto !important;

        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 CARD LABEL + EQUAL ZONES

   A = LEUCHTSIEGEL -> Bild
   B = Bild -> Einwilligung
   C = Button -> Impressum

   A = B = C dynamisch.

   Kein fixer 50px-Abstand.
   Keine translateY-Abstandskorrektur.
   ============================================================ */


.guest-shell--light:has(.guest-anniversary) {

    /*
       Mindestabstand – tatsächliche Höhe wird vom verfügbaren
       Displayraum über drei identische 1fr-Zonen berechnet.
    */
    --p2-zone-min: clamp(12px, 2.2dvh, 18px);

    --p2-action-gap: clamp(8px, 1.4dvh, 12px);

    display: flex !important;
    flex-direction: column !important;
}


/* ============================================================
   EXTERNEN KICKER SICHER ENTFERNEN
   Falls ein alter Browser noch altes JS im Speicher hat.
   ============================================================ */

.guest-shell--light .guest-anniversary > .guest-kicker {
    display: none !important;
}


/* ============================================================
   HAUPTBEREICH

   1 = A
   2 = Bild
   3 = B
   4 = Einwilligung
   5 = kleiner Funktionsabstand
   6 = Button
   7 = C

   A / B / C sind exakt dieselben flexiblen Tracks.
   ============================================================ */

.guest-shell--light .guest-anniversary {

    flex: 1 1 auto !important;
    min-height: 0 !important;

    display: grid !important;

    grid-template-columns: 1fr !important;

    grid-template-rows:
        minmax(var(--p2-zone-min), 1fr)
        auto
        minmax(var(--p2-zone-min), 1fr)
        auto
        var(--p2-action-gap)
        auto
        minmax(var(--p2-zone-min), 1fr)
        !important;

    gap: 0 !important;

    margin: 0 auto !important;
    padding: 0 !important;

    transform: none !important;

    position: static !important;
}


/* ============================================================
   BILDKARTE
   ============================================================ */

.guest-shell--light .guest-anniversary-card {

    grid-row: 2 !important;

    width: 100% !important;

    /*
       Dynamisch:
       klein auf niedrigen Displays,
       größer auf hohen Displays.
    */
    height: clamp(220px, 46dvh, 325px) !important;
    min-height: 0 !important;

    margin: 0 !important;

    transform: none !important;
}


.guest-shell--light .guest-anniversary-card img {

    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;

    object-fit: cover !important;
}


/* ============================================================
   NEUES LABEL IN DER KARTE
   ============================================================ */

.guest-shell--light
.guest-anniversary-card
.guest-anniversary-card__label {

    display: block !important;

    margin: 0 0 6px !important;

    color: rgba(255,248,235,.84) !important;

    font-family:
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif !important;

    font-size: clamp(8px, 2.1vw, 9px) !important;
    line-height: 1.2 !important;

    font-weight: 700 !important;

    letter-spacing: .11em !important;

    text-transform: uppercase !important;

    text-shadow:
        0 1px 8px rgba(0,0,0,.38) !important;
}


/* Hochzeitstag bleibt visuell dominant */
.guest-shell--light .guest-anniversary-card strong {
    margin: 0 !important;
}


/* Untertitel bleibt unverändert */
.guest-shell--light .guest-anniversary-card div > span {
    margin-top: 6px !important;
}


/* ============================================================
   B = BILD -> EINWILLIGUNG

   Ornament sitzt mittig in der flexiblen Zone.
   Es erzeugt selbst KEINE Margins mehr.
   ============================================================ */

.guest-shell--light .guest-anniversary > .guest-ornament {

    grid-row: 3 !important;

    align-self: center !important;
    justify-self: center !important;

    width: 132px !important;
    height: 22px !important;

    margin: 0 !important;
    padding: 0 !important;

    flex: none !important;
}


/* ============================================================
   EINWILLIGUNG
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-consent {

    grid-row: 4 !important;

    width: 100% !important;

    margin: 0 !important;

    transform: none !important;
}


.guest-shell--light .guest-anniversary .guest-consent input {
    transform: translateY(-2px) !important;
}


.guest-shell--light .guest-anniversary .guest-legal {
    display: none !important;
}


/* ============================================================
   BUTTON
   ============================================================ */

.guest-shell--light .guest-anniversary .guest-button {

    grid-row: 6 !important;

    width: 100% !important;

    margin: 0 !important;

    transform: none !important;
}


/* ============================================================
   C = BUTTON -> IMPRESSUM

   Die leere siebte Reihe ist exakt genauso flexibel
   wie A und B.
   ============================================================ */

.guest-shell--light .guest-anniversary::after {

    content: "" !important;

    display: block !important;

    grid-row: 7 !important;

    min-width: 1px !important;
    min-height: 0 !important;

    pointer-events: none !important;
}


/* Footer erzeugt KEINEN zusätzlichen oberen Abstand */
.guest-shell--light:has(.guest-anniversary) > footer {

    flex: 0 0 auto !important;

    margin: 0 !important;

    padding-top: 0 !important;

    padding-bottom:
        max(8px, env(safe-area-inset-bottom))
        !important;
}


/* ============================================================
   DESKTOP

   430 × 690 ist Maximalformat, kein Zwangsformat.
   ============================================================ */

@media (min-width:640px) {

    .guest-shell--light:has(.guest-anniversary) {

        width:
            min(430px, calc(100vw - 16px))
            !important;

        max-width:430px !important;

        height:
            min(690px, calc(100dvh - 16px))
            !important;

        min-height:0 !important;
        max-height:690px !important;

        margin:8px auto 0 !important;

        overflow:hidden !important;
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width:639px) {

    .guest-shell--light:has(.guest-anniversary) {

        width:100% !important;
        max-width:none !important;

        height:100dvh !important;
        min-height:100dvh !important;
        max-height:100dvh !important;

        margin:0 auto !important;

        overflow-x:hidden !important;

        /*
           Falls ein extrem kleines Display den Mindestinhalt
           unterschreitet, bleibt Scroll als Sicherheitsnetz.
        */
        overflow-y:auto !important;
    }

}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 LABEL TOP POSITION

   Nur Position.
   Schrift / Farbe / Größe / Bild / Verlauf bleiben unverändert.
   ============================================================ */

.guest-shell--light
.guest-anniversary-card
.guest-anniversary-card__label {

    position: absolute !important;

    top: 18px !important;
    left: 24px !important;
    right: 24px !important;

    z-index: 2 !important;

    margin: 0 !important;
}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 LABEL READABILITY

   Nur:
   - linksbündige Ausrichtung
   - bessere Lesbarkeit auf hellen Bildern

   Keine Layout-/Abstandsänderung.
   ============================================================ */


/* eigene lokale Overlay-Ebene innerhalb der Bildkarte */
.guest-shell--light .guest-anniversary-card {
    position: relative !important;
    isolation: isolate !important;
}


/* sehr dezenter Kontrastschutz nur am oberen Bildrand */
.guest-shell--light .guest-anniversary-card::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    height: 82px !important;

    background:
        linear-gradient(
            180deg,
            rgba(20, 14, 10, .20) 0%,
            rgba(20, 14, 10, .08) 48%,
            rgba(20, 14, 10, 0) 100%
        ) !important;

    z-index: 1 !important;

    pointer-events: none !important;
}


/* bestehender unterer Text weiterhin vor den Overlays */
.guest-shell--light .guest-anniversary-card > div {
    z-index: 3 !important;
}


/* Erklärung oben links */
.guest-shell--light
.guest-anniversary-card
.guest-anniversary-card__label {

    /* Position bleibt wie bisher */
    top: 18px !important;
    left: 24px !important;
    right: 24px !important;

    /* jetzt bewusst linksbündig */
    text-align: left !important;

    z-index: 3 !important;

    /*
       Textfarbe / Größe / Gewicht bleiben unverändert.
       Nur Kontrast wird verbessert.
    */
    text-shadow:
        0 1px 2px rgba(0,0,0,.72),
        0 2px 9px rgba(0,0,0,.38)
        !important;
}


/* ============================================================
   LEUCHTSIEGEL – PAGE 2 B/C BALANCE

   A bleibt gleich.
   B wird größer.
   C wird kleiner.

   Weiterhin vollständig dynamisch.
   ============================================================ */

.guest-shell--light .guest-anniversary {

    grid-template-rows:

        /* A: Logo -> Bild */
        minmax(var(--p2-zone-min), 1fr)

        /* Bild */
        auto

        /* B: Bild -> Consent = größer */
        minmax(var(--p2-zone-min), 1.20fr)

        /* Consent */
        auto

        /* Consent -> Button */
        var(--p2-action-gap)

        /* Button */
        auto

        /* C: Button -> Impressum = kleiner */
        minmax(var(--p2-zone-min), .70fr)

        !important;
}



/* ============================================================
   LEUCHTSIEGEL – MANUELLE HOCHZEITSTAG-AUSWAHL
   Scope ausschließlich guest-anniversary-list.
   ============================================================ */

.guest-shell--light:has(.guest-anniversary-list){
    position:relative!important;

    --p2-header-gap:22px;
    --p2-header-side:24px;
    --p2-header-line:18px;
}


/* Zurück exakt nach aktuell wirksamer Seite-2-Regel */

.guest-shell--light .guest-anniversary-list .guest-back {

    position: absolute !important;

    top: var(--p2-header-gap) !important;
    right: var(--p2-header-side) !important;
    left: auto !important;

    box-sizing: border-box !important;

    width: auto !important;
    height: var(--p2-header-line) !important;

    min-width: 0 !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    line-height: var(--p2-header-line) !important;

    transform: none !important;

    z-index: 20 !important;

    pointer-events: auto !important;
    touch-action: manipulation !important;

}


/* Hochzeitstag separat vor den bestehenden Jahren 1–25 */

.guest-shell--light
.guest-anniversary-list
.guest-anniversary-option--wedding {
    display:flex!important;
    grid-template-columns:1fr!important;
    align-items:center!important;

    margin-bottom:4px!important;

    border-color:rgba(200,165,106,.68)!important;
}

.guest-shell--light
.guest-anniversary-list
.guest-anniversary-option--wedding > span {
    width:100%!important;

    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;

    text-align:left!important;
}



/* ============================================================
   LEUCHTSIEGEL – HOCHZEIT DETAIL VARIANTE B
   Aktiv ausschließlich mit ?hochzeitDesign=2
   und ausschließlich bei releaseYear 0.
   ============================================================ */

.guest-shell--light
.guest-anniversary--hochzeit-v2{
    width:min(100%,410px)!important;
}


/* Bildkarte etwas dominanter */

.guest-shell--light
.guest-anniversary--hochzeit-v2
.guest-anniversary-card{
    overflow:hidden!important;
    border-radius:16px!important;
    background:#fffaf3!important;
}


/* Ringbild */

.guest-shell--light
.guest-anniversary--hochzeit-v2
.guest-anniversary-card > img{
    display:block!important;

    width:100%!important;
    height:auto!important;

    aspect-ratio:1.48 / 1!important;
    object-fit:cover!important;

    border-radius:0!important;
}


/* Goldene Botschaft direkt auf dem Übergang Bild/Text */

.guest-shell--light
.guest-anniversary--hochzeit-v2
.guest-anniversary-card__label{
    position:relative!important;

    display:block!important;
    width:max-content!important;
    max-width:calc(100% - 40px)!important;

    margin:-30px auto 0!important;
    padding:10px 18px!important;

    border-radius:10px 10px 0 0!important;

    background:#b77b24!important;
    color:#fff!important;

    font-size:10px!important;
    font-weight:700!important;
    letter-spacing:.08em!important;
    line-height:1.2!important;

    white-space:nowrap!important;

    z-index:3!important;
}


/* Unterer heller Bereich */

.guest-shell--light
.guest-anniversary--hochzeit-v2
.guest-anniversary-card > div{
    position:relative!important;

    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;

    padding:26px 18px 22px!important;

    background:#fffaf5!important;

    text-align:center!important;
}


/* Hochzeit */

.guest-shell--light
.guest-anniversary--hochzeit-v2
.guest-anniversary-card > div > strong{
    margin:0!important;

    font-family:Georgia,"Times New Roman",serif!important;
    font-size:clamp(30px,7.5vw,38px)!important;
    font-weight:500!important;
    line-height:1.08!important;

    color:#2e2a27!important;
}


/* Hochzeitsdatum */

.guest-shell--light
.guest-anniversary--hochzeit-v2
.guest-anniversary-card > div > span{
    margin-top:8px!important;

    font-family:Georgia,"Times New Roman",serif!important;
    font-size:clamp(18px,4.6vw,22px)!important;
    font-weight:600!important;

    color:#b77b24!important;
}


/* Mobile bleibt innerhalb des bestehenden Screens */

@media(max-width:639px){

    .guest-shell--light
    .guest-anniversary--hochzeit-v2
    .guest-anniversary-card{
        width:100%!important;
    }

    .guest-shell--light
    .guest-anniversary--hochzeit-v2
    .guest-anniversary-card > img{
        max-height:42dvh!important;
    }

}