:root{--paper:#f5ede2;--ink:#282b2d;--muted:#6d7175;--line:#ffffffa3;--accent:#286cda;--glass:#f8f8f4d9}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Avenir Next","Trebuchet MS",sans-serif;font-size:14px;height:100dvh;overflow:hidden}button,input{font:inherit}button{cursor:pointer;color:inherit;border:0}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,.titlebar:focus-visible{outline:3px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}.menubar{height:40px;background:#f7f4efba;display:flex;align-items:center;gap:22px;padding:0 24px;border-bottom:1px solid #ffffff80;font-size:12px}.brand{font-size:14px;font-weight:700;color:inherit;text-decoration:none}#status{color:var(--muted)}#route{margin-left:auto;font-size:10px;letter-spacing:.9px}.version{color:#999}#desktop{height:calc(100dvh - 40px);position:relative;overflow:hidden}.glass{background:var(--glass);border:1px solid var(--line);box-shadow:0 20px 50px #2b292426,0 3px 8px #2b292412;backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px)}.pair-card{position:absolute;width:min(430px,calc(100% - 36px));left:50%;top:50%;transform:translate(-50%,-50%);padding:32px;border-radius:20px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--muted)}h1{font-family:Baskerville,Georgia,serif;font-size:46px;font-weight:400;letter-spacing:-1px;margin:16px 0}p{line-height:1.6;color:var(--muted)}label{display:block;margin:22px 0 8px;font-size:12px;font-weight:600}input{border:1px solid #c8c9c4;border-radius:9px;padding:12px;background:#ffffff9c;color:var(--ink);min-width:0;width:100%}#code{text-align:center;font-family:monospace;font-size:22px;letter-spacing:2px;text-transform:uppercase}.connection-option{display:flex;gap:10px;font-weight:400;line-height:1.5}.connection-option input{width:18px;height:18px;margin:0;flex-shrink:0;accent-color:var(--accent)}.primary{background:var(--accent);color:white;border-radius:9px;padding:13px 20px}#connect,.secondary{width:100%;margin-top:10px}.secondary{padding:12px;background:transparent;border:1px solid #c9c9c4;border-radius:9px}.small{font-size:11px;margin-bottom:0}#workspace{height:100%;position:relative}.window{position:absolute;border-radius:15px;overflow:hidden;display:flex;flex-direction:column;min-width:280px;min-height:250px;max-width:100%;max-height:calc(100% - 75px)}.window.is-focused{box-shadow:0 24px 65px #2b292433,0 3px 10px #2b29241a}.titlebar{height:52px;flex-shrink:0;display:flex;align-items:center;padding:0 20px;gap:16px;cursor:grab;touch-action:none;user-select:none;border-bottom:1px solid #d3d4d02b}.titlebar:active{cursor:grabbing}.titlebar h2{font-size:15px;font-weight:600;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.traffic{display:flex;align-items:center;gap:10px}.traffic button{width:13px;height:13px;border-radius:50%;padding:0;box-shadow:inset 0 0 0 1px #00000012;flex-shrink:0}.red{background:#ff6058}.yellow{background:#ffbd2e}.green{background:#28c840}.traffic button:hover{filter:brightness(.88)}.live-label{font-size:9px;letter-spacing:1px;color:#3e8b61;margin-left:auto}.mirror{width:390px;height:720px;left:7%;top:30px}.mirror-body{display:flex;flex:1;min-height:0;padding:0 10px 0 12px;gap:10px}.video-wrap{flex:1;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;border-radius:12px;overflow:hidden;background:#101518}video,#relay-screen{width:100%;height:100%;min-height:0;object-fit:contain;touch-action:none;user-select:none;-webkit-user-drag:none;cursor:crosshair}.phone-tools{width:64px;display:flex;flex-direction:column;gap:7px;padding-bottom:4px;flex-shrink:0}.phone-tools button{background:#dadbd65e;border-radius:13px;padding:9px 3px;font-size:10px;font-weight:600;display:flex;align-items:center;gap:5px;flex-direction:column;min-height:52px}.phone-tools button:hover{background:#c7c9c183}.phone-tools img{width:21px;height:21px;opacity:.8}.tool-spacer{flex:1}.window-footer{display:flex;align-items:center;justify-content:space-between;min-height:28px;padding:5px 14px;font-size:10px;color:var(--muted);gap:10px}.window-footer button{background:transparent;color:var(--accent);font-size:10px;padding:0}#text-form{padding:0 14px 14px}#text-form label{margin:3px 0 8px;font-size:11px}.text-row{display:flex;gap:8px}.text-row input{font-size:12px}.text-row button{font-size:12px;padding:10px}.apps-window{width:700px;height:570px;left:40%;top:65px}.icon-button{margin-left:auto;background:transparent;padding:6px;display:flex}.icon-button img{width:19px;height:19px}.apps-content{flex:1;min-height:0;overflow:auto;padding:12px 20px}.apps-content>p{margin:0;font-size:12px}.app-group h3{font-size:12px;color:var(--muted);font-weight:600;margin:10px 0}.app-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:3px 8px}.app-item{display:flex;align-items:center;text-align:left;gap:13px;background:transparent;border-radius:9px;min-height:65px;padding:10px;overflow:hidden}.app-item:hover,.app-item:focus-visible{background:#b8d1cb45}.app-item img{width:34px;height:34px;flex-shrink:0;object-fit:contain}.app-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.app-search{display:flex;align-items:center;gap:10px;margin:10px 16px 0;padding:8px 14px;background:#d5d6d146;border-radius:9px;flex-shrink:0}.app-search img{width:19px;height:19px;opacity:.6}.app-search input{background:transparent;border:0;padding:6px;font-size:16px}.app-note{font-size:10px;margin:8px 20px 14px;line-height:1.45;flex-shrink:0}.resize-handle{position:absolute;right:0;bottom:0;width:19px;height:19px;background:transparent;cursor:nwse-resize;touch-action:none}.resize-handle:after{content:"";display:block;width:7px;height:7px;border-right:2px solid #9a9d9866;border-bottom:2px solid #9a9d9866;position:absolute;right:5px;bottom:5px}.dock{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px;padding:8px 12px;border-radius:18px;z-index:100}.dock button{display:flex;align-items:center;gap:7px;padding:9px 12px;border-radius:10px;background:transparent;font-size:11px;white-space:nowrap}.dock button:hover{background:#d8ded49e}.dock img{width:19px;height:19px}#notice{position:fixed;bottom:85px;left:50%;transform:translateX(-50%);z-index:150;background:#fff9ed;border:1px solid #dccdaf;border-radius:10px;box-shadow:0 8px 30px #0001;padding:10px 16px;font-size:12px;max-width:min(580px,90vw);margin:0;color:#76502c}#notice:empty{display:none}.window.maximized{left:8px!important;top:8px!important;width:calc(100% - 16px)!important;height:calc(100% - 83px)!important}.window.maximized .resize-handle{display:none}@media(max-width:600px){.menubar{padding:0 12px;gap:10px}.version{display:none}#route{max-width:100px;font-size:8px}#status{font-size:10px;max-width:145px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.window{max-height:calc(100% - 68px)}.mirror,.apps-window{left:8px;top:10px;width:calc(100% - 16px);height:calc(100% - 82px)}.titlebar{height:45px;padding:0 14px}.phone-tools{width:54px}.phone-tools button{font-size:9px;padding:7px 2px;min-height:46px}.mirror-body{padding-left:8px;gap:7px}.dock{bottom:8px;padding:6px;gap:1px}.dock button{font-size:9px;padding:8px;gap:4px}.dock img{width:16px}.app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.app-item{gap:8px;padding:8px 3px}.app-item span{font-size:12px}.app-item img{width:29px;height:29px}}@media(prefers-reduced-motion:no-preference){.pair-card{animation:appear .35s ease-out}@keyframes appear{from{opacity:0}to{opacity:1}}}
.app-live{width:440px;height:620px}.app-surface{flex:1;min-height:0;margin:0 10px;background:#101518;border-radius:10px;display:flex;overflow:hidden}.app-surface canvas{width:100%;height:100%;object-fit:contain;touch-action:none;cursor:crosshair}.app-window-footer{display:flex;align-items:center;gap:8px;padding:9px 15px;font-size:10px;color:var(--muted);flex-shrink:0}.app-window-footer span{flex:1}.app-window-footer button{padding:7px 12px;border-radius:8px;background:#dadbd65e}.app-text{display:flex;padding:0 15px 12px;gap:8px}.dock{max-width:calc(100% - 16px);overflow-x:auto;scrollbar-width:thin}.dock button{flex-shrink:0}