:root{color:#071224;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;line-height:1.4}*{box-sizing:border-box}html{min-height:100%}body{min-height:100%;margin:0}button,input{letter-spacing:0}button,a,input{font-family:inherit}svg{display:block}#root{min-height:100svh}.app{--bg-top:#f8fbff;--bg-mid:#e8f2fc;--bg-bottom:#f5f8fd;--surface:#fafdffe0;--surface-strong:#f8fbff;--surface-soft:#ffffffa8;--ink:#071224;--ink-soft:#4f5f74;--muted:#7f8ca0;--navy:#061429;--navy-2:#0c1d38;--blue:#98b7d7;--orange:#ff9b42;--green:#42c78b;--line:#6f88a82e;--white-shadow:#fffffff0;--soft-shadow:#455b7738;--deep-shadow:#0712242e;color:var(--ink);min-height:100svh;padding:max(20px, env(safe-area-inset-top)) 24px max(24px, env(safe-area-inset-bottom));background:linear-gradient(120deg, #fffc, #d6e7f780 48%, #ffffffbd), linear-gradient(145deg, var(--bg-top) 0%, var(--bg-mid) 52%, var(--bg-bottom) 100%);overflow:hidden auto}.topbar{z-index:2;justify-content:space-between;align-items:center;max-width:1180px;margin:0 auto 22px;display:flex;position:relative}.brand,.internet-pill{border:1px solid #ffffffb3;border-radius:999px;align-items:center;min-height:48px;display:inline-flex;box-shadow:10px 16px 26px #596d8729,-8px -8px 20px #ffffffe0,inset 1px 1px 1px #ffffffe6}.brand{color:var(--ink);background:#fafdffbf;gap:11px;padding:6px 18px 6px 8px;font-size:17px;font-weight:800}.brand-icon{background:var(--navy);color:#fff;border-radius:999px;justify-content:center;align-items:center;width:58px;height:36px;display:inline-flex;position:relative}.brand-icon svg{stroke-width:2.3px;width:18px;height:18px}.brand-icon svg+svg{margin-left:-3px}.internet-pill{color:var(--ink-soft);background:#fafdff8c;gap:8px;padding:0 18px;font-size:14px;font-weight:750}.internet-pill svg{width:18px;height:18px}.workspace{z-index:1;grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr);gap:24px;max-width:1180px;min-height:calc(100svh - 118px);margin:0 auto;display:grid;position:relative}.hero-panel,.files-panel{background:var(--surface);border:1px solid #ffffffb3;border-radius:42px;position:relative;overflow:hidden;box-shadow:24px 34px 54px #4c617e38,-18px -18px 34px #ffffffdb,inset 1px 1px #ffffffe0,inset -1px -1px #576f8c14}.hero-panel:after,.files-panel:after{content:"";opacity:.55;filter:blur(1px);background:linear-gradient(90deg,#0000,#ff9b42c7,#0000);height:2px;position:absolute;bottom:35%;left:18%;right:18%}.hero-panel{align-content:start;gap:24px;padding:40px;display:grid}.files-panel{flex-direction:column;padding:28px;display:flex}.hero-copy{z-index:1;justify-content:space-between;align-items:end;gap:18px;display:flex;position:relative}.hero-copy h1{color:var(--ink);max-width:570px;margin:0;font-size:54px;font-weight:850;line-height:.98}.hero-status{background:var(--surface-soft);color:var(--ink-soft);border-radius:999px;flex:none;align-items:center;gap:8px;min-height:38px;padding:0 14px;font-size:13px;font-weight:800;display:inline-flex;box-shadow:inset 4px 4px 10px #7489a31c,inset -5px -5px 12px #fffffff2}.status-dot{background:#aab7c7;border-radius:999px;width:8px;height:8px;box-shadow:0 0 0 4px #aab7c72e}.status-dot.is-online{background:var(--green);box-shadow:0 0 0 4px #42c78b2e}.room-console{z-index:1;background:#f7fbffa3;border:1px solid #ffffff9e;border-radius:34px;gap:22px;padding:22px;display:grid;position:relative;box-shadow:inset 8px 8px 18px #5c73901a,inset -10px -10px 24px #ffffffe0}.create-row{grid-template-columns:210px minmax(0,1fr);gap:16px;display:grid}.primary-action,.join-control,.path-tile,.upload-button,.device-field,.share-card,.search-bar,.filter-chip,.file-row,.empty-state,.icon-button,.mini-button,.notice,.panel-foot{border:1px solid #ffffffb8;box-shadow:12px 16px 26px #5269852e,-8px -8px 18px #ffffffeb,inset 1px 1px 1px #ffffffeb}button,input,a{-webkit-tap-highlight-color:transparent}button,a{transition:transform .17s,box-shadow .17s,background .17s,color .17s,opacity .17s}button{color:inherit;cursor:pointer;font:inherit}button:disabled,a[aria-disabled=true]{cursor:not-allowed;opacity:.48}button:not(:disabled):active,a:active{transform:translateY(1px)}.primary-action{background:var(--navy);color:#fff;border-color:#030d1d33;border-radius:999px;justify-content:center;align-items:center;gap:10px;min-height:58px;padding:0 18px;font-size:15px;font-weight:850;display:inline-flex}.primary-action svg{stroke-width:2.5px;width:20px;height:20px}.primary-action svg:last-child{width:18px;height:18px;margin-left:auto}.join-control{background:var(--surface-strong);border-radius:999px;align-items:center;min-width:0;padding:0 8px 0 22px;display:flex}.join-control input,.search-bar input,.device-field input{color:var(--ink);font:inherit;background:0 0;border:0;outline:0;width:100%;min-width:0;font-weight:760}.join-control input::placeholder,.search-bar input::placeholder{color:#536174;opacity:1}.join-control button{color:var(--ink);background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;width:46px;height:46px;display:inline-flex}.join-control button svg{stroke-width:2.3px;width:25px;height:25px}.path-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;display:grid}.path-tile{color:#4b5564;text-align:center;background:#f9fbfde6;border-radius:28px;grid-template-columns:1fr auto;align-items:center;min-height:126px;padding:18px;display:grid}.path-tile>svg:first-child{color:#6d737c;filter:drop-shadow(0 6px 6px #3740482e);stroke-width:2.4px;grid-column:1/-1;justify-self:center;width:42px;height:42px}.path-tile:nth-child(2)>svg:first-child{color:#eaa52e;fill:#eaa52ed1;stroke:#d9901c}.path-tile span{grid-column:1/2;justify-self:center;font-size:20px;font-weight:760}.path-tile>svg:last-child{color:#505966;stroke-width:3px;justify-self:end;width:28px;height:28px}.transfer-panel{z-index:1;grid-template-columns:minmax(0,1fr) 170px;gap:16px;display:grid;position:relative}.drop-zone{background:#f9fcffad;border:1px dashed #2639523d;border-radius:28px;grid-template-columns:1fr;align-items:center;gap:16px;min-height:118px;padding:18px;display:grid;position:relative;box-shadow:inset 8px 8px 18px #50668014,inset -9px -9px 20px #ffffffd9}.drop-zone.is-dragging{border-color:#ff9b42c7;box-shadow:0 0 0 6px #ff9b421c,inset 8px 8px 18px #50668014,inset -9px -9px 20px #ffffffd9}.drop-zone input[type=file]{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.upload-button{background:var(--navy);color:#fff;border-color:#030d1d33;border-radius:999px;justify-content:center;align-items:center;gap:9px;width:100%;min-height:58px;padding:0 18px;font-size:15px;font-weight:820;display:inline-flex}.upload-button svg{width:21px;height:21px}.drop-meta{gap:4px;min-width:0;display:grid}.drop-meta strong{color:var(--ink);font-size:18px;line-height:1.1}.drop-meta span{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:720;overflow:hidden}.progress-track{background:#0a182c1f;border-radius:999px;height:7px;position:absolute;bottom:13px;left:18px;right:18px;overflow:hidden}.progress-track span{background:linear-gradient(90deg, var(--orange), #ffc064);border-radius:inherit;height:100%;display:block}.device-field{background:#f9fcffc7;border-radius:28px;align-items:center;gap:10px;min-width:0;padding:0 16px;display:flex}.device-field svg{color:var(--navy);flex:none;width:22px;height:22px}.device-field input{min-height:56px;font-size:16px}.files-head{z-index:1;justify-content:space-between;align-items:center;margin-bottom:18px;display:flex;position:relative}.files-head h2{color:var(--ink);margin:0 0 6px;font-size:32px;font-weight:850;line-height:1}.files-head p{color:var(--muted);margin:0;font-size:14px;font-weight:760}.icon-button,.mini-button{color:var(--ink);background:#f9fcffd1;border-radius:999px;flex:none;justify-content:center;align-items:center;width:44px;height:44px;text-decoration:none;display:inline-flex}.icon-button svg,.mini-button svg{stroke-width:2.5px;width:19px;height:19px}.icon-button.ghost{color:#7f8ca0}.share-card{z-index:1;background:#f9fcffbd;border-radius:30px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;margin-bottom:18px;padding:18px;display:grid;position:relative}.share-code{grid-template-columns:auto 1fr auto;align-items:center;gap:10px;min-width:0;display:grid}.share-code span{color:var(--muted);font-size:14px;font-weight:800}.share-code strong{color:var(--ink);white-space:nowrap;font-size:31px;font-weight:900;line-height:1}.mini-button{border:0;width:38px;height:38px}.qr-wrap{background:#fff;border-radius:22px;justify-content:center;align-items:center;width:124px;height:124px;display:flex;overflow:hidden;box-shadow:inset 1px 1px #fffffff5,8px 10px 20px #38506e29}.qr-wrap canvas{display:block}.qr-placeholder{color:#8c9bb0;justify-content:center;align-items:center;display:flex}.qr-placeholder svg{width:34px;height:34px}.search-bar{background:var(--navy);color:#fff;z-index:1;border-color:#030d1d40;border-radius:999px;align-items:center;min-height:66px;padding:0 22px;display:flex;position:relative}.search-bar input{color:#fff;font-size:17px}.search-bar input::placeholder{color:#ffffffc2}.search-bar svg{stroke-width:2.4px;flex:none;width:28px;height:28px}.filter-row{z-index:1;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:18px 0;display:grid;position:relative}.filter-chip{color:#233147;background:#f9fcffc7;border-radius:999px;min-height:44px;padding:0 12px;font-size:13px;font-weight:840}.filter-chip.is-active{background:var(--navy);color:#fff;border-color:#030d1d40}.notice{color:var(--ink-soft);z-index:1;background:#f9fcffb8;border-radius:20px;margin-bottom:14px;padding:12px 14px;font-size:14px;font-weight:780;position:relative}.hero-notice{color:var(--ink-soft);z-index:1;background:#f9fcffc7;border:1px solid #ffffffb8;border-radius:999px;padding:12px 16px;font-size:14px;font-weight:820;position:relative;box-shadow:10px 14px 24px #52698524,-8px -8px 18px #ffffffd6,inset 1px 1px 1px #ffffffe6}.hero-notice.good{color:#156646}.hero-notice.bad{color:#a33737}.notice.good{color:#156646}.notice.bad{color:#a33737}.file-list{z-index:1;gap:12px;min-height:0;padding:2px 2px 8px;display:grid;position:relative;overflow:auto}.file-row{background:#f9fcffc7;border-radius:24px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;min-height:78px;padding:12px;display:grid}.file-kind{color:var(--navy);background:linear-gradient(#fff,#eaf2fb);border-radius:19px;justify-content:center;align-items:center;width:54px;height:54px;display:flex;box-shadow:inset 1px 1px #ffffffe6,6px 8px 16px #4a607c26}.file-kind svg{stroke-width:2.2px;width:25px;height:25px}.file-info{gap:4px;min-width:0;display:grid}.file-info strong{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:840;overflow:hidden}.file-info span{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:720;overflow:hidden}.file-actions{gap:8px;display:flex}.empty-state{color:var(--ink-soft);text-align:center;background:#f9fcff9e;border-radius:30px;place-items:center;gap:8px;min-height:220px;padding:28px;display:grid}.empty-state svg{color:var(--navy);width:34px;height:34px;margin-bottom:4px}.empty-state strong{color:var(--ink);font-size:20px}.empty-state span{color:var(--muted);font-size:14px;font-weight:720}.panel-foot{color:var(--muted);z-index:1;background:#f9fcffa8;border-radius:999px;align-items:center;gap:9px;min-height:48px;margin-top:auto;padding:0 8px 0 16px;font-size:13px;font-weight:800;display:flex;position:relative}.panel-foot svg{color:var(--navy);flex:none;width:17px;height:17px}.panel-foot span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.panel-foot button{background:var(--navy);color:#fff;border:0;border-radius:999px;min-height:36px;margin-left:auto;padding:0 14px;font-size:13px;font-weight:850}@media (hover:hover){button:not(:disabled):hover,a:hover{transform:translateY(-1px)}.path-tile:not(:disabled):hover,.file-row:hover,.share-card:hover{box-shadow:16px 22px 32px #52698533,-8px -8px 18px #ffffffeb,inset 1px 1px 1px #fffffff0}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (width<=1040px){.app{padding:max(16px, env(safe-area-inset-top)) 16px max(18px, env(safe-area-inset-bottom))}.workspace{grid-template-columns:1fr}.hero-panel,.files-panel{border-radius:34px}.hero-copy h1{font-size:42px}.files-panel{min-height:680px}}@media (width<=680px){.app{padding-left:12px;padding-right:12px}.topbar{margin-bottom:14px}.brand{min-height:44px;padding-right:14px}.internet-pill{min-height:44px;padding:0 13px;font-size:0}.internet-pill svg{width:19px;height:19px}.hero-panel,.files-panel{border-radius:30px}.hero-panel{gap:18px;padding:22px}.files-panel{padding:20px}.hero-copy{align-items:start;display:grid}.hero-copy h1{font-size:34px;line-height:1.02}.room-console{border-radius:28px;padding:16px}.create-row{grid-template-columns:1fr}.primary-action{min-height:56px}.path-strip{grid-template-columns:1fr;gap:12px}.path-tile{text-align:left;grid-template-columns:auto 1fr auto;min-height:76px;padding:12px 14px}.path-tile>svg:first-child{grid-column:auto;width:34px;height:34px}.path-tile span{justify-self:start;font-size:18px}.path-tile>svg:last-child{width:24px;height:24px}.transfer-panel,.drop-zone{grid-template-columns:1fr}.upload-button{width:100%}.device-field{min-height:58px}.files-head h2{font-size:28px}.share-card{border-radius:26px;grid-template-columns:1fr}.share-code strong{font-size:28px}.qr-wrap{justify-self:center}.search-bar{min-height:62px}.filter-row{scrollbar-width:none;gap:10px;margin:16px -2px;padding:2px;display:flex;overflow-x:auto}.filter-row::-webkit-scrollbar{display:none}.filter-chip{flex:none;min-width:92px}.file-row{grid-template-columns:auto minmax(0,1fr)}.file-actions{grid-column:2/3;justify-content:end}.panel-foot{border-radius:24px}}