*{box-sizing:border-box;margin:0;padding:0}body{background-color:#4a4a4a;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;height:100vh;overflow:hidden}.container{display:flex;height:100vh;width:100%}.invitation-section{align-items:center;background-color:#e5e5e5;display:flex;flex:0.382;justify-content:center;overflow-y:auto;padding:2rem}.invitation-content{text-align:center}.domain-name{color:#333;font-size:3rem;font-weight:700;margin-bottom:1.5rem;word-break:break-word}.prompt-text{color:#666;font-size:1.25rem;line-height:1.6;margin-bottom:2rem}.qr-placeholder{align-items:center;display:flex;justify-content:center;margin-top:2rem}.qr-stub{background-color:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.3);display:inline-block;padding:8px}.scanner-section{align-items:center;background-color:#4a4a4a;display:flex;flex:0.618;justify-content:center;overflow:hidden;padding:2rem;user-select:none}.scanner-content{align-items:center;display:flex;flex-direction:column;gap:1rem;height:100%;min-height:0;width:100%}.title-container{color:#ccc;display:flex;flex-direction:row}.title-container,.title-container h1{font-size:.875rem;font-weight:500}.toolbar{align-items:center;display:flex;flex-direction:row;gap:1rem;justify-content:center;max-width:600px;width:100%}.state-hint{color:#ccc;font-size:.875rem;font-weight:500;line-height:1.4;min-height:1.2rem;padding:0 1rem;text-align:center;width:100%}.preview-wrapper{align-items:center;background-image:url(preview.png);background-position:50%;background-repeat:no-repeat;display:flex;flex:1;justify-content:center;min-height:0;position:relative;width:100%}.transform-overlay{border-radius:8px;cursor:crosshair;height:100%;left:0;pointer-events:auto;position:absolute;top:0;width:100%;z-index:10}.preview-canvas,.preview-image{display:block;height:auto;max-height:100%;max-width:100%;object-fit:contain;width:auto}.download-btn{align-items:center;background-color:hsla(0,0%,100%,.9);border:none;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.3);color:#4a4a4a;cursor:pointer;display:flex;height:48px;justify-content:center;position:absolute;right:1rem;top:50%;transform:translateY(-50%);transition:background-color .2s ease,transform .2s ease;width:48px;z-index:20}.download-btn:hover{background-color:#fff}.download-btn svg{height:24px;width:24px}.preview-hint{background-color:rgba(0,0,0,.5);border-radius:8px;box-shadow:0 2px 8px 2px rgba(0,0,0,.25),inset 0 0 0 2px hsla(0,0%,100%,.1);color:hsla(0,0%,80%,.6);font-size:2rem;left:50%;max-width:90%;padding:1rem;pointer-events:none;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%);visibility:hidden;z-index:1}.preview-hint.error{color:rgba(211,47,47,.8);font-size:1.25rem}.main-action-btn{background-color:#fff;border:none;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.3);color:#4a4a4a;cursor:pointer;flex:1;font-size:1.125rem;font-weight:600;padding:1rem 2rem;transition:background-color .2s ease}.main-action-btn:hover{background-color:#f0f0f0}.main-action-btn:active{transform:scale(.98)}.main-action-btn:disabled{background-color:#ccc;box-shadow:none;cursor:not-allowed}.secondary-action-btn{background-color:#5a5a5a;border:1px solid #6a6a6a;border-radius:8px;color:#ccc;cursor:pointer;font-size:1.125rem;font-weight:600;padding:1rem 2rem;transition:background-color .2s ease,border-color .2s ease}.secondary-action-btn:hover:not(:disabled){background-color:#6a6a6a;border-color:#7a7a7a}.secondary-action-btn:active:not(:disabled){transform:scale(.98)}.secondary-action-btn:disabled{background-color:#3a3a3a;border-color:#4a4a4a;color:#666;cursor:not-allowed}.error-toast{background-color:#fff;border:1px solid #ffcdd2;border-radius:12px;box-shadow:0 4px 16px rgba(0,0,0,.2);color:#d32f2f;font-size:.9rem;max-width:500px;min-width:280px;opacity:0;padding:1rem 1.25rem;pointer-events:none;position:fixed;text-align:center;transform:translateX(-50%) translateY(20px);transition:opacity .3s ease,transform .3s ease;width:auto;z-index:1000}.error-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.error-toast.success{background-color:#fff;border-color:#c8e6c9;color:#2e7d32}@media (max-width:768px){body{height:100vh;overflow:hidden}@supports (height:100dvh){body{height:100dvh}}.container{flex-direction:column;height:100vh}@supports (height:100dvh){.container{height:100dvh}}.invitation-section{display:none}.scanner-section{flex:1;overflow:hidden;padding:1rem;user-select:none}.scanner-content{gap:.5rem;height:100%;max-width:100%;min-height:0}.state-hint{color:#ccc;font-size:.8125rem;padding:0 .5rem}.preview-canvas{height:auto;max-height:100%;max-width:100%;width:auto}.download-btn{height:44px;right:.75rem;top:50%;transform:translateY(-50%);width:44px}.download-btn svg{height:22px;width:22px}.domain-name{font-size:2rem}.prompt-text{font-size:1rem}.main-action-btn,.secondary-action-btn{font-size:1rem;padding:1rem}.error-toast{border-radius:10px;font-size:.875rem;max-width:calc(100% - 2rem);min-width:auto;padding:.875rem 1rem}}@supports (-webkit-touch-callout:none){.preview-canvas,.preview-image{transform:translateZ(0);-webkit-transform:translateZ(0)}}