*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #E8E8EE;--bg-warm: #EEEEF4;--light: #FFFFFF;--dark: #C8C8D4;--primary: #5C6BC0;--primary-dim: #DDE0F5;--text: #2A2A3A;--text-sub: #8888A8;--text-muted: #AAAAC0;--danger: #C62828;--raised: 6px 6px 14px var(--dark), -6px -6px 14px var(--light);--raised-sm: 3px 3px 8px var(--dark), -3px -3px 8px var(--light);--raised-xs: 2px 2px 5px var(--dark), -2px -2px 5px var(--light);--inset: inset 4px 4px 10px var(--dark), inset -4px -4px 10px var(--light);--inset-sm: inset 2px 2px 6px var(--dark), inset -2px -2px 6px var(--light);--radius-xs: 8px;--radius-sm: 12px;--radius-md: 18px;--radius-lg: 24px;--radius-xl: 30px;--radius-full: 999px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}body.dark{--bg: #1E1E2C;--bg-warm: #22222E;--light: #2A2A3C;--dark: #141420;--primary: #7986CB;--primary-dim: #252840;--text: #DDDDF0;--text-sub: #7070A0;--text-muted: #4A4A6A;--danger: #EF5350;--raised: 6px 6px 14px var(--dark), -6px -6px 14px var(--light);--raised-sm: 3px 3px 8px var(--dark), -3px -3px 8px var(--light);--raised-xs: 2px 2px 5px var(--dark), -2px -2px 5px var(--light);--inset: inset 4px 4px 10px var(--dark), inset -4px -4px 10px var(--light);--inset-sm: inset 2px 2px 6px var(--dark), inset -2px -2px 6px var(--light);color-scheme:dark}#root{display:contents}body.index-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);font-family:var(--font)}.card{background:var(--bg);border-radius:var(--radius-xl);box-shadow:var(--raised);padding:40px 32px;max-width:440px;width:100%;text-align:center}.card h1{font-size:1.75rem;margin-bottom:12px;color:var(--text);font-weight:700}.sub{color:var(--text-sub);margin-bottom:26px;line-height:1.6;font-size:.95rem}.card ul{list-style:none;text-align:left;margin-bottom:26px}.card ul li{padding:5px 0;color:var(--text-sub);font-size:.92rem}.btn{background:var(--bg);color:var(--primary);border:none;border-radius:var(--radius-full);padding:15px 32px;font-size:1rem;font-weight:700;cursor:pointer;width:100%;box-shadow:var(--raised);transition:box-shadow .15s;font-family:var(--font);letter-spacing:.3px}.btn:hover:not(:disabled){box-shadow:var(--raised-sm)}.btn:active:not(:disabled){box-shadow:var(--inset-sm)}.btn:disabled{opacity:.5;cursor:not-allowed}.err{color:var(--danger);margin-top:12px;font-size:.88rem;display:none}.index-langs{display:flex;justify-content:center;gap:6px;margin-top:22px;padding-top:18px;border-top:1px solid var(--dark)}body.room-page{height:100vh;height:100dvh;display:flex;flex-direction:column;background:var(--bg);font-family:var(--font);overflow:hidden;width:100%}.header{background:var(--bg);padding:12px 16px;display:flex;align-items:center;gap:12px;box-shadow:0 4px 10px var(--dark),0 -1px 0 var(--light);z-index:10;flex-shrink:0;border-radius:51px;box-shadow:var(--raised-sm)}.header-info{flex:1;min-width:0}.header-title{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.1rem;color:var(--text)}.ws-dot{width:8px;height:8px;border-radius:50%;background:#ffb300;flex-shrink:0}.ws-dot.connected{background:#43a047}.ws-dot.connecting{background:#ffb300}.ws-dot.disconnected{background:#e53935}.p2p-badge{font-size:.75rem;font-weight:700;color:#fff;background:#2ecc71;padding:1px 7px;border-radius:var(--radius-full);box-shadow:var(--raised-xs);cursor:default;-webkit-user-select:none;user-select:none;letter-spacing:.02em}.online-count{font-size:.82rem;color:var(--primary);font-weight:700;background:var(--bg);padding:2px 10px;border-radius:var(--radius-full);box-shadow:var(--inset-sm);border:none;cursor:pointer;font-family:var(--font);transition:box-shadow .12s}.online-count:active{box-shadow:var(--raised-xs)}.online-list{list-style:none;margin:0 0 4px;display:flex;flex-direction:column;gap:6px}.online-list-item{display:flex;align-items:center;gap:10px;font-size:1rem;color:var(--text);font-weight:500;padding:8px 12px;border-radius:var(--radius-md);box-shadow:var(--raised-xs);background:var(--bg)}.online-dot{width:9px;height:9px;border-radius:50%;background:#43a047;flex-shrink:0;box-shadow:0 0 0 2px #43a04740}.header-link{display:flex;align-items:center;gap:6px;margin-top:4px}.room-url{font-size:.68rem;color:var(--text-sub);padding:3px 10px;border-radius:var(--radius-full);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:monospace;box-shadow:var(--inset-sm);background:var(--bg)}.copy-btn{background:var(--bg);border:none;border-radius:var(--radius-full);padding:3px 12px;font-size:.68rem;cursor:pointer;color:var(--primary);font-weight:700;white-space:nowrap;box-shadow:var(--raised-xs);transition:box-shadow .12s;font-family:var(--font)}.copy-btn:hover{box-shadow:var(--raised-sm)}.copy-btn:active{box-shadow:var(--inset-sm)}.copy-btn.copied{color:#43a047}.timer-box{text-align:right;min-width:76px;flex-shrink:0}.timer-label{font-size:.64rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.timer-value{font-size:.9rem;font-weight:700;color:#ffa000}.timer-value.inf{color:#43a047}.menu-wrap{position:relative}.menu-btn{background:var(--bg);border:none;cursor:pointer;font-size:1.4rem;padding:6px 9px;border-radius:var(--radius-full);color:var(--text-sub);line-height:1;box-shadow:var(--raised-xs);transition:box-shadow .12s}.menu-btn:hover{box-shadow:var(--raised-sm)}.menu-btn:active{box-shadow:var(--inset-sm)}.dropdown{position:absolute;right:0;top:calc(100% + 8px);background:var(--bg);border-radius:var(--radius-lg);box-shadow:var(--raised);z-index:100;min-width:230px;overflow:hidden;display:none;padding:6px 0}.dropdown.open{display:block}.menu-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:99;display:none}.menu-overlay.open{display:block}.dropdown-item{display:block;width:100%;padding:13px 20px;background:none;border:none;text-align:left;cursor:pointer;font-size:.95rem;color:var(--text);font-family:var(--font);transition:color .12s}.dropdown-item:active{color:var(--primary)}.dropdown-item.red{color:var(--danger)}.dropdown-item-toggle{display:flex;align-items:center;justify-content:space-between;padding:11px 20px;cursor:pointer}.dropdown-item-toggle input[type=checkbox]{display:none}.dropdown-sep{height:1px;background:var(--dark);margin:4px 0}.dropdown-langs{display:flex;align-items:center;justify-content:space-around;padding:8px 12px;gap:4px}.lang-btn{flex:1;background:none;border:none;cursor:pointer;font-size:1.35rem;border-radius:var(--radius-sm);padding:5px 2px;transition:box-shadow .15s,opacity .15s;opacity:.55;font-family:var(--font)}.lang-btn:hover{opacity:.85}.lang-btn.active{opacity:1;box-shadow:var(--raised-xs)}.lang-btn .lang-code{display:block;font-size:.58rem;color:var(--text-sub);font-weight:600;letter-spacing:.02em;text-align:center;margin-top:1px}.messages{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:6px;min-height:0}.empty-hint{text-align:center;color:var(--text-muted);margin-top:60px;font-size:.95rem}.sys-msg{display:flex;align-items:center;justify-content:center;margin:6px auto;max-width:fit-content;font-size:.85rem;font-style:normal;color:var(--text-sub);font-weight:500;background:var(--bg);border-radius:var(--radius-full);padding:4px 14px;box-shadow:var(--inset-sm);white-space:nowrap}.sys-time{font-size:.7rem;margin-left:6px;opacity:.7}.msg-row{display:flex;align-items:flex-end;gap:8px}.msg-row.mine{flex-direction:row-reverse}.avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:700;color:#fff;flex-shrink:0;box-shadow:var(--raised-xs)}.msg-col{max-width:78%;display:flex;flex-direction:column}.msg-row.mine .msg-col{align-items:flex-end}.msg-sender{font-size:.82rem;color:var(--primary);font-weight:700;margin-bottom:4px;padding-left:14px}.bubble{border-radius:22px 22px 22px 6px;background:var(--bg);color:var(--text);padding:10px 16px;font-size:1.05rem;line-height:1.5;word-break:break-word;box-shadow:var(--raised-sm)}.msg-row.mine .bubble{border-radius:22px 22px 6px;color:#af9044}.msg-time{font-size:.75rem;color:var(--text-muted);margin-top:4px;padding:0 6px;display:flex;align-items:center;gap:3px}.msg-row.mine .msg-time{justify-content:flex-end}.read-tick{font-size:.67rem;color:var(--text-muted)}.read-tick.read{color:#b39b3e}.date-sep{display:flex;align-items:center;justify-content:center;padding:10px 0 6px}.date-sep span{font-size:.72rem;color:var(--text-sub);font-weight:600;background:var(--bg);border-radius:var(--radius-full);padding:4px 16px;box-shadow:var(--inset-sm);white-space:nowrap}.file-card{display:flex;align-items:center;gap:10px;background:var(--bg);border-radius:var(--radius-md);padding:10px 14px;min-width:180px;text-decoration:none;color:inherit;box-shadow:var(--raised-xs)}.msg-row.mine .file-card{box-shadow:var(--inset-sm);background:var(--primary-dim)}.file-icon{font-size:1.8rem;flex-shrink:0}.file-info{flex:1;min-width:0}.file-name{font-size:.88rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}.file-size{font-size:.78rem;color:var(--text-sub)}.file-dl{font-size:1rem;color:var(--text-muted)}.preview-img{max-width:260px;max-height:200px;border-radius:var(--radius-sm);display:block;cursor:zoom-in;box-shadow:var(--raised-sm);transition:box-shadow .15s}.preview-img:hover{box-shadow:var(--raised)}.preview-video{max-width:260px;max-height:200px;border-radius:var(--radius-sm);display:block;box-shadow:var(--raised-sm)}.file-caption{font-size:.76rem;margin-top:4px}.file-caption a,.msg-row.mine .file-caption a{color:var(--primary)}.upload-bar{background:var(--bg);padding:6px 16px;flex-shrink:0;box-shadow:inset 0 1px 0 var(--dark)}.upload-label{font-size:.82rem;color:var(--text-sub);margin-bottom:4px;text-align:center}.progress-track{background:var(--bg);border-radius:var(--radius-full);height:6px;max-width:300px;margin:0 auto;overflow:hidden;box-shadow:var(--inset-sm)}.progress-fill{background:var(--primary);height:100%;border-radius:var(--radius-full);transition:width .3s}.typing-bar{display:flex;align-items:center;gap:8px;padding:4px 16px 6px;background:var(--bg);flex-shrink:0;min-height:30px}.typing-text{font-size:.78rem;color:var(--text-muted)}.typing-dots{display:flex;gap:4px;align-items:center}.typing-dots span{width:7px;height:7px;border-radius:50%;background:var(--bg);box-shadow:var(--raised-xs);animation:typingBounce 1.3s ease-in-out infinite}.typing-dots span:nth-child(2){animation-delay:.18s}.typing-dots span:nth-child(3){animation-delay:.36s}@keyframes typingBounce{0%,80%,to{transform:translateY(0);box-shadow:var(--raised-xs)}40%{transform:translateY(-5px);box-shadow:var(--raised-sm)}}.input-area{background:var(--bg);box-shadow:0 -4px 10px var(--dark),0 1px 0 var(--light);padding:10px 14px;padding-bottom:calc(10px + env(safe-area-inset-bottom));flex-shrink:0;border-radius:51px;box-shadow:var(--raised-sm)}.input-row{display:flex;align-items:flex-end;gap:8px}.plus-wrap{position:relative;flex-shrink:0}.plus-btn{background:var(--bg);color:var(--primary);border:none;border-radius:50%;width:42px;height:42px;font-size:1.5rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--raised-sm);transition:box-shadow .12s;font-family:var(--font)}.plus-btn:hover{box-shadow:var(--raised)}.plus-btn:active{box-shadow:var(--inset-sm)}.plus-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:98}.plus-menu{position:absolute;bottom:calc(100% + 10px);right:0;background:var(--bg);border-radius:var(--radius-lg);box-shadow:var(--raised);z-index:99;min-width:210px;overflow:hidden;display:flex;flex-direction:column;padding:6px 0}.plus-item{display:flex;align-items:center;gap:10px;padding:13px 18px;background:none;border:none;font-size:1rem;color:var(--text);cursor:pointer;font-family:var(--font);text-align:left;width:100%;transition:color .1s}.plus-item:active{color:var(--primary)}.plus-item-name{flex-direction:column;align-items:stretch;gap:6px;padding:10px 18px 12px;border-bottom:1px solid var(--dark);border-top:1px solid var(--dark)}.plus-name-label{font-size:.7rem;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.plus-name-field{display:flex;align-items:center;justify-content:space-between;background:var(--bg);border-radius:var(--radius-sm);box-shadow:var(--inset-sm);padding:8px 12px;gap:8px;transition:box-shadow .15s}.plus-item-name:hover .plus-name-field{box-shadow:var(--inset)}.plus-name-val{font-size:.95rem;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.plus-name-edit{font-size:.85rem;flex-shrink:0}.plus-item-toggle{cursor:pointer;justify-content:space-between}.plus-item-toggle input[type=checkbox]{display:none}.toggle-pill{width:40px;height:22px;border-radius:var(--radius-full);background:var(--bg);box-shadow:var(--inset-sm);display:inline-block;position:relative;flex-shrink:0;transition:background .2s}.toggle-pill:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--text-muted);box-shadow:var(--raised-xs);transition:transform .2s,background .2s}.toggle-pill.on{background:#5c6bc01f}.toggle-pill.on:after{transform:translate(18px);background:var(--primary)}.name-avatar{border:none;border-radius:var(--radius-full);height:40px;padding:0 12px;cursor:pointer;font-size:.82rem;font-weight:600;color:var(--text);flex-shrink:0;background:var(--bg);box-shadow:var(--raised-sm);transition:box-shadow .15s;display:flex;align-items:center;gap:5px;max-width:140px;font-family:var(--font)}.name-avatar:active{box-shadow:var(--inset-sm)}.name-avatar:hover{box-shadow:var(--raised)}.name-avatar-icon{font-size:.9rem;flex-shrink:0}.name-avatar-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.name-avatar-edit{font-size:.7rem;flex-shrink:0;opacity:.6}textarea.msg-input{flex:1;border:none;border-radius:var(--radius-full);padding:11px 18px;resize:none;outline:none;line-height:1.4;max-height:120px;overflow-y:auto;font-family:var(--font);font-size:18px;background:var(--bg);color:var(--text);box-shadow:var(--inset);transition:box-shadow .15s}textarea.msg-input::placeholder{color:var(--text-muted)}textarea.msg-input:focus{box-shadow:var(--inset),0 0 0 2px #5c6bc026}.icon-btn{background:var(--bg);border:none;border-radius:50%;width:40px;height:40px;cursor:pointer;font-size:1.15rem;flex-shrink:0;display:flex;align-items:center;justify-content:center;box-shadow:var(--raised-sm);transition:box-shadow .12s}.icon-btn:hover{box-shadow:var(--raised)}.icon-btn:active{box-shadow:var(--inset-sm)}.send-btn{background:var(--bg);color:var(--primary);border:none;border-radius:50%;width:42px;height:42px;cursor:pointer;font-size:1.1rem;flex-shrink:0;display:flex;align-items:center;justify-content:center;box-shadow:var(--raised-sm);transition:box-shadow .15s;font-weight:700}.send-btn:hover:not(:disabled){box-shadow:var(--raised)}.send-btn:active:not(:disabled){box-shadow:var(--inset-sm)}.send-btn:disabled{color:var(--text-muted);box-shadow:var(--raised-xs);cursor:default}.modal-bg{position:fixed;top:0;right:0;bottom:0;left:0;background:#28283c59;display:none;align-items:center;justify-content:center;z-index:200;padding:20px;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.modal-bg.open{display:flex}.modal{background:var(--bg);border-radius:var(--radius-xl);padding:28px 24px;width:100%;max-width:360px;box-shadow:var(--raised)}.modal h3{margin-bottom:18px;font-size:1.1rem;color:var(--text);font-weight:700}.modal input{width:100%;border:none;border-radius:var(--radius-sm);padding:13px 16px;font-size:18px;outline:none;font-family:var(--font);color:var(--text);background:var(--bg);box-shadow:var(--inset)}.modal input:focus{box-shadow:var(--inset),0 0 0 2px #5c6bc026}.modal-btns{display:flex;gap:8px;margin-top:18px;justify-content:flex-end;flex-wrap:wrap}.modal-cancel{background:var(--bg);border:none;border-radius:var(--radius-full);padding:9px 18px;cursor:pointer;font-size:.9rem;color:var(--text-sub);font-family:var(--font);font-weight:600;box-shadow:var(--raised-xs);transition:box-shadow .12s}.modal-cancel:hover{box-shadow:var(--raised-sm)}.modal-cancel:active{box-shadow:var(--inset-sm)}.modal-save{background:var(--bg);color:var(--primary);border:none;border-radius:var(--radius-full);padding:9px 20px;cursor:pointer;font-size:.9rem;font-family:var(--font);font-weight:700;box-shadow:var(--raised-sm);transition:box-shadow .12s}.modal-save:hover{box-shadow:var(--raised)}.modal-save:active{box-shadow:var(--inset-sm)}.modal-remove{background:var(--bg);color:var(--danger);border:none;border-radius:var(--radius-full);padding:9px 20px;cursor:pointer;font-size:.9rem;font-family:var(--font);font-weight:700;box-shadow:var(--raised-sm);transition:box-shadow .12s}.modal-remove:active{box-shadow:var(--inset-sm)}.pin-status{font-size:.88rem;color:var(--text-sub);margin-bottom:16px;font-weight:500}.pin-status.set{color:#43a047}.toasts{position:fixed;bottom:80px;right:16px;display:flex;flex-direction:column;gap:8px;z-index:300;pointer-events:none}.toast{background:var(--bg);color:var(--text);border-radius:var(--radius-sm);padding:13px 18px;font-size:.88rem;box-shadow:var(--raised);max-width:300px;animation:fadeInUp .22s ease;font-family:var(--font);font-weight:600}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#pinScreen{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg);z-index:1000;display:none;align-items:center;justify-content:center}.pin-card{background:var(--bg);border-radius:var(--radius-xl);padding:40px 32px;width:100%;max-width:320px;text-align:center;box-shadow:var(--raised)}.pin-icon{font-size:2.6rem;margin-bottom:16px}.pin-card h2{font-size:1.25rem;margin-bottom:8px;color:var(--text);font-weight:700}.pin-card>p{color:var(--text-sub);font-size:.92rem;margin-bottom:24px}.pin-error{color:var(--danger);font-size:.85rem;min-height:1.2em;margin-bottom:10px;font-weight:500}.pin-input{width:100%;border:none;border-radius:var(--radius-md);padding:14px;font-size:22px;text-align:center;letter-spacing:12px;outline:none;margin-bottom:14px;font-family:monospace;background:var(--bg);color:var(--text);box-shadow:var(--inset);transition:box-shadow .15s}.pin-input:focus{box-shadow:var(--inset),0 0 0 2px #5c6bc026}.pin-input.error{box-shadow:var(--inset),0 0 0 2px #c6282840}.pin-submit{width:100%;background:var(--bg);color:var(--primary);border:none;border-radius:var(--radius-full);padding:14px;font-size:1rem;font-weight:700;cursor:pointer;box-shadow:var(--raised-sm);transition:box-shadow .15s;font-family:var(--font)}.pin-submit:hover:not(:disabled){box-shadow:var(--raised)}.pin-submit:active:not(:disabled){box-shadow:var(--inset-sm)}.pin-submit:disabled{opacity:.45;cursor:not-allowed}.pin-back{display:block;margin-top:18px;color:var(--text-muted);font-size:.85rem;text-decoration:none}.pin-back:hover{color:var(--primary)}#expiredOverlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--bg);z-index:999;display:none;align-items:center;justify-content:center}.expired-card{text-align:center;background:var(--bg);border-radius:var(--radius-xl);padding:44px 32px;max-width:320px;width:100%;box-shadow:var(--raised)}.expired-icon{font-size:3.2rem;margin-bottom:18px}.expired-card h2{margin-bottom:12px;font-size:1.3rem;font-weight:700;color:var(--text)}.expired-card p{color:var(--text-sub);margin-bottom:28px;font-size:.92rem;line-height:1.55}.expired-card a{background:var(--bg);color:var(--primary);border:none;border-radius:var(--radius-full);padding:13px 36px;font-size:.97rem;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block;box-shadow:var(--raised-sm);transition:box-shadow .15s}.expired-card a:hover{box-shadow:var(--raised)}.expired-card a:active{box-shadow:var(--inset-sm)}.pin-option{margin-bottom:22px;text-align:left}.pin-toggle{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--text-sub);cursor:pointer;-webkit-user-select:none;user-select:none;margin-bottom:10px;font-weight:500}.pin-create-input{width:100%;border:none;border-radius:var(--radius-md);padding:12px 16px;font-size:18px;letter-spacing:8px;font-family:monospace;text-align:center;outline:none;background:var(--bg);color:var(--text);box-shadow:var(--inset);transition:box-shadow .15s;margin-top:6px}.pin-create-input:focus{box-shadow:var(--inset),0 0 0 2px #5c6bc026}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--dark);border-radius:var(--radius-full)}@media (min-width: 600px){body.room-page{max-width:780px;margin:0 auto}.msg-col{max-width:68%}.preview-img,.preview-video{max-width:340px;max-height:240px}.sys-msg{font-size:16px!important}}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;z-index:500;background:#000000e0;display:flex;align-items:center;justify-content:center;padding:20px;cursor:zoom-out;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:fadeInLightbox .18s ease}.lightbox img{max-width:100%;max-height:100%;border-radius:var(--radius-sm);box-shadow:0 8px 40px #000000b3;cursor:default;object-fit:contain;animation:scaleInLightbox .18s ease}.lightbox-close{position:absolute;top:16px;right:16px;background:#ffffff26;border:none;color:#fff;font-size:1.3rem;width:44px;height:44px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:background .15s;line-height:1}.lightbox-close:hover{background:#ffffff47}@keyframes fadeInLightbox{0%{opacity:0}to{opacity:1}}@keyframes scaleInLightbox{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}body.direct-page{min-height:100dvh;background:var(--bg);font-family:var(--font);display:flex;align-items:flex-start;justify-content:center;padding:16px}.direct-wrap{width:100%;max-width:520px;padding-top:16px}.direct-card{background:var(--bg);border-radius:var(--radius-xl);box-shadow:var(--raised);padding:28px 24px;display:flex;flex-direction:column;gap:18px}.direct-header{display:flex;align-items:center;gap:12px}.direct-header h2{font-size:1.25rem;font-weight:700;color:var(--text)}.direct-back-btn{background:var(--bg);border:none;box-shadow:var(--raised-sm);border-radius:var(--radius-sm);width:38px;height:38px;cursor:pointer;font-size:1.1rem;color:var(--text);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:box-shadow .12s}.direct-back-btn:active{box-shadow:var(--inset-sm)}.direct-desc{font-size:.9rem;color:var(--text-sub);margin-top:-8px}.direct-name-row{display:flex;align-items:center;gap:10px}.direct-name-row label{font-size:.85rem;color:var(--text-sub);white-space:nowrap}.direct-name-input{flex:1;background:var(--bg);border:none;box-shadow:var(--inset-sm);border-radius:var(--radius-sm);padding:8px 12px;font-size:1rem;color:var(--text);font-family:var(--font);outline:none}.btn-p2p{background:var(--bg);color:var(--primary);font-size:.95rem;margin-top:6px;box-shadow:var(--raised-sm)}.btn-p2p:hover{box-shadow:var(--raised)}.direct-btn{width:100%}.direct-steps{display:flex;flex-direction:column;gap:20px}.direct-step{display:flex;gap:14px;align-items:flex-start}.direct-step-badge{width:32px;height:32px;border-radius:50%;background:var(--primary);color:#fff;font-size:.85rem;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:var(--raised-xs)}.direct-step-body{flex:1;display:flex;flex-direction:column;gap:8px}.direct-step-title{font-weight:600;color:var(--text);font-size:.95rem}.direct-code-box{position:relative}.direct-code{width:100%;background:var(--bg);border:none;box-shadow:var(--inset-sm);border-radius:var(--radius-sm);padding:10px 12px;font-size:.75rem;color:var(--text-sub);font-family:monospace;resize:none;outline:none;word-break:break-all}.direct-code-input{color:var(--text);font-size:.85rem}.direct-copy-btn{width:100%;padding:9px;border:none;border-radius:var(--radius-sm);background:var(--bg);box-shadow:var(--raised-sm);color:var(--primary);font-weight:600;font-size:.9rem;cursor:pointer;font-family:var(--font);transition:box-shadow .12s,color .12s}.direct-copy-btn:active{box-shadow:var(--inset-sm)}.direct-copy-btn.ok{color:#27ae60}.direct-hint{font-size:.8rem;color:var(--text-muted)}.direct-err{font-size:.85rem;color:var(--danger)}.direct-loading{display:flex;flex-direction:column;align-items:center;gap:12px;padding:16px 0}.direct-spinner{width:36px;height:36px;border-radius:50%;border:3px solid var(--dark);border-top-color:var(--primary);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.direct-error-box{background:var(--bg);border-radius:var(--radius-md);box-shadow:var(--inset-sm);padding:16px;display:flex;flex-direction:column;gap:12px;color:var(--danger);font-size:.9rem}body.direct-page .direct-chat{display:flex;flex-direction:column;height:100dvh;width:100%;max-width:600px;margin:0 auto}.direct-chat-header{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--bg);box-shadow:0 4px 10px var(--dark),0 -1px 0 var(--light);flex-shrink:0}.direct-chat-title{font-weight:700;color:var(--text);font-size:1rem;flex:1}.direct-messages{flex:1;overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:8px}.direct-sys{text-align:center;font-size:.8rem;color:var(--text-muted);background:var(--bg);box-shadow:var(--raised-xs);padding:4px 12px;border-radius:var(--radius-full);align-self:center}.direct-bubble{max-width:78%;display:flex;flex-direction:column;gap:2px;background:var(--bg);border-radius:var(--radius-md);padding:8px 12px;box-shadow:var(--raised-sm)}.direct-bubble.out{align-self:flex-end;box-shadow:var(--inset-sm);color:var(--primary)}.direct-bubble.in{align-self:flex-start}.direct-bubble-name{font-size:.72rem;color:var(--text-sub);font-weight:600}.direct-bubble-text{font-size:1rem;color:inherit;word-break:break-word}.direct-bubble-time{font-size:.68rem;color:var(--text-muted);align-self:flex-end}.direct-input-row{display:flex;gap:8px;padding:10px 12px;background:var(--bg);box-shadow:0 -4px 10px var(--dark),0 1px 0 var(--light);flex-shrink:0}.direct-input{flex:1;background:var(--bg);border:none;box-shadow:var(--inset-sm);border-radius:var(--radius-md);padding:10px 14px;font-size:1rem;color:var(--text);font-family:var(--font);outline:none}.rc-panel{flex-shrink:0;background:var(--bg);border-top:2px solid var(--danger);padding:14px 16px;display:flex;flex-direction:column;gap:8px;max-height:60dvh;overflow-y:auto}.rc-title{font-weight:700;color:var(--danger);font-size:.95rem}.rc-hint{font-size:.8rem;color:var(--text-muted)}.rc-label{font-size:.85rem;color:var(--text-sub);font-weight:600}.rc-btns,.rc-body{display:flex;flex-direction:column;gap:8px}.rc-btn{width:100%}.p2p-badge{font-size:.65rem;font-weight:700;letter-spacing:.05em;background:var(--primary);color:#fff;padding:3px 8px;border-radius:var(--radius-full);flex-shrink:0}.p2p-badge-off{background:var(--danger)}.direct-input:disabled{opacity:.45;cursor:not-allowed}