:root{font:15px -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;color:#24262b;background:#fff;color-scheme:light;--muted:#73767e;--line:#e9eaed;--soft:#f6f7f8;--ink:#26282d}
*{box-sizing:border-box}body{margin:0;min-width:320px}a{color:inherit;text-decoration:none}button,input,select{font:inherit;color:inherit}button,a,input,select{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #567fbd;outline-offset:4px}button,a{transition:background .18s,color .18s,border-color .18s}button:active{transform:translateY(1px)}
.topbar{height:84px;display:flex;align-items:center;gap:70px;padding:0 4.4vw;border-bottom:1px solid var(--line)}.brand{font-size:29px;letter-spacing:-1.6px;font-weight:650;display:flex;align-items:center;gap:21px}.brand span{font-size:13px;font-weight:500;color:var(--muted);letter-spacing:0;border-left:1px solid #dfe1e5;padding-left:21px}.topbar nav{height:100%;display:flex;gap:32px;align-items:center;font-size:13px;color:var(--muted)}.topbar nav a{height:100%;display:flex;align-items:center;gap:10px;border-bottom:2px solid transparent}.topbar nav .active{border-color:var(--ink);color:var(--ink);font-weight:600}.identity{margin-left:auto;display:flex;gap:11px;align-items:center;font-size:13px}.avatar{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;color:#fff;font-size:13px;font-weight:550;flex-shrink:0}.avatar.mini{width:34px;height:34px;font-size:10px}
.container{max-width:1460px;margin:0 auto;padding:68px 50px 90px}.page-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:36px}.eyebrow{font-size:11px;letter-spacing:1.5px;color:var(--muted);margin:0 0 13px}.page-heading h1{font-size:38px;letter-spacing:-1.4px;margin:0;font-weight:600;display:flex;align-items:center;gap:17px}.page-heading h1 span{font-size:14px;letter-spacing:0;font-weight:500;border:1px solid var(--line);border-radius:7px;padding:6px 10px;color:var(--muted);font-variant-numeric:tabular-nums}.primary{border:0;border-radius:8px;padding:12px 19px;background:var(--ink);color:#fff;font-size:13px;font-weight:550}.primary:hover{background:#44474e}.primary span{font-size:17px;padding-right:5px}.overview{display:flex;gap:48px;padding:27px 0 31px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:31px}.overview>div{min-width:110px;display:flex;gap:20px;align-items:center}.overview span{color:var(--muted);font-size:13px}.overview strong{font-size:25px;font-weight:550;letter-spacing:-.7px;font-variant-numeric:tabular-nums}.toolbar{display:flex;gap:12px;align-items:center}.search{display:flex;align-items:center;gap:10px;background:var(--soft);border:1px solid transparent;border-radius:8px;padding:0 14px;max-width:360px;flex:1;min-width:0;height:43px}.search:focus-within{border-color:#a3a6af}.search>span{font-size:25px;color:var(--muted)}.search input{width:100%;min-width:0;outline:none;border:0;background:transparent;font-size:13px}.toolbar select{max-width:150px;font-size:13px;border:1px solid var(--line);border-radius:8px;background:#fff;height:43px;padding:0 31px 0 12px}.quiet{border:1px solid var(--line);border-radius:7px;background:#fff;padding:10px 14px;font-size:13px}.quiet:hover{background:var(--soft)}.refresh{margin-left:auto}.grid-caption{display:flex;justify-content:space-between;margin:26px 0 15px;font-size:12px;color:var(--muted)}.account-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.account-card{background:var(--soft);border:1px solid transparent;border-radius:12px;min-width:0;padding:25px 26px 18px;display:flex;flex-direction:column;min-height:252px;transition:border-color .18s,background .18s}.account-card:hover{border-color:#d6d8df;background:#f4f5f7}.card-top{display:flex;justify-content:space-between;align-items:start;margin-bottom:20px}.state{display:flex;gap:7px;align-items:center;font-size:11px;color:#648070;margin-top:3px}.state:before{content:"";width:5px;height:5px;background:#789987;border-radius:50%}.state.off{color:#8a8d95}.state.off:before{background:#adb0b7}.card-name{font-size:19px;font-weight:600;letter-spacing:-.4px;margin:0;overflow-wrap:anywhere}.self{color:var(--muted);font-size:10px;font-weight:400;margin-left:9px;vertical-align:middle}.username{font:12px ui-monospace,SFMono-Regular,Consolas,monospace;color:#7e8189;margin:7px 0 19px;overflow-wrap:anywhere}.card-footer{border-top:1px solid #e3e5e9;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;margin-top:auto}.role{font-size:12px;color:#555962}.card-link{background:none;border:0;padding:5px 0;font-size:12px;color:#343842;display:flex;gap:16px;align-items:center}.card-link:hover{color:#456586}.empty{padding:70px 20px;text-align:center;color:var(--muted);font-size:14px}.message{color:#816142;font-size:13px;line-height:1.65;padding:12px 16px;background:#faf5ef;border-radius:8px;margin:0 0 24px;overflow-wrap:anywhere}.message.error{color:#a24e4e;background:#fff3f2}.message.success{color:#51715c;background:#f1f7f3}.restricted{padding:80px 0;text-align:center}.restricted-mark{font-size:40px;color:#868992}.restricted h2{font-size:23px;font-weight:550}.restricted p{font-size:14px;color:var(--muted);margin-bottom:26px}.restricted a{font-size:13px}
.drawer{margin:0 0 0 auto;padding:0;border:0;border-left:1px solid var(--line);height:100dvh;max-height:100dvh;width:min(465px,100vw);max-width:100vw;color:inherit;background:#fff;box-shadow:-16px 0 70px #272b3710}.drawer::backdrop{background:#24262b28}.drawer-header{height:115px;padding:29px 29px 24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.drawer-header h2{font-size:23px;margin:0;font-weight:600;letter-spacing:-.5px}.drawer-header .eyebrow{margin-bottom:7px}.icon-button{border:0;background:var(--soft);border-radius:7px;width:31px;height:31px;font-size:23px;color:#686d77}.drawer-body{padding:30px;overflow:auto;height:calc(100dvh - 115px)}.account-profile{display:flex;gap:15px;align-items:center;margin-bottom:32px}.account-profile strong{display:block;font-size:19px;margin-bottom:5px;overflow-wrap:anywhere}.account-profile small{color:var(--muted);font:12px ui-monospace,Consolas,monospace;overflow-wrap:anywhere}.account-form{display:grid;gap:23px}.account-form label{display:grid;gap:10px;font-size:12px;color:#626772}.account-form input,.account-form select{background:#fff;border:1px solid #dde0e6;border-radius:7px;padding:12px;font-size:14px;color:#282c34;width:100%}.account-form input:disabled{background:var(--soft);color:#8a8e97;cursor:not-allowed}.form-actions{padding-top:7px;display:flex;gap:10px}.security{border-top:1px solid var(--line);padding-top:25px;margin-top:34px}.security h3,.credential h3{font-size:14px;font-weight:600;margin:0 0 11px}.security p,.credential p{font-size:12px;color:var(--muted);line-height:1.6;margin:0 0 17px}.reset-confirmation{margin-top:16px;padding:16px;background:#faf5ef;border-radius:8px}.reset-confirmation p{color:#816142}.reset-confirmation .form-actions{padding:0}.credential{margin-top:27px;padding:21px;background:var(--soft);border-radius:9px}.credential code{display:block;font:15px ui-monospace,Consolas,monospace;overflow-wrap:anywhere;margin:17px 0;color:#1d242e}.credential .quiet{width:100%}
@media(min-width:1750px){.container{padding-top:88px}.account-grid{gap:24px}.account-card{min-height:270px;padding:28px 29px 22px}}
@media(max-width:1000px){.topbar{gap:34px;padding:0 28px}.container{padding:45px 28px 70px}.account-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.overview{gap:27px}}
@media(max-width:640px){.topbar{height:70px;padding:0 20px;gap:22px;flex-wrap:wrap}.brand{font-size:26px}.brand span{display:none}.topbar nav{gap:17px;font-size:12px}.identity{gap:7px}.identity #my-name{display:none}.container{padding:36px 20px 60px}.page-heading{margin-bottom:26px;align-items:center}.page-heading h1{font-size:28px;gap:10px}.primary{padding:11px 13px;font-size:12px}.overview{gap:0;justify-content:space-between;padding:21px 0}.overview>div{min-width:0;display:grid;gap:9px}.overview span{font-size:11px}.overview strong{font-size:22px}.toolbar{flex-wrap:wrap;gap:9px}.search{max-width:none;flex-basis:100%;height:42px}.toolbar select{max-width:none;flex:1}.refresh{margin:0}.account-grid{grid-template-columns:1fr;gap:13px}.account-card{min-height:235px;padding:23px}.drawer-header{padding:26px 23px}.drawer-body{padding:26px 23px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.heading-actions{display:flex;gap:12px}.topbar nav .tab{border:0;background:none;padding:25px 8px;color:#62626a;cursor:pointer}.topbar nav .tab.active{color:#1d1d1f;border-bottom:2px solid #1d1d1f}.account-grid{display:block}.account-row,.list-row{display:grid;grid-template-columns:minmax(230px,1.5fr) minmax(140px,1fr) 100px 90px 110px;align-items:center;gap:20px;padding:19px 12px;border-bottom:1px solid #e5e5e8}.account-row .account-profile{margin:0}.account-profile small{display:block;color:#85858d;margin-top:5px}.list-head{color:#85858d;font-size:12px}.account-row .avatar{width:38px;height:38px;font-size:11px}.list-row{grid-template-columns:minmax(200px,2fr) 120px 120px 110px}.section-bar{display:flex;align-items:center;justify-content:space-between;margin:30px 0 16px}.grant-row{display:grid;grid-template-columns:1fr 100px;gap:12px;padding:12px 0;border-bottom:1px solid #e5e5e8}.grant-row small{color:#85858d}.invite-output{padding:12px;background:#f5f5f7;overflow-wrap:anywhere;font-size:12px}.tab{font:inherit}.drawer .account-form{margin-top:20px}#other-view h2{font-size:20px}.list-label{font-weight:600}.list-label small{display:block;font-weight:400;color:#85858d;margin-top:6px}@media(max-width:760px){.topbar{flex-wrap:wrap}.topbar nav{overflow:auto}.account-row{grid-template-columns:1fr 100px;gap:12px}.account-row>span:nth-child(2),.account-row>span:nth-child(3),.account-row>span:nth-child(4){font-size:12px}.list-head{display:none}.list-row{grid-template-columns:1fr 90px}.heading-actions{flex-wrap:wrap}.page-heading{gap:14px}}

.project-row{grid-template-columns:minmax(200px,2fr) 100px 100px 220px}.project-actions{display:flex;gap:10px;justify-content:flex-end}@media(max-width:760px){.project-row{grid-template-columns:1fr 100px}.project-actions{grid-column:1/-1;justify-content:flex-start}}

.inline-item{border-bottom:1px solid #e5e5e8}.inline-item>.account-row,.inline-item>.list-row{border-bottom:0}.account-row{grid-template-columns:minmax(230px,1.5fr) minmax(140px,1fr) 120px 100px 190px}.inline-control{font:inherit;width:100%;min-width:0;border:1px solid transparent;border-radius:6px;padding:9px 7px;background:transparent;color:#25272c}.inline-control:hover{border-color:#dedfe5}.inline-control:focus{outline:2px solid #596ba0;outline-offset:2px;background:#fff}.account-profile>div{min-width:0;width:100%}.account-profile input{font-weight:600}.inline-control[readonly]{cursor:default}.row-actions,.project-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}.row-message{font-size:13px;margin:0 12px 12px;color:#626772}.row-message.error{color:#a24b4b}.row-message.success{color:#487b72}.reset-inline,.archive-confirm,.inline-grants{padding:20px;margin:0 12px 18px;background:#f5f5f7;border-radius:8px}.reset-inline button,.archive-confirm button{margin-right:10px}.reset-inline code{display:block;margin:14px 0;font-size:18px}.inline-grants .account-form{max-width:480px}.inline-grants .grant-row{grid-template-columns:1fr 100px 70px}.project-row{grid-template-columns:minmax(200px,2fr) 120px 90px 280px}.drawer{position:fixed;inset:0;margin:auto;width:min(540px,calc(100vw - 32px));height:auto;max-height:85dvh;border:1px solid #e5e5e8;border-radius:14px;overflow:auto}.drawer-header,.drawer-body{padding:24px}.admin-account-menu{position:relative}.admin-account-menu summary{display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none}.admin-account-menu summary::-webkit-details-marker{display:none}.admin-account-options{position:absolute;right:0;top:calc(100% + 12px);z-index:30;background:#fff;border:1px solid #e5e5e8;border-radius:10px;min-width:150px;padding:8px;box-shadow:0 8px 30px #25272c12}.admin-account-options button{font:inherit;width:100%;border:0;background:none;padding:12px;text-align:left;cursor:pointer;border-radius:5px}.admin-account-options button:hover{background:#f5f5f7}@media(max-width:760px){.account-row{grid-template-columns:1fr 1fr}.account-row>.account-profile{grid-column:1/-1}.row-actions{justify-content:flex-start}.project-row{grid-template-columns:1fr 100px}.project-actions{grid-column:1/-1;justify-content:flex-start}}

.drawer{height:fit-content}.drawer-header{height:auto;min-height:85px}.drawer-body{height:auto;max-height:calc(85dvh - 85px)}

/* Q2_SHARED_VISUAL_SYSTEM_START 20261009 */
/* Q2 visual tokens. Source of truth: Playwork scene hub, 2026-10-09.
   Paint and typography only; layouts and persisted editor data are not modified. */
:root {
 --q2-design-version: playwork-hub-1;
 --q2-font: Inter, "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
 --q2-bg: #f2f3f5;
 --q2-surface: #ffffff;
 --q2-surface-alt: #f5f6f8;
 --q2-surface-hover: #f0f3f7;
 --q2-text: #16191d;
 --q2-text-secondary: #707984;
 --q2-text-muted: #7d8691;
 --q2-border: #dfe2e6;
 --q2-control-border: #d7dbe0;
 --q2-primary: #171a1e;
 --q2-primary-hover: #272c32;
 --q2-accent: #6b8dff;
 --q2-focus: #6f8ff5;
 --q2-accent-soft: #edf1ff;
 --q2-danger: #bd4c55;
 --q2-warning: #ad731d;
 --q2-success: #25815a;
 --q2-radius-control: 7px;
 --q2-radius-menu: 9px;
 --q2-radius-panel: 10px;
 --q2-control-height: 36px;
 --q2-shadow-menu: 0 18px 50px #26313d26;
 --q2-shadow-card: 0 12px 28px #2f3b4a12;
 --q2-motion: 150ms ease;
}

/* Shared administration, registration and security surfaces. */
:root {--muted:var(--q2-text-secondary);--line:var(--q2-border);--soft:var(--q2-surface-alt);--ink:var(--q2-primary);font-family:var(--q2-font);background:var(--q2-bg);color:var(--q2-text);}
body {font-family:var(--q2-font);background:var(--q2-bg);color:var(--q2-text);}
.topbar {background:var(--q2-surface);border-color:var(--q2-border);}
.container {color:var(--q2-text);}
.account-row,.list-row,.account-card {background:var(--q2-surface);border-color:var(--q2-border);}
.drawer,.account-drawer,.management-dialog {background:var(--q2-surface);border-color:var(--q2-control-border);}
.primary {background:var(--q2-primary);border-radius:var(--q2-radius-control);}.primary:hover {background:var(--q2-primary-hover);}
.quiet,.toolbar select,.search,.account-form input,.account-form select {background:var(--q2-surface);border-color:var(--q2-control-border);border-radius:var(--q2-radius-control);}
.quiet:hover {background:var(--q2-surface-hover);}
button,input,select {font-family:var(--q2-font);}
main>form input,main>form button {border-radius:var(--q2-radius-control);}
main>form input {background:var(--q2-surface);border-color:var(--q2-control-border);}
main>form button,main>section>button {background:var(--q2-primary);color:var(--q2-surface);}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {outline:2px solid var(--q2-focus);outline-offset:2px;}
.error,.message.error {color:var(--q2-danger);}

/* Q2_SHARED_VISUAL_SYSTEM_END */

/* Q2_DENSITY_2560x1440_START 20261009 */
:root{font-size:13px;--q2-control-height:30px}.topbar{height:56px;padding:0 32px;gap:40px}.brand{font-size:24px;gap:16px}.brand span{font-size:12px;padding-left:16px}.topbar nav{gap:22px}.topbar nav .tab{height:100%;padding:0 8px}.container{max-width:1600px;padding:40px 32px 64px}.page-heading{margin-bottom:24px}.page-heading h1{font-size:28px;gap:12px}.eyebrow{margin-bottom:9px}.page-heading h1 span{font-size:12px;padding:4px 8px}.primary,.quiet{font-size:12px;padding:7px 12px;min-height:30px}.overview{padding:16px 0;margin-bottom:20px;gap:36px}.overview strong{font-size:20px}.overview span{font-size:12px}.toolbar{gap:10px}.search,.toolbar select{height:32px}.grid-caption{margin:20px 0 10px}.account-row,.list-row{padding:10px 12px;gap:16px}.list-head{padding-block:10px}.account-row .avatar{width:32px;height:32px;font-size:10px}.account-profile{gap:10px}.account-profile small{font-size:11px;margin-top:3px}.inline-control{font-size:13px;padding:6px 7px;min-height:30px}.account-profile strong{font-size:15px}.row-actions,.project-actions{gap:6px}.section-bar{margin:20px 0 12px}.drawer-header{min-height:66px;padding:18px 20px}.drawer-header h2{font-size:20px}.drawer-body{padding:20px;max-height:calc(85dvh - 66px)}.drawer .account-form,.account-form{gap:16px}.account-form label{gap:7px}.account-form input,.account-form select{font-size:13px;padding:8px;min-height:32px}.reset-inline,.archive-confirm,.inline-grants{padding:16px}.admin-account-options button{padding:8px 10px}@media(max-width:760px){.topbar{height:auto;min-height:56px;padding:10px 16px;gap:14px}.topbar nav .tab{min-height:32px}.container{padding:28px 16px 48px}.account-row{grid-template-columns:1fr 1fr}.project-row{grid-template-columns:1fr 100px}.page-heading{flex-wrap:wrap}.toolbar{flex-wrap:wrap}}
/* Q2_DENSITY_2560x1440_END */

/* Shared project icon */
.project-profile{display:flex;align-items:center;gap:12px;min-width:0}.project-profile>.inline-control{flex:1;min-width:0}.project-icon-button{width:34px;height:34px;flex:none;padding:0;border:1px solid var(--q2-border);border-radius:6px;background:var(--q2-surface-hover);display:grid;place-items:center;overflow:hidden;cursor:pointer}.project-icon-button img{width:100%;height:100%;object-fit:contain}.project-icon-fallback{font-size:13px;color:var(--q2-text-muted)}.project-icon-button:disabled{cursor:wait;opacity:.6}