.theme-toggle{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;background:transparent;color:var(--text-muted);border:1px solid transparent;transition:color .15s,background .15s,border-color .15s;flex-shrink:0}.theme-toggle:hover{color:var(--text);background:var(--surface2);border-color:var(--border)}.theme-toggle.landing-theme-toggle{position:fixed;top:1rem;right:1rem;z-index:20;background:var(--surface);border-color:var(--border-subtle);box-shadow:var(--shadow)}.theme-toggle.landing-theme-toggle:hover{border-color:var(--border)}.landing{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;background:var(--bg);background-image:radial-gradient(circle,var(--border) .5px,transparent .5px);background-size:24px 24px;cursor:default;-webkit-user-select:none;user-select:none}.landing-content{text-align:center;max-width:420px;width:100%;background:var(--surface);padding:2.5rem 2rem;border-radius:16px;border:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);overflow:hidden;cursor:default}.logo-row{display:flex;align-items:center;justify-content:center;gap:.65rem;margin-bottom:.4rem}.logo-icon{flex-shrink:0}.logo{font-size:3rem;font-weight:700;letter-spacing:-.03em;margin-bottom:0;-webkit-user-select:none;user-select:none;cursor:default;caret-color:transparent}.logo span{color:var(--accent)}.tagline,.hint,.divider{-webkit-user-select:none;user-select:none;cursor:default;caret-color:transparent}.tagline{color:var(--text-muted);font-size:1rem;margin-bottom:2rem}.btn-primary{width:100%;padding:.9rem 2rem;font-size:1.05rem;font-weight:600;background:var(--accent);color:#fff;border-radius:var(--radius);transition:background .15s,transform .1s}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-primary:active:not(:disabled){transform:scale(.98)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.divider{display:flex;align-items:center;gap:1rem;margin:1.5rem 0;color:var(--text-muted);font-size:.8rem}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--border)}.join-form{display:flex;flex-direction:column;gap:.6rem;width:100%}.code-input{width:100%;padding:.75rem 1rem;font-size:1.25rem;font-weight:600;letter-spacing:.2em;text-align:center;text-transform:uppercase;background:var(--surface2);border:1.5px solid var(--border);border-radius:var(--radius);color:var(--text);transition:border-color .15s;cursor:text;-webkit-user-select:text;user-select:text}.code-input:focus{border-color:var(--accent)}.btn-secondary{width:100%;padding:.75rem 1.25rem;font-size:.95rem;font-weight:600;background:var(--surface2);color:var(--text);border:1.5px solid var(--border);border-radius:var(--radius);transition:border-color .15s}.btn-secondary:hover:not(:disabled){border-color:var(--accent)}.btn-secondary:disabled{opacity:.4;cursor:not-allowed}.join-error{margin-bottom:1rem;padding:.65rem .85rem;background:var(--danger-soft);border:1px solid var(--danger);border-radius:8px;color:var(--danger);font-size:.85rem;line-height:1.4;text-align:left}.hint{margin-top:1.5rem;color:var(--text-muted);font-size:.8rem;line-height:1.6}.share-item{background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:.85rem 1rem;box-shadow:var(--shadow);transition:border-color .15s,opacity .25s,transform .25s;animation:itemIn .2s ease}.share-item:hover{border-color:var(--border)}.share-item.deleting{opacity:0;transform:scale(.97);pointer-events:none}@keyframes itemIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.item-header{display:flex;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.6rem}.item-type{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);flex-shrink:0;-webkit-user-select:none;user-select:none;cursor:default;caret-color:transparent}.item-toolbar{display:flex;align-items:center;margin-left:auto;flex-shrink:0}.item-toolbar-actions{display:flex;align-items:center;gap:.3rem;max-width:0;opacity:0;overflow:hidden;margin-right:0;transition:max-width .28s ease,opacity .22s ease,margin-right .28s ease}.share-item:hover .item-toolbar-actions,.share-item:focus-within .item-toolbar-actions{max-width:140px;opacity:1;margin-right:.5rem}.item-time{font-size:.7rem;color:var(--text-muted);white-space:nowrap;flex-shrink:0;transition:transform .28s ease,color .2s ease;-webkit-user-select:none;user-select:none;cursor:default;caret-color:transparent}.share-item:hover .item-time,.share-item:focus-within .item-time{transform:translate(-2px);color:var(--text-muted)}.action-btn{padding:.2rem .55rem;background:var(--surface2);color:var(--text);border:1px solid var(--border);border-radius:6px;font-size:.72rem;font-weight:500;white-space:nowrap;flex-shrink:0;transition:color .15s,border-color .15s,background .15s}.action-btn:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}.delete-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:transparent;color:var(--text-muted);border:1px solid transparent;border-radius:6px;flex-shrink:0;transition:color .15s,background .15s,border-color .15s}.delete-btn:hover{color:var(--danger);background:var(--danger-soft);border-color:var(--danger)}.share-item.text .item-content,.share-item.code .item-content{margin-top:.15rem}.item-content{white-space:pre-wrap;word-break:break-word;font-size:.9rem;line-height:1.65;max-height:400px;overflow-y:auto;padding:0;background:transparent;color:var(--text);cursor:text;-webkit-user-select:text;user-select:text;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 20%,transparent) transparent}.item-content::-webkit-scrollbar{width:4px}.item-content::-webkit-scrollbar-track{background:transparent}.item-content::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 22%,var(--border));border-radius:100px}.item-content::-webkit-scrollbar-button{display:none}.share-item.code .item-content{font-family:JetBrains Mono,monospace;font-size:.82rem;background:var(--surface2);padding:.75rem;border-radius:8px}.image-wrap{border-radius:8px;overflow:hidden;background:var(--surface2)}.item-image{width:100%;max-height:480px;object-fit:contain;display:block;cursor:pointer;transition:opacity .15s}.item-image:hover{opacity:.92}.item-footer{display:flex;justify-content:space-between;margin-top:.4rem;font-size:.75rem;color:var(--text-muted)}.file-card{display:flex;align-items:center;gap:.85rem;padding:.75rem;background:var(--surface2);border-radius:8px;text-decoration:none;color:var(--text);transition:background .15s}.file-card:hover{background:var(--border-subtle)}.file-icon{font-size:1.75rem}.file-info{flex:1;min-width:0}.file-name{display:block;font-weight:500;font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-size{font-size:.75rem;color:var(--text-muted)}.download-icon{font-size:1.1rem;color:var(--accent);font-weight:600}@media(max-width:768px){.item-toolbar-actions{max-width:140px;opacity:1;margin-right:.5rem}}.composer{position:sticky;bottom:0;padding:.75rem 1.5rem 1.25rem;background:linear-gradient(to top,var(--bg) 70%,transparent);z-index:20}.composer-inner{display:flex;align-items:flex-end;gap:.5rem;max-width:800px;margin:0 auto;padding:.5rem;background:var(--surface);border:1px solid var(--border);border-radius:14px;transition:border-color .2s,box-shadow .2s}.composer-inner:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px #6c5ce71f}.composer-attach{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:transparent;color:var(--text-muted);border-radius:10px;transition:color .15s,background .15s}.composer-attach:hover{color:var(--accent);background:var(--accent-soft)}.composer-input{flex:1;min-width:0;resize:none;border:none;background:transparent;color:var(--text);font-size:.95rem;line-height:1.5;padding:.5rem .25rem;max-height:200px;overflow-y:auto;cursor:text;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 20%,transparent) transparent}.composer-input::-webkit-scrollbar{width:4px}.composer-input::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 25%,var(--border));border-radius:100px}.composer-input::-webkit-scrollbar-track{background:transparent}.composer-input::placeholder{color:var(--text-muted);opacity:.85}.composer-send{flex-shrink:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:var(--accent);color:#fff;border-radius:10px;transition:background .15s,transform .1s}.composer-send:hover{background:var(--accent-hover)}.composer-send:active{transform:scale(.92)}.composer-hint{text-align:center;font-size:.72rem;color:var(--text-muted);margin-top:.5rem}@media(max-width:768px){.composer-hint{display:none}}.room{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;cursor:default}.room-validating{align-items:center;justify-content:center}.validating-msg{color:var(--text-muted);font-size:.9rem}.room-header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1.25rem;background:var(--header-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-subtle);position:sticky;top:0;z-index:10}.back-btn{background:none;color:var(--text-muted);font-size:1.2rem;padding:.4rem .5rem;border-radius:8px;transition:color .15s,background .15s}.back-btn:hover{color:var(--text);background:var(--surface2)}.room-code-area{flex:1;display:flex;align-items:center;gap:.75rem}.room-code{font-size:1.4rem;font-weight:700;letter-spacing:.12em;transition:color .15s;cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent}.room-code:hover{color:var(--accent)}.room-actions{display:flex;gap:.2rem}.icon-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:transparent;color:var(--text-muted);border:1px solid transparent;border-radius:8px;transition:color .15s,background .15s,border-color .15s}.icon-btn:hover{color:var(--text);background:var(--surface2);border-color:var(--border)}.icon-btn.active{color:var(--accent);background:var(--accent-soft);border-color:var(--accent)}.icon-btn.danger:hover{color:var(--danger);background:var(--danger-soft);border-color:var(--danger)}.header-end{display:flex;align-items:center;gap:.35rem;flex-shrink:0}.presence{display:flex;align-items:center;gap:.35rem;font-size:.8rem;color:var(--text-muted);font-weight:500}.presence-dot{width:7px;height:7px;border-radius:50%;background:var(--text-muted);opacity:.5}.presence-dot.active{background:var(--success);opacity:1;box-shadow:0 0 6px var(--success)}.presence-dot.online{background:var(--accent);opacity:1}.presence-dot.offline{background:var(--danger);opacity:.8;animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:.8}50%{opacity:.3}}.qr-panel{display:flex;flex-direction:column;align-items:center;padding:1.25rem;border-bottom:1px solid var(--border-subtle);animation:fadeIn .2s ease}.qr-panel img{border-radius:8px}.qr-panel p{margin-top:.5rem;color:var(--text-muted);font-size:.8rem}.upload-bar{margin:.5rem 1.5rem 0;height:4px;background:var(--surface2);border-radius:2px;overflow:hidden;position:relative;max-width:800px;margin-left:auto;margin-right:auto;width:calc(100% - 3rem)}.upload-bar-fill{height:100%;background:var(--accent);transition:width .15s;border-radius:2px}.upload-bar span{display:none}.feed-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;width:100%;scroll-behavior:smooth}.items-feed{display:flex;flex-direction:column;gap:.75rem;max-width:800px;width:100%;margin:0 auto;padding:1.5rem 1.25rem .5rem;min-height:100%;box-sizing:border-box}.empty-state{text-align:center;padding:5rem 1rem;color:var(--text-muted);-webkit-user-select:none;user-select:none;cursor:default;caret-color:transparent}.empty-icon{font-size:2rem;color:var(--accent);opacity:.4;margin-bottom:1rem}.empty-hint{margin-top:.35rem;font-size:.85rem;opacity:.7}.drop-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#6c5ce714;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:100;display:flex;align-items:center;justify-content:center}.drop-overlay-content{padding:2.5rem 3.5rem;border:2px dashed var(--accent);border-radius:var(--radius);font-size:1.15rem;font-weight:600;color:var(--accent);background:var(--surface);box-shadow:var(--shadow-lg)}.toast{position:fixed;bottom:7rem;left:50%;transform:translate(-50%);background:var(--text);color:var(--bg);padding:.5rem 1.25rem;border-radius:100px;font-size:.82rem;font-weight:500;box-shadow:var(--shadow-lg);z-index:200;animation:slideUp .2s ease;pointer-events:none}@keyframes slideUp{0%{opacity:0;transform:translate(-50%) translateY(8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000e6;z-index:300;display:flex;align-items:center;justify-content:center;padding:2rem;cursor:zoom-out}.lightbox img{max-width:95%;max-height:95%;border-radius:8px;object-fit:contain;cursor:default}.lightbox-close{position:absolute;top:1.5rem;right:1.5rem;width:36px;height:36px;background:#ffffff1a;color:#fff;border-radius:50%;font-size:1rem;display:flex;align-items:center;justify-content:center;transition:background .15s}.lightbox-close:hover{background:#fff3}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root,[data-theme=dark]{--bg: #09090b;--bg-editor: #0f0f12;--surface: #18181b;--surface2: #27272a;--border: #3f3f46;--border-subtle: #27272a;--text: #fafafa;--text-muted: #a1a1aa;--accent: #7c6ff0;--accent-hover: #6c5ce7;--accent-soft: rgba(108, 92, 231, .15);--success: #10b981;--danger: #ef4444;--danger-soft: rgba(239, 68, 68, .12);--header-bg: rgba(15, 15, 18, .92);--radius: 12px;--shadow: 0 1px 3px rgba(0,0,0,.3), 0 4px 12px rgba(0,0,0,.2);--shadow-lg: 0 8px 30px rgba(0,0,0,.4)}[data-theme=light]{--bg: #e8e8ec;--bg-editor: #dfe0e6;--surface: #f5f5f8;--surface2: #eaeaf0;--border: #b8b8c4;--border-subtle: #ccccd6;--text: #121218;--text-muted: #44445a;--accent: #5a4bd1;--accent-hover: #4f42c4;--accent-soft: rgba(90, 75, 209, .12);--danger-soft: rgba(239, 68, 68, .1);--header-bg: rgba(245, 245, 248, .95);--shadow: 0 1px 4px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.05);--shadow-lg: 0 4px 20px rgba(0,0,0,.1)}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;line-height:1.5;-webkit-font-smoothing:antialiased}body.editor-mode{background:var(--bg-editor);background-image:radial-gradient(circle,var(--border) .5px,transparent .5px);background-size:24px 24px;overflow:hidden;height:100%}html:has(body.editor-mode){overflow:hidden;height:100%}.scroll-subtle{scrollbar-width:thin;scrollbar-color:transparent transparent}.scroll-subtle:hover,.scroll-subtle:focus-within{scrollbar-color:color-mix(in srgb,var(--accent) 30%,transparent) transparent}.scroll-subtle::-webkit-scrollbar{width:5px}.scroll-subtle::-webkit-scrollbar-track{background:transparent}.scroll-subtle::-webkit-scrollbar-thumb{background:transparent;border-radius:100px}.scroll-subtle:hover::-webkit-scrollbar-thumb,.scroll-subtle:focus-within::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 28%,var(--border))}.scroll-subtle::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--accent) 45%,var(--border))}.scroll-subtle::-webkit-scrollbar-button{display:none;height:0;width:0}button{font-family:inherit;cursor:pointer;border:none;outline:none}input,textarea{font-family:inherit;outline:none;cursor:text}a{cursor:pointer}code,pre{font-family:JetBrains Mono,Fira Code,monospace}::selection{background:var(--accent);color:#fff}
