:root{--ink:#17231f;--muted:#75827d;--cream:#f5f6f1;--card:#fff;--green:#a7e86c;--line:#e6eae4;--danger:#c65353}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.shell{max-width:720px;margin:0 auto;padding:44px 22px 30px}.hero{padding:0 10px 30px}.brand{color:var(--ink);font-weight:800;font-size:1.12rem;text-decoration:none;letter-spacing:-.04em}.brand-mark{display:inline-grid;place-items:center;width:30px;height:27px;background:var(--green);border-radius:8px;margin-right:7px;font-size:.75rem;letter-spacing:0}.eyebrow,.kicker,.footer-note{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase;letter-spacing:.11em;font-size:.68rem;color:var(--muted)}.eyebrow{margin:58px 0 15px}.hero h1{font-size:clamp(2.5rem,8vw,4.4rem);line-height:.98;letter-spacing:-.075em;margin:0;font-weight:800}.hero h1 em{font-style:normal;color:#8b9890}.intro{max-width:520px;color:var(--muted);line-height:1.7;font-size:.94rem;margin:22px 0 0}.card{background:var(--card);border:1px solid #edf0eb;border-radius:22px;box-shadow:0 20px 60px #3448380c;padding:9px}.tabs{display:flex;border-bottom:1px solid var(--line);gap:7px}.tab{border:0;background:transparent;color:var(--muted);font:600 .83rem system-ui,sans-serif;padding:17px 15px 14px;cursor:pointer;position:relative}.tab.active{color:var(--ink)}.tab.active:after{content:'';height:2px;background:var(--green);left:13px;right:13px;bottom:-1px;position:absolute}.card>div:not(.tabs){padding:25px 17px}.panel-heading{display:flex!important;justify-content:space-between;align-items:start}.panel-heading h2{font-size:1.35rem;letter-spacing:-.045em;margin:7px 0 0}.kicker{margin:0;font-size:.61rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px #a7e86c22;margin:7px 8px}.dropzone{border:1.5px dashed #cbd4cb;border-radius:14px;min-height:168px;margin:22px 0 14px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;color:var(--muted);font-size:.78rem;cursor:pointer;transition:.2s}.dropzone:hover,.dropzone.dragover{border-color:#7eb94b;background:#fbfff8}.dropzone strong{color:var(--ink);font-size:.86rem}.upload-icon{font-size:.75rem;font-weight:800;color:#4d742e;background:#edf8e3;border-radius:11px;width:43px;height:43px;text-align:center;padding-top:13px;margin-bottom:3px}.dropzone input{display:none}.primary,.secondary,.copy-button{font:600 .78rem system-ui,sans-serif;cursor:pointer;border-radius:9px;transition:.2s}.primary{border:0;background:var(--ink);color:#fff;width:100%;padding:14px 17px;text-align:left}.primary span{float:right;color:var(--green);font-size:1rem}.primary:disabled{background:#bdc6bf;cursor:not-allowed}.secondary{border:1px solid var(--line);background:#fff;color:var(--muted);padding:11px 15px}.copy-button{border:1px solid var(--line);background:#fff;padding:8px 11px;color:var(--ink);margin-top:13px}.muted{color:var(--muted);font-size:.82rem;line-height:1.5}.file-list,.transfer-list{list-style:none;padding:0;margin:0 0 15px}.file-row,.transfer-row{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:7px 0;font-size:.76rem}.file-row .size,.transfer-row small{margin-left:auto;color:var(--muted)}.file-remove{border:0;background:none;color:var(--muted);cursor:pointer;font-size:1rem}.code-label{display:block;color:var(--muted);font-size:.74rem;margin:18px 0 7px}.code-entry{width:100%;height:52px;border:1px solid var(--line);border-radius:10px;background:#fcfdfb;color:var(--ink);font:700 1.35rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-align:center;letter-spacing:.16em;text-transform:uppercase}.code-entry:focus{outline:2px solid var(--green);border-color:transparent}.field-error{min-height:18px;color:var(--danger);font-size:.73rem;margin:7px 0 9px}.session-code{text-align:center;background:#f7faf4;border-radius:14px;padding:19px 10px}.session-code-text{font:800 2rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em;margin-top:10px}.connection-state{display:flex;gap:13px;align-items:center;padding:22px 4px}.connection-state strong{font-size:.84rem}.connection-state p{font-size:.74rem;color:var(--muted);margin:5px 0}.spinner{display:block;width:22px;height:22px;border:2px solid #dce8d5;border-top-color:#79ad4a;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.notice{display:flex!important;gap:10px;background:#f5faef;border-radius:11px;margin-top:1px;padding:13px 14px!important;color:#72806f;font-size:.68rem;line-height:1.5}.notice>span:first-child{color:#4d742e;font-weight:800;font-size:.72rem}.notice.error{background:#fff3f1;color:#a54b47}.notice.warn{background:#fff9e8;color:#8a6d25}.hidden{display:none!important}.footer-note{text-align:center;margin:19px 0}.download{margin-left:auto;color:#3f812d;font-weight:700;text-decoration:none}.progress{min-width:42px;text-align:right}@media(max-width:500px){.shell{padding-top:28px}.eyebrow{margin-top:42px}.hero h1{font-size:2.65rem}.card>div:not(.tabs){padding:22px 11px}.session-code-text{font-size:1.55rem}.code-entry{font-size:1.1rem}}
.share-box{display:flex;gap:18px;align-items:center;margin-top:14px;padding:16px;border:1px solid var(--line);border-radius:14px}.qr-image{width:156px;height:156px;flex:none}.qr-image svg{display:block;width:100%;height:100%;border-radius:8px}.share-link{font:600 .7rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all;color:var(--muted);margin:8px 0 0}@media(max-width:500px){.share-box{flex-direction:column;text-align:center}}
.session-help{margin:14px 6px 0;text-align:center}.help{padding:34px 10px 0}.help h2{font-size:1.15rem;letter-spacing:-.04em;margin:0 0 14px}.steps{margin:0 0 20px;padding-left:20px;color:var(--muted);font-size:.84rem;line-height:1.7}.steps li{margin:6px 0}.steps strong{color:var(--ink)}.help details{border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px 14px;margin:8px 0;font-size:.82rem}.help summary{cursor:pointer;font-weight:600}.help details p{margin:10px 0 2px;color:var(--muted);line-height:1.6}