:root{--background:#fbf6ef;--surface:#fffdfb;--surface-warm:#fff2e8;--ink:#2e2633;--muted:#665b69;--coral:#d75043;--coral-dark:#ad382f;--plum:#5e315d;--plum-dark:#4c214c;--plum-soft:#f3e9f3;--mint:#f3fbf5;--mint-line:#90b99b;--teal:#2f766d;--gold:#f5bc57;--border:#eadfd7;--shadow:0 18px 55px #5e315d21}*{box-sizing:border-box}html{background:var(--background);min-height:100%}body{min-height:100%;color:var(--ink);background:linear-gradient(180deg, #fffcf7f5, #fbf6effa 42rem), var(--background);margin:0;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input{font:inherit}button{touch-action:manipulation}.page-shell{width:min(100%,68rem);min-height:100vh;margin:0 auto;padding:clamp(.75rem,2.6vw,1.25rem)}.hero-band{text-align:center;padding:clamp(.75rem,2.8vw,1.6rem) 0 .45rem}.hero-copy{justify-items:center;gap:.55rem;display:grid}.event-kicker{width:fit-content;color:var(--plum);border:1px solid var(--mint-line);background:#ffffffc7;border-radius:999px;justify-content:center;align-items:center;gap:.55rem;margin:0;padding:.42rem .95rem;font-size:.95rem;font-weight:850;display:inline-flex;box-shadow:0 8px 22px #5e315d0f}.kicker-heart{color:var(--mint-line);font-size:1.15rem;line-height:1}h1,h2,p{margin-top:0}h1{color:var(--plum);letter-spacing:0;margin-bottom:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.35rem,7.2vw,4rem);font-weight:800;line-height:1.02}.subheadline{max-width:45rem;color:var(--muted);margin-bottom:0;font-size:clamp(1rem,2.35vw,1.24rem);line-height:1.42}.step-guide{color:var(--muted);justify-content:center;align-items:center;margin:.6rem 0 0;padding:0;font-size:.98rem;font-weight:760;list-style:none;display:flex}.step-guide li{align-items:center;gap:.62rem;padding:0 clamp(.85rem,2.2vw,1.45rem);display:inline-flex;position:relative}.step-guide li+li:before{content:"";background:#ddd2cc;width:1px;height:1.35rem;position:absolute;left:0}.step-number{width:2rem;height:2rem;color:var(--plum);background:var(--plum-soft);border-radius:999px;place-items:center;font-weight:900;display:inline-grid}.recorder-panel{background:var(--surface);border:1px solid var(--border);max-width:54rem;box-shadow:var(--shadow);border-radius:8px;gap:.88rem;margin:.85rem auto 2rem;padding:clamp(1.28rem,3vw,1.65rem) clamp(1rem,2.8vw,1.45rem) clamp(1rem,2.8vw,1.45rem);display:grid;position:relative;overflow:hidden}.recorder-panel:before{content:"";background:linear-gradient(90deg, var(--coral), var(--gold), var(--teal));height:.38rem;position:absolute;inset:0 0 auto}.field-label{color:var(--plum);margin-bottom:-.36rem;font-size:1rem;font-weight:850}.name-input{width:100%;min-height:3.45rem;color:var(--ink);background:#fffdfb;border:1.5px solid #e6cec0;border-radius:8px;outline:none;padding:.82rem 1rem;font-size:1.08rem}.name-input::placeholder{color:#9a929d}.name-input:focus{border-color:var(--teal);box-shadow:0 0 0 4px #2f766d24}.name-input[aria-invalid=true]{border-color:#e3a39b}.name-error{color:var(--coral-dark);margin:-.38rem 0 0;font-size:.92rem;font-weight:760;line-height:1.35}.recording-note{color:var(--muted);margin-bottom:0;font-size:1rem;line-height:1.45}.recorder-status{background:linear-gradient(180deg, #fff8f1, var(--surface-warm));border:1px solid #f0d1bd;border-radius:8px;justify-content:space-between;align-items:center;gap:1rem;min-height:4.25rem;padding:.82rem 1rem;display:flex}.timer{color:var(--plum);font-variant-numeric:tabular-nums;align-items:center;gap:.62rem;font-size:clamp(2.15rem,8vw,3.35rem);font-weight:950;line-height:1;display:inline-flex}.timer span{background:#beb5c2;border-radius:999px;flex:none;width:.82rem;height:.82rem}.timer-active span{background:var(--coral);box-shadow:0 0 0 6px #d7504329}.wave-meter{grid-template-columns:repeat(5,.45rem);align-items:center;gap:.28rem;min-width:3.4rem;height:3rem;display:inline-grid}.wave-meter span{background:var(--teal);border-radius:999px;width:100%;display:block}.wave-meter span:first-child,.wave-meter span:nth-child(5){height:1rem}.wave-meter span:nth-child(2),.wave-meter span:nth-child(4){height:1.9rem}.wave-meter span:nth-child(3){background:var(--coral);height:2.7rem}.warning-message,.success-message,.error-message{border-radius:8px;margin-bottom:0;padding:.78rem .9rem;font-weight:760;line-height:1.35}.warning-message{color:#694212;background:#fff2c7;border:1px solid #f4cd72}.success-message{color:#195d3f;background:#e4f7ec;border:1px solid #aedfc2}.error-message{color:#84251f;background:#ffe8e4;border:1px solid #efb5ad}.button-row{gap:.75rem;width:100%;display:flex}.button-row>button{flex:1}.two-up{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.primary-button,.secondary-button,.danger-button,.file-button{text-align:center;cursor:pointer;border:0;border-radius:8px;justify-content:center;align-items:center;gap:.55rem;min-width:0;min-height:3.55rem;padding:.85rem 1rem;font-size:1rem;font-weight:900;line-height:1.1;text-decoration:none;display:inline-flex}.primary-button{color:#fff;background:linear-gradient(180deg, #6b3569, var(--plum-dark));box-shadow:0 12px 24px #5e315d2e}.primary-button:hover:not(:disabled){background:linear-gradient(#5f2e5d,#431a43)}.secondary-button{color:var(--plum);background:var(--plum-soft);border:1px solid #ddcadd}.danger-button{color:#fff;background:linear-gradient(180deg, #e36455, var(--coral-dark));box-shadow:0 12px 24px #d750432e}.danger-button:hover:not(:disabled){background:linear-gradient(180deg, var(--coral), #942f28)}.primary-button:disabled,.secondary-button:disabled,.danger-button:disabled{cursor:not-allowed;opacity:.58}.file-button:has(+input:disabled){cursor:not-allowed;opacity:.58}.full-width{width:100%}.fallback-divider{color:var(--muted);grid-template-columns:1fr auto 1fr;align-items:center;gap:.8rem;font-size:.92rem;display:grid}.fallback-divider:before,.fallback-divider:after{content:"";background:var(--border);height:1px}.fallback-divider span{border:1px solid var(--border);background:#fffaf6;border-radius:999px;place-items:center;min-width:2rem;height:2rem;display:inline-grid}.file-fallback{flex-wrap:wrap;justify-content:center;align-items:center;gap:.7rem 1rem;display:flex}.fallback-label{color:var(--muted);font-size:.98rem}.file-button{min-height:3rem;color:var(--plum);box-shadow:none;background:#ffffffb8;border:1.5px solid #5e315d8a;padding:.7rem 1.05rem}.file-button:hover{background:var(--plum-soft)}.file-fallback input{clip:rect(0 0 0 0);white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.preview-area{gap:.85rem;display:grid}audio{width:100%;min-height:3.25rem}.progress-wrap{gap:.5rem;display:grid}.progress-label{color:var(--plum);justify-content:space-between;font-weight:850;display:flex}.progress-track{background:#efe4dd;border-radius:999px;height:.75rem;overflow:hidden}.progress-track span{background:linear-gradient(90deg, var(--teal), var(--coral));height:100%;transition:width .16s;display:block}.success-state,.private-panel{text-align:center;place-items:center}.success-state{color:var(--teal);gap:.9rem;padding:1.1rem .4rem;display:grid}.success-state h2,.private-panel h2{color:var(--plum);margin-bottom:0;font-size:clamp(1.75rem,7vw,2.35rem);line-height:1.05}.success-state p,.private-panel p{max-width:28rem;color:var(--muted);margin-bottom:0;font-size:1.05rem;line-height:1.45}.private-icon{width:4.1rem;height:4.1rem;color:var(--plum);background:var(--mint);border:1px solid #90b99b80;border-radius:999px;place-items:center;display:grid}@media (max-width:42rem){.page-shell{padding:.72rem}.hero-band{padding:.55rem 0 .32rem}.hero-copy{gap:.42rem}.event-kicker{max-width:100%;padding:.36rem .7rem;font-size:.82rem}h1{max-width:11ch;font-size:clamp(2.1rem,12vw,2.9rem)}.subheadline{max-width:25rem;font-size:.96rem;line-height:1.36}.step-guide{text-align:left;justify-content:stretch;gap:.28rem;width:min(100%,18.5rem);margin-top:.4rem;font-size:.9rem;display:grid}.step-guide li{padding:0}.step-guide li+li:before{display:none}.step-number{width:1.55rem;height:1.55rem;font-size:.82rem}.recorder-panel{gap:.72rem;margin:.62rem auto 1rem;padding:1.25rem .95rem .95rem}.name-input{min-height:3.25rem;font-size:1rem}.recording-note{font-size:.94rem}.recorder-status{min-height:3.85rem;padding:.68rem .78rem}.timer{gap:.48rem;font-size:clamp(2rem,14vw,2.85rem)}.timer span{width:.68rem;height:.68rem}.wave-meter{grid-template-columns:repeat(5,.34rem);gap:.22rem;min-width:2.6rem;height:2.35rem}.wave-meter span:first-child,.wave-meter span:nth-child(5){height:.75rem}.wave-meter span:nth-child(2),.wave-meter span:nth-child(4){height:1.45rem}.wave-meter span:nth-child(3){height:2.15rem}.primary-button,.secondary-button,.danger-button{min-height:3.35rem}.file-fallback{justify-items:center;gap:.52rem;display:grid}.file-button{width:100%;min-height:3.05rem;font-size:.93rem}.two-up{grid-template-columns:1fr}}