.app-header{border-bottom:1px solid var(--edge);justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;padding-block:8px 16px;display:flex}.brand{letter-spacing:-.025em;flex-shrink:0;align-items:center;gap:10px;font-size:20px;font-weight:700;text-decoration:none;display:inline-flex}.brand-mark{width:26px;height:26px;color:var(--accent)}.brand-suffix{color:var(--accent);font-weight:400}.app-header nav{align-items:center;gap:4px;min-width:0;display:flex}.account-button{min-width:0;max-width:220px;color:var(--muted);background:0 0;border-color:#0000;align-items:center;gap:6px;padding-inline:8px;display:inline-flex}.account-button span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.auth-panel{max-width:360px;margin:24px auto 0}.form-panel{max-width:420px;margin:24px auto 0}.auth-panel,.form-panel{width:100%}form{gap:8px;min-width:0;display:grid}label{gap:6px;font-weight:700;display:grid}input{border:1px solid var(--control-edge);background:var(--surface);width:100%;min-width:0;height:44px;color:var(--fg);caret-color:var(--accent);border-radius:6px;padding:10px 12px;font-size:16px;font-weight:400;transition:border-color .12s}input::placeholder{color:var(--muted);opacity:1}input:hover,input:focus{border-color:var(--accent)}input:disabled{background:var(--raised);color:var(--muted)}input[aria-invalid=true]{border-color:var(--danger)}.address-preview{border:1px solid var(--edge);background:var(--raised);min-width:0;color:var(--muted);border-radius:6px;align-items:center;gap:8px;margin-top:4px;padding:10px 12px;font-size:12px;display:flex}.address-preview p{min-width:0}.address-preview strong{color:var(--fg)}.providers{gap:8px;display:grid}.provider-button{width:100%;min-height:44px;padding-inline:42px;position:relative}.provider-icon{width:18px;height:18px;position:absolute;left:12px}.auth-divider{color:var(--muted);white-space:nowrap;align-items:center;gap:12px;margin-block:2px;font-size:12px;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:var(--edge);flex:1;height:1px}.email-form>.primary{width:100%;min-height:44px;margin-top:4px}.email-destination{color:var(--muted);grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:8px;margin-bottom:8px;display:grid}.email-recipient{overflow-wrap:anywhere;font-size:13px}.email-destination .text-button{white-space:nowrap}.code-input{font-variant-numeric:tabular-nums;letter-spacing:.22em;text-align:center;height:56px;font-size:26px}.code-input::placeholder{letter-spacing:0;font-size:14px}.email-actions{font-variant-numeric:tabular-nums;justify-content:center;display:flex}.account-details{border-top:1px solid var(--edge);color:var(--muted);margin-top:4px;padding-top:12px;font-size:12px}.account-details summary{cursor:pointer;width:fit-content;padding-block:4px}.account-details p{margin-block:8px 4px}.account-id{align-items:center;gap:8px;display:flex}.account-id code{overflow-wrap:anywhere;flex:1;min-width:0}.device-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.device-count{color:var(--muted);letter-spacing:0;margin-left:8px;font-size:13px;font-weight:400}.device-list{border-top:1px solid var(--edge);margin:0;padding:0;list-style:none}.device-row{border-bottom:1px solid var(--edge);grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding:12px 0;display:grid}.device-link{border-radius:4px;align-items:center;gap:12px;min-width:0;min-height:44px;text-decoration:none;display:flex}.device-link:hover strong{color:var(--accent)}.device-icon{width:28px;height:28px;color:var(--muted)}.device-info{flex:1;min-width:0}.device-title{flex-wrap:wrap;align-items:center;gap:4px 10px;margin-bottom:2px;display:flex}.device-title strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:100%;font-size:16px;overflow:hidden}.device-status,.shared-label{color:var(--muted);white-space:nowrap;align-items:center;gap:5px;font-size:12px;display:inline-flex}.device-status:before{content:"";border:1px solid;border-radius:50%;width:6px;height:6px}.device-status.online{color:var(--online)}.device-status.online:before{background:currentColor}.device-address{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--muted);font-size:12px;display:block;overflow:hidden}.row-actions{justify-content:flex-end;align-items:center;gap:2px;min-width:74px;display:flex}.remove-button:hover{color:var(--danger)}.remove-confirmation{border-top:1px solid var(--edge);grid-column:1/-1;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding-top:10px;display:grid}.remove-confirmation>p:first-child{color:var(--fg);font-size:13px}.remove-confirmation .field-error{grid-column:1/-1}.danger{background:var(--danger);min-height:36px;color:var(--on-danger);border-color:var(--danger);font-size:13px}.danger:hover{background:var(--danger);opacity:.85}.danger:disabled{color:var(--on-danger);opacity:.65}.empty-state{border-top:1px solid var(--edge);text-align:center;justify-items:center;gap:8px;padding:24px 12px;display:grid}.empty-state>svg{width:32px;height:32px;color:var(--muted);margin-bottom:4px}.empty-state p{font-size:13px}.browser-access{border-top:1px solid var(--edge);grid-column:1/-1;min-width:0;padding-top:8px}.browser-access h2{font-size:14px}.browser-access>p,.browser-info p{font-size:12px}.browser-list{gap:8px;margin:4px 0 0;padding:0;list-style:none;display:grid}.browser-list>li{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;display:grid}.browser-list>li>button{min-height:36px;padding:4px 8px;font-size:13px}.browser-info{min-width:0}.browser-info strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;display:block;overflow:hidden}.browser-confirmation{flex-wrap:wrap;grid-column:1/-1;align-items:center;gap:8px;padding-block:4px;display:flex}.browser-confirmation>p{flex:12rem;font-size:13px}.browser-confirmation>.error{flex-basis:100%}@media (width<=520px){.app-header{gap:8px;margin-bottom:20px;padding-block:4px 12px}.brand{gap:8px}.auth-panel,.form-panel{margin-top:16px}.account-button{max-width:160px;padding-inline:4px;font-size:12px}.device-link{gap:8px}.device-icon{width:24px;height:24px}.device-title{column-gap:8px}}@media (pointer:coarse){.text-button{min-height:40px}.row-actions{min-width:82px}}
