*,*:before,*:after{box-sizing:border-box}html,body{margin:0;height:100%;background:#000;color:#fff;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;touch-action:manipulation;overscroll-behavior:none}#app{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;background:#000}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#display{flex:1;display:flex;align-items:center;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);padding-inline:max(1rem,env(safe-area-inset-left)) max(1rem,env(safe-area-inset-right));padding-block:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-bottom));cursor:pointer;user-select:none;-webkit-user-select:none;overflow:hidden}.message{margin:0;width:100%;text-align:center;line-height:1.1;font-weight:600;word-break:break-word;-webkit-hyphens:auto;hyphens:auto;white-space:pre-wrap}.message:empty:before{content:"Tap to write a message";opacity:.25;font-weight:400}.hint{position:fixed;bottom:max(1rem,env(safe-area-inset-bottom));left:50%;transform:translate(-50%);font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;opacity:.35;pointer-events:none;transition:opacity .3s ease}.hint.hidden{opacity:0}.controls{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:center;padding:max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));background:#000000b8;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:10}.controls.hidden{display:none}.controls-panel{width:min(100%,32rem);display:flex;flex-direction:column;gap:.75rem}#message-input{width:100%;resize:none;border:1px solid rgba(255,255,255,.2);border-radius:.75rem;background:#ffffff0f;color:#fff;font:inherit;font-size:1.125rem;line-height:1.4;padding:.875rem 1rem;outline:none}#message-input:focus{border-color:#ffffff73}#message-input::placeholder{color:#ffffff59}.controls-actions{display:flex;flex-wrap:wrap;gap:.5rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:#ffffff14;color:#fff;font:inherit;font-size:.9375rem;font-weight:500;padding:.625rem 1.125rem;cursor:pointer;transition:background .15s ease,border-color .15s ease}.btn:hover,.btn:focus-visible{background:#ffffff29;border-color:#ffffff73;outline:none}.btn.primary{background:#fff;color:#000;border-color:#fff}.btn.primary:hover,.btn.primary:focus-visible{background:#e8e8e8}.btn.icon{padding:.625rem;margin-inline-start:auto;display:inline-flex;align-items:center;justify-content:center}.saved-panel{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;justify-content:flex-end;background:#0009}.saved-panel.hidden{display:none}.saved-panel-inner{width:min(100%,22rem);height:100%;background:#111;border-inline-start:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}.saved-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-block-end:1rem}.saved-header h2{margin:0;font-size:1.125rem;font-weight:600}.saved-list{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:.5rem}.saved-item{display:flex;align-items:stretch;gap:.25rem;border-radius:.625rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.08);overflow:hidden}.saved-item-text{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;color:#fff;font:inherit;text-align:start;padding:.75rem;cursor:pointer;line-height:1.35}.saved-item-text:hover,.saved-item-text:focus-visible{background:#ffffff0f;outline:none}.saved-item-delete{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;color:#ffffff73;padding:0 .75rem;cursor:pointer;font-size:1.25rem;line-height:1}.saved-item-delete:hover,.saved-item-delete:focus-visible{color:#ff6b6b;outline:none}.saved-empty{margin:0;opacity:.45;font-size:.9375rem}.saved-empty.hidden{display:none}@media(orientation:landscape)and (max-height:500px){.controls{align-items:center;padding-block:.75rem}.controls-panel{flex-direction:row;flex-wrap:wrap;align-items:center;width:min(100%,48rem)}#message-input{flex:1 1 100%}.controls-actions{flex:1 1 auto}}