/* WebIDE Studio 7 — compact, consistent workspace. No changes to data or APIs. */
:root { --v7-hairline:var(--bd); --v7-control-height:38px; }
.v7-brand-muted { color:var(--tx3);font-weight:520; }
/* Shared controls: predictable dimensions and focus */
.v7-dashboard-body *, .v7-login * { box-sizing:border-box; }
.v7-dashboard-body button, .v7-login button { cursor:pointer; }
.v7-dashboard-body .btn, .v7-dashboard-body .studio-create,
.v7-dashboard-body .studio-view-button, .v7-dashboard-body .pc-menu-btn,
.v7-login .v7-icon-button { transition:background .15s ease,border-color .15s ease,color .15s ease;transform:none !important; }
.v7-dashboard-body .btn:focus-visible, .v7-login button:focus-visible,
.v7-dashboard-body a:focus-visible,.v7-login a:focus-visible,
.v7-login input:focus-visible { outline:2px solid var(--ac);outline-offset:2px; }

/* Login: form gets primary visual weight and the larger column */
.v7-login { min-height:100vh;margin:0;background:var(--bg);font-family:var(--font);color:var(--tx);overflow-y:auto; }
.v7-auth-top { position:relative;z-index:3;min-height:72px;padding:0 clamp(22px,3vw,48px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--bd);background:var(--s1); }
.v7-brand { display:inline-flex;align-items:center;gap:11px;color:var(--tx);font-weight:680;font-size:15px;letter-spacing:-.025em;text-decoration:none; }
.v7-brand:hover { color:var(--tx); }
.v7-brand-icon { width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:var(--tx);color:var(--s1);font-size:13px; }
.v7-icon-button { width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--bd);border-radius:10px;background:var(--s1);color:var(--tx2);font-size:14px; }
.v7-icon-button:hover { background:var(--s3);color:var(--tx); }
.v7-auth-main { min-height:calc(100vh - 126px);display:flex;align-items:center;justify-content:center;padding:32px 22px; }
.v7-auth-layout { width:min(930px,100%);display:grid;grid-template-columns:minmax(0,560px) minmax(260px,320px);justify-content:center;align-items:stretch;gap:20px; }
.v7-auth-card { padding:clamp(27px,3.3vw,48px);border-radius:19px;background:var(--s1);border:1px solid var(--bd);box-shadow:0 12px 40px rgba(0,0,0,.045); }
.v7-auth-eyebrow { display:inline-flex;align-items:center;gap:9px;margin-bottom:21px;color:var(--tx2);font-weight:590;font-size:12px; }
.v7-status-dot { width:7px;height:7px;border-radius:50%;background:var(--gr); }
.v7-auth-card h1 { font-size:clamp(30px,3.2vw,39px);font-weight:700;letter-spacing:-.05em;line-height:1.12;margin:0 0 9px;color:var(--tx); }
.v7-auth-subtitle { margin:0;color:var(--tx2);font-size:14px;line-height:1.65; }
.v7-auth-form { display:flex;flex-direction:column;gap:18px;margin-top:30px; }
.v7-form-field { display:flex;flex-direction:column;gap:8px; }
.v7-form-field label { font-size:12.5px;font-weight:650;color:var(--tx); }
.v7-field-heading { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.v7-field-heading a { font-size:12px;color:var(--ac);text-decoration:none; }
.v7-field-heading a:hover { text-decoration:underline; }
.v7-form-field>input, .v7-password-wrap input { display:block;width:100%;height:48px;min-width:0;border:1px solid var(--bd2);border-radius:10px;background:var(--s1);color:var(--tx);font-size:14px;line-height:1.35;padding:0 14px;box-shadow:none;outline:none; }
.v7-form-field input::placeholder { color:var(--tx3);opacity:1; }
.v7-form-field input:focus { border-color:var(--ac);box-shadow:0 0 0 3px var(--acd); }
.v7-password-wrap { position:relative; }
.v7-password-wrap input { padding-right:54px; }
.v7-password-toggle { position:absolute;right:7px;top:6px;display:grid;place-items:center;width:36px;height:36px;color:var(--tx3);border:0;background:transparent;border-radius:8px; }
.v7-password-toggle:hover { background:var(--s3);color:var(--tx); }
.v7-caps-hint { display:flex;align-items:center;gap:7px;font-size:12px;color:var(--am);margin-top:2px; }
.v7-caps-hint.hidden { display:none; }
.v7-auth-submit { width:100%;height:48px;display:flex;align-items:center;justify-content:center;gap:12px;background:var(--ac);border:1px solid transparent;border-radius:10px;color:#fff;font-size:14px;font-weight:670;margin-top:4px; }
.v7-auth-submit:hover { background:var(--ach); }
.v7-auth-submit:disabled { opacity:.65;cursor:progress; }
.v7-auth-footer { display:flex;align-items:center;justify-content:center;gap:9px;border-top:1px solid var(--bd);margin-top:28px;padding-top:23px;color:var(--tx3);font-size:12px; }
.v7-auth-error { display:flex;gap:10px;margin:18px 0 2px;font-size:13px;line-height:1.5; }
.v7-auth-aside { display:flex;flex-direction:column;justify-content:center;padding:29px;border:1px solid var(--bd);border-radius:19px;background:var(--s2);min-width:0; }
.v7-aside-label { font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--tx3);font-weight:700;margin-bottom:18px; }
.v7-auth-aside h2 { font-size:28px;line-height:1.14;letter-spacing:-.05em;font-weight:690;margin:0 0 13px;color:var(--tx); }
.v7-auth-aside>p { font-size:13px;line-height:1.75;color:var(--tx2);margin:0; }
.v7-aside-rule { height:1px;background:var(--bd);margin:25px 0; }
.v7-aside-item { display:flex;gap:12px;align-items:flex-start;margin:0 0 21px; }
.v7-aside-item:last-child { margin-bottom:0; }
.v7-aside-symbol { flex:0 0 33px;display:grid;place-items:center;width:33px;height:33px;border-radius:9px;background:var(--s1);border:1px solid var(--bd);color:var(--tx2);font-size:12px; }
.v7-aside-item>div { display:flex;flex-direction:column;gap:4px;min-width:0; }
.v7-aside-item strong { font-size:12.5px;font-weight:650;color:var(--tx); }
.v7-aside-item div span { font-size:12px;line-height:1.5;color:var(--tx3); }
.v7-auth-bottom { min-height:54px;padding:0 clamp(22px,3vw,48px);display:flex;align-items:center;justify-content:space-between;color:var(--tx3);font-size:12px; }
.v7-auth-bottom a { color:var(--tx2);text-decoration:none; }
.v7-auth-bottom a:hover { color:var(--tx); }
[data-theme="dark"] .v7-auth-card { box-shadow:0 14px 35px rgba(0,0,0,.14); }

/* Dashboard: projects first, compact Finder-like grid and aligned controls */
.v7-dashboard-body { background:var(--s1); }
.v7-app-shell { height:100vh;min-height:0;overflow:hidden; }
.v7-dashboard-body .v7-topbar { min-height:58px;height:58px;padding:0 24px; }
.v7-dashboard-body .topbar-logo { padding:0; }
.v7-dashboard-body .topbar-logo-text { font-size:14px;font-weight:700; }
.v7-dashboard-body .studio-sidebar { width:218px;flex:0 0 218px;padding:28px 12px 18px; }
.v7-dashboard-body .studio-side-heading { font-size:10px;margin:0 0 10px;padding:0 12px;letter-spacing:.08em; }
.v7-dashboard-body .studio-side-link { width:100%;box-sizing:border-box;min-height:38px;border:0;text-align:left;background:transparent;font-size:12px; }
.v7-dashboard-body .studio-side-link.selected { background:var(--acd); }
.v7-dashboard-body .studio-recent-heading { margin-top:30px; }
.v7-dashboard-body .studio-side-recent { height:33px; }
.v7-dashboard { max-width:none;width:auto;flex:1;min-width:0;padding:31px clamp(22px,4vw,60px) 60px;background:var(--s1);overflow:auto; }
.v7-dashboard>* { max-width:1250px;margin-left:auto;margin-right:auto; }
.v7-dashboard-header { display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:27px; }
.v7-dashboard-kicker { margin-bottom:8px;color:var(--tx3);font-size:10px;font-weight:680;letter-spacing:.105em; }
.v7-dashboard-header h1 { display:flex;gap:12px;align-items:center;font-size:clamp(28px,3vw,35px);line-height:1.15;letter-spacing:-.05em;font-weight:710;color:var(--tx);margin:0; }
.v7-project-count { display:inline-flex;align-items:center;justify-content:center;min-width:29px;height:26px;padding:0 9px;border-radius:9px;background:var(--s3);color:var(--tx2);font-size:13px;font-weight:690;letter-spacing:0; }
.v7-dashboard-header p { margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--tx2); }
.v7-dashboard-actions { display:flex;align-items:center;gap:9px;flex-wrap:wrap;justify-content:flex-end; }
.v7-dashboard-actions .btn { height:38px;padding:0 14px;display:inline-flex;align-items:center;gap:8px;border-radius:9px;white-space:nowrap; }
.v7-dashboard-actions .studio-create { font-weight:650; }
.v7-dashboard .studio-library-section { margin-top:0;padding-top:0; }
.v7-dashboard .v7-library-heading { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px; }
.v7-dashboard .v7-library-heading h2 { font-size:15px;letter-spacing:-.025em;font-weight:690; }
.v7-dashboard .v7-library-heading span { font-size:12px;color:var(--tx3); }
.v7-dashboard .pro-toolbar { margin:0 0 15px;padding:0;border:0;box-shadow:none;display:flex;align-items:center;gap:10px;background:transparent;border-radius:0; }
.v7-dashboard .pro-search { height:40px;flex:1 1 260px;max-width:none;min-width:180px;display:flex;align-items:center;gap:10px;padding:0 13px;border:1px solid var(--bd2);border-radius:10px;background:var(--s1);color:var(--tx3); }
.v7-dashboard .pro-search:focus-within { border-color:var(--ac);box-shadow:0 0 0 3px var(--acd); }
.v7-dashboard .pro-search input { width:100%;min-width:0;flex:1;background:transparent;border:0;outline:none;box-shadow:none;height:100%;font-size:13px;color:var(--tx); }
.v7-dashboard .pro-search input:focus { box-shadow:none; }
.v7-dashboard .pro-search kbd { flex:0 0 auto;height:22px;padding:0 6px;border:1px solid var(--bd);border-radius:5px;background:var(--s2);color:var(--tx3);font-size:10px; }
.v7-dashboard .pro-sort-label { font-size:12px;color:var(--tx3);white-space:nowrap; }
.v7-dashboard .pro-sort { flex:0 0 auto;height:40px;min-width:175px;border:1px solid var(--bd2);border-radius:10px;background:var(--s1);color:var(--tx);font-size:12px;padding:0 12px; }
.v7-dashboard .pro-visible { min-width:45px;flex:0 0 auto;text-align:right;color:var(--tx3);font-size:11px; }
.v7-dashboard .studio-view-switch { flex:0 0 auto;display:flex;align-items:center;gap:2px;height:40px;padding:3px;border-radius:10px;border:1px solid var(--bd);background:var(--s2); }
.v7-dashboard .studio-view-button { width:32px;height:32px;display:grid;place-items:center;border-radius:7px;padding:0;color:var(--tx3); }
.v7-dashboard .studio-view-button[aria-pressed="true"] { background:var(--s1);box-shadow:0 1px 3px rgba(0,0,0,.06);color:var(--tx); }
.v7-dashboard .proj-grid[data-view="list"] { display:flex;flex-direction:column;gap:0;border:1px solid var(--bd);border-radius:12px;background:var(--s1);overflow:visible; }
.v7-dashboard .proj-grid[data-view="list"] .proj-card { display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:13px;min-height:74px;align-items:center;padding:12px 17px;margin:0;border:0;border-radius:0;box-shadow:none;background:transparent;transform:none;min-width:0; }
.v7-dashboard .proj-grid[data-view="list"] .proj-card:not(:last-child) { border-bottom:1px solid var(--bd); }
.v7-dashboard .proj-grid[data-view="list"] .proj-card:hover { background:var(--s2);box-shadow:none;transform:none; }
.v7-dashboard .proj-grid .proj-card[hidden] { display:none !important; }
.v7-dashboard .pc-top { display:flex;align-items:center;justify-content:center;margin:0; }
.v7-dashboard .pc-icon { width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--bd);border-radius:11px;background:var(--s3);color:var(--tx2);font-size:16px; }
.v7-dashboard .pc-summary { display:flex;flex-direction:column;justify-content:center;gap:6px;min-width:0; }
.v7-dashboard .pc-name { display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tx);font-weight:650;font-size:14px;letter-spacing:-.017em;text-decoration:none; }
.v7-dashboard .pc-name:hover { color:var(--ac); }
.v7-dashboard .pc-meta { gap:17px;color:var(--tx3);font-size:11px;line-height:1.3; }
.v7-dashboard .pc-meta span { display:inline-flex;gap:6px;align-items:center; }
.v7-dashboard .pc-actions { display:flex;align-items:center;gap:7px;justify-content:flex-end;min-width:0; }
.v7-dashboard .pc-actions .btn { flex:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;padding:0 12px;height:34px;border-radius:8px;font-size:11.5px;line-height:1.2; }
.v7-dashboard .pc-actions .btn-ac { background:var(--s2)!important;color:var(--tx)!important;border-color:var(--bd2)!important; }
.v7-dashboard .pc-actions .btn-ac:hover { background:var(--s3)!important; }
.v7-dashboard .v7-preview-btn { border-color:var(--bd);color:var(--tx2); }
.v7-dashboard .v7-menu-wrap { position:relative;flex:0 0 auto; }
.v7-dashboard .pc-menu-btn { position:static;width:34px;height:34px;display:grid;place-items:center;border-radius:8px;border:1px solid var(--bd);background:var(--s1);color:var(--tx2);font-size:12px; }
.v7-dashboard .pc-menu-btn:hover { background:var(--s3); }
.v7-dashboard .pc-dropdown { position:absolute;top:calc(100% + 7px);right:0;z-index:1000;min-width:214px;background:var(--s1);border:1px solid var(--bd);border-radius:12px;padding:6px;box-shadow:var(--shlg); }
.v7-dashboard .pc-dropdown.hidden { display:none !important; }
.v7-dashboard .pcd-item { width:100%;border:0;text-align:left;background:transparent;display:flex;align-items:center;gap:10px;padding:9px 11px;font-size:12px;line-height:1.35;cursor:pointer;color:var(--tx);border-radius:7px; }
.v7-dashboard .pcd-item:hover { background:var(--s3); }
.v7-dashboard .pcd-item i { flex:0 0 15px;text-align:center;font-size:11px; }
.v7-dashboard .proj-grid[data-view="grid"] { display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:12px; }
.v7-dashboard .proj-grid[data-view="grid"] .proj-card { display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:15px;border:1px solid var(--bd);border-radius:12px;padding:18px;box-shadow:none;min-height:155px;background:var(--s1);transform:none; }
.v7-dashboard .proj-grid[data-view="grid"] .proj-card:hover { border-color:var(--bd2);background:var(--s2);box-shadow:var(--sh); }
.v7-dashboard .proj-grid[data-view="grid"] .pc-top { justify-content:flex-start; }
.v7-dashboard .proj-grid[data-view="grid"] .pc-actions { justify-content:flex-start; }
.v7-dashboard .studio-library-empty { padding:40px 20px;border-radius:12px; }
@media(max-width:1050px) {
  .v7-dashboard-body .studio-sidebar { width:185px;flex-basis:185px; }
  .v7-dashboard { padding-left:24px;padding-right:24px; }
  .v7-dashboard .pro-visible { display:none; }
  .v7-dashboard .pro-search kbd { display:none; }
}
@media(max-width:790px) {
  .v7-dashboard-body .studio-sidebar { display:none; }
  .v7-dashboard { padding:24px 18px 48px; }
  .v7-dashboard-header { align-items:flex-start; }
  .v7-dashboard-header h1 { font-size:30px; }
  .v7-dashboard-actions { justify-content:flex-start; }
  .v7-dashboard .pro-toolbar { flex-wrap:wrap; }
  .v7-dashboard .pro-search { flex-basis:100%;min-width:0; }
  .v7-dashboard .pro-sort-label { display:none; }
  .v7-dashboard .pro-sort { flex:1 1 160px;min-width:0; }
}
@media(max-width:560px) {
  .v7-auth-top { min-height:60px;padding:0 20px; }
  .v7-auth-main { display:block;min-height:calc(100vh - 114px);padding:22px 16px 30px; }
  .v7-auth-layout { display:block; }
  .v7-auth-card { padding:27px 22px;border-radius:16px; }
  .v7-auth-aside { display:none; }
  .v7-auth-bottom { padding:0 20px; }
  .v7-dashboard-body .v7-topbar { padding:0 13px; }
  .v7-dashboard .v7-dashboard-header { display:flex;flex-direction:column;gap:13px;margin-bottom:22px; }
  .v7-dashboard-header p { margin-top:4px; }
  .v7-dashboard-actions { width:100%; }
  .v7-dashboard-actions .studio-create { flex:1;justify-content:center; }
  .v7-dashboard .v7-library-heading { align-items:center; }
  .v7-dashboard .v7-library-heading h2 { font-size:14px; }
  .v7-dashboard .proj-grid[data-view="list"] .proj-card { grid-template-columns:38px minmax(0,1fr);gap:9px 11px;padding:11px; }
  .v7-dashboard .pc-icon { width:36px;height:36px; }
  .v7-dashboard .proj-grid[data-view="list"] .pc-actions { grid-column:2;justify-content:flex-start; }
  .v7-dashboard .pc-meta { flex-wrap:wrap;gap:8px; }
  .v7-dashboard .pc-actions .btn { padding:0 10px; }
  .v7-dashboard .v7-preview-btn span { display:none; }
  .v7-dashboard .pc-name { font-size:13px; }
  .v7-dashboard .studio-view-switch { margin-left:auto; }
}
@media(prefers-reduced-motion:reduce){ .v7-dashboard-body *, .v7-login * { transition:none !important; } }

@media(max-width:850px) {
  .v7-auth-layout { display:flex;justify-content:center; }
  .v7-auth-card { width:min(560px,100%);flex:0 1 560px; }
  .v7-auth-aside { display:none; }
}
@media(max-width:680px) {
  .v7-dashboard-header { flex-direction:column;align-items:flex-start;gap:14px; }
  .v7-dashboard-actions { width:100%;justify-content:flex-start; }
}
