/* Faz 55: the shared workspace shell. Module styles retain their own layouts. */
.app-page .realtime-toast-stack { top: auto; bottom: 24px; right: 24px; width: min(360px, calc(100vw - 32px)); }
.app-page .realtime-toast { padding: 16px; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-md); gap: 12px; background: var(--surface); }
.app-page .realtime-toast > span:first-child { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: var(--brand-soft); color: var(--brand); font-size: 14px; }
.app-page .realtime-toast strong { font-size: 14px; font-weight: 600; line-height: 1.4; }
.app-page .realtime-toast small { font-size: 12px; margin-top: 4px; line-height: 1.5; }
.app-page .realtime-toast a { display: inline-block; font-size: 12px; margin-top: 7px; color: var(--brand); }
.app-page .realtime-toast button { align-self: start; min-width: 28px; min-height: 28px; border-radius: 7px; }
.auth-page input:-webkit-autofill, .auth-page input:-webkit-autofill:hover, .auth-page input:-webkit-autofill:focus { -webkit-text-fill-color: var(--ink); -webkit-box-shadow: 0 0 0 1000px var(--surface) inset; caret-color: var(--ink); }
.auth-page .auth-visual .brand-mark, .app-page .sidebar .brand-mark { background: #635bff; color: #fff; }
.auth-page {
    --bg: #fafaff;
    --brand: #635bff;
    --brand-strong: #5146d8;
    --brand-soft: #efedff;
}
.auth-page .auth-visual {
        background: #17182f;
    }
.auth-page .auth-message h1 {
        color: #fff;
        font-weight: 600;
        letter-spacing: -.05em;
    }
.auth-page .auth-message > p, .auth-page .auth-feature-list small, .auth-page .auth-visual .brand small {
        color: #c7c6de;
    }
.auth-page .auth-form-card {
        border-color: #e6e5f0;
        box-shadow: 0 16px 50px #25263d06;
        border-radius: 16px;
    }
.auth-page .primary-button {
        background: #635bff;
        border-color: #635bff;
        color: #fff;
    }
.auth-page .security-caption {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
    }
.auth-page .security-caption .ui-icon {
            width: 16px;
            height: 16px;
        }

/* The application shell: calm surfaces, clear navigation, useful working space. */
html:has(body.app-page){font-size:16px}
.app-page{min-width:0;--sidebar-width:252px;--sidebar-bg:#fff;--sidebar-text:#78748a;--brand:#6852dc;--brand-strong:#5740c8;--brand-soft:#eee9fc;--bg:#f5f5fa;--surface:#fff;--surface-soft:#f8f7fc;--surface-raised:#fff;--ink:#302d43;--text:#302d43;--muted:#756f83;--muted-color:#756f83;--line:#e9e6f0;--line-strong:#d6cfe3;--readable-text:15px;--readable-compact:13px;--readable-label:14px;--readable-control:15px;--touch-target:44px;--topbar-height:76px;font-size:15px;font-family:'Segoe UI Variable','Segoe UI',system-ui,sans-serif;line-height:1.6}
.app-page .app-stage{min-width:0;background:radial-gradient(ellipse at 70% 0,#eeebfa80,transparent 50%),var(--bg)}
.app-page .sidebar{background:var(--sidebar-bg);border-right:1px solid var(--line);padding:27px 14px 17px;box-shadow:none;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
.app-page .sidebar-brand-row{padding:0 11px 25px;gap:8px}
.app-page .sidebar .brand{color:var(--ink);gap:11px}
.app-page .sidebar .brand strong{color:var(--ink);font-size:28px;font-weight:700;letter-spacing:-1.4px}
.app-page .sidebar .brand small{color:var(--muted);font-weight:400}
.app-page .sidebar .brand-mark{width:37px;height:37px;border-radius:12px;background:var(--brand);color:white;box-shadow:none}
.app-page .sidebar .brand-mark .ui-icon{width:22px;height:22px}
.app-page .sidebar-quick-create{background:var(--brand-soft);border:1px solid transparent;color:var(--brand);border-radius:11px;margin:0 4px 23px;min-height:45px;box-shadow:none}
.app-page .sidebar-quick-create:hover{border-color:var(--line-strong);background:var(--brand-soft)}
.app-page .sidebar-quick-create>span:first-child{background:transparent;color:var(--brand)}
.app-page .nav-eyebrow{color:var(--muted);letter-spacing:.07em;padding-inline:12px;margin:20px 0 9px;font-size:11px}
.app-page .sidebar .nav-item{font-size:14px;min-height:44px;border:1px solid transparent;color:var(--sidebar-text);border-radius:9px;gap:11px;padding-inline:12px;font-weight:450}
.app-page .sidebar .nav-item:hover{background:var(--surface-soft);color:var(--brand)}
.app-page .sidebar .nav-item.active{color:var(--brand);background:var(--brand-soft);border-color:transparent;font-weight:600}
.app-page .sidebar .nav-item>span:first-child{color:inherit;opacity:.9}
.app-page .nav-category{margin:4px 0}
.app-page .nav-category>summary{display:flex;justify-content:flex-start;gap:11px;padding:13px 12px;min-height:47px;color:var(--sidebar-text);font-size:14px;font-weight:500;letter-spacing:0;border-radius:9px}
.app-page .nav-category>summary:hover{background:var(--surface-soft);color:var(--brand)}
.app-page .nav-category.has-active-link>summary{color:var(--brand);background:transparent}
.app-page .nav-category>summary>span{font-size:inherit;transform:none;transition:none}
.app-page .nav-category .nav-category-icon{display:flex;flex:0 0 20px;color:inherit}
.app-page .nav-category .nav-category-label{flex:1}
.app-page .nav-category .nav-category-chevron{display:flex;margin-left:auto;opacity:.55}
.app-page .nav-category-chevron .ui-icon{width:14px;height:14px;transition:transform .15s}
.app-page .nav-category[open] .nav-category-chevron .ui-icon{transform:rotate(180deg)}
.app-page .nav-category-links{margin:3px 0 11px 20px;padding:0 0 0 8px;border-left:1px solid var(--line)}
.app-page .sidebar .nav-category-links .nav-item{font-size:13px;min-height:41px;padding:9px 10px;gap:8px}
.app-page .sidebar .nav-category-links .ui-icon{width:16px;height:16px}
.app-page .sidebar-bottom{margin-top:24px;padding-top:13px;border-top:1px solid var(--line)}
.app-page .sidebar .ui-icon{width:20px;height:20px}
.app-page .sidebar-collapse{color:var(--muted);border-color:var(--line);background:var(--surface-soft);padding:10px 12px;border-radius:9px}
.app-page .sidebar-collapse:hover{color:var(--brand);background:var(--brand-soft)}
.app-page .sidebar-footer{border-color:var(--line);color:var(--muted);background:var(--surface-soft);border-radius:11px;padding:13px;margin-top:13px;gap:9px}
.app-page .sidebar-footer strong{color:var(--ink);font-weight:500}
.app-page .sidebar-footer small{color:var(--muted)}
.app-page .sidebar-mobile-close{background:var(--surface-soft);color:var(--muted);border:1px solid var(--line);border-radius:10px}
.app-page .topbar{background:color-mix(in srgb,var(--surface) 94%,transparent);border-bottom:1px solid var(--line);box-shadow:none;padding-inline:32px;gap:15px;backdrop-filter:blur(14px);min-height:76px}
.app-page .topbar-context,.app-page .workspace-switcher{min-width:0}
.app-page .workspace-breadcrumb{color:var(--muted)}
.app-page .workspace-switcher strong{color:var(--ink);font-weight:600;max-width:235px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.app-page .topbar-actions{gap:10px;flex-shrink:0}
.app-page .topbar-search{border:1px solid var(--line);background:var(--surface-soft);border-radius:11px;min-height:43px;padding:10px 14px;gap:9px}
.app-page .topbar-search kbd{font-size:10px;border:0;color:var(--muted);background:var(--surface);border-radius:5px;padding:2px 4px}
.app-page .topbar-create{border-radius:10px;gap:8px;padding:10px 14px;font-weight:550}
.app-page .topbar .icon-button,.app-page .topbar .notification-button{background:var(--surface);border:1px solid var(--line);border-radius:12px;color:var(--muted)}
.app-page .topbar .icon-button:hover,.app-page .topbar .notification-button:hover{color:var(--brand);background:var(--brand-soft)}
.app-page .account-menu-summary{gap:6px;padding:0;min-height:44px}
.app-page .user-avatar{height:39px;width:39px;background:var(--brand-soft);color:var(--brand);border:1px solid var(--line);font-weight:600;box-shadow:none}
.app-page .topbar-popover{border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 40px #30204618}
.app-page .topbar-popover a,.app-page .topbar-popover button{border-radius:9px}
.app-page .realtime-state{display:none}
.app-page .main-content{width:100%;max-width:1800px;margin-inline:auto;padding:30px 32px 60px;min-width:0}
.app-page .main-content>*{min-width:0;max-width:100%}
.app-page .main-content :where(form,fieldset){min-width:0}
.app-page .main-content :where(.page-heading,.page-header){gap:20px;flex-wrap:wrap;margin-bottom:25px}
.app-page .main-content :where(.page-heading,.page-header) h1{font-size:clamp(26px,2.2vw,35px);line-height:1.22;letter-spacing:-.045em;font-weight:650}
.app-page .main-content :where(.page-actions,.page-heading-actions){flex-wrap:wrap;max-width:100%}
.app-page .main-content :where(.panel,.panel-card){border-radius:17px;border-color:var(--line);box-shadow:0 2px 6px #2f234503;min-width:0}
.app-page .main-content :where(.table-wrap,.table-responsive,[class$='-table-wrap']){max-width:100%;overflow:auto;min-width:0;overscroll-behavior-x:contain}
.app-page .primary-button,.app-page .topbar-create{background:#6852dc;border-color:#6852dc;color:#fff;box-shadow:none}
.app-page .primary-button:hover,.app-page .topbar-create:hover{background:#5740c8;border-color:#5740c8}
.app-page .secondary-button{border-radius:10px}
.app-page .page-guide{border:1px solid var(--line);background:var(--surface);border-radius:12px;margin-bottom:20px}
.app-page .page-guide summary{min-height:44px}
.app-page .service-banner{border-radius:13px}
.app-page :where(input,select,textarea){max-width:100%}
.app-page :focus-visible{outline:3px solid color-mix(in srgb,var(--brand) 55%,transparent);outline-offset:3px}
[data-theme=dark] .app-page{--bg:#1a2130;--surface:#242e3e;--surface-soft:#293445;--surface-raised:#2e394c;--sidebar-bg:#222c3d;--sidebar-text:#b3bdce;--ink:#e8edf7;--text:#e8edf7;--muted:#a4aec1;--muted-color:#a4aec1;--line:#344155;--line-strong:#45546d;--brand:#ac9bff;--brand-strong:#c2b5ff;--brand-soft:#363455}
[data-theme=dark] .app-page .app-stage{background:radial-gradient(ellipse at 80% 0,#2e2b4880,transparent 50%),var(--bg)}
[data-theme=dark] .app-page .sidebar .brand-mark{background:#7b65e5;color:white}
[data-theme=dark] .app-page .topbar{background:#222c3df2}
[data-theme=dark] .app-page .primary-button,[data-theme=dark] .app-page .topbar-create{background:#7960e2;border-color:#7960e2;color:white}
[data-theme=dark] .app-page .topbar-popover{box-shadow:0 14px 40px #0b101c55}
@media(min-width:981px){[data-sidebar=collapsed] .app-page .sidebar{padding-inline:8px}
[data-sidebar=collapsed] .app-page .sidebar-brand-row{padding-inline:7px}
[data-sidebar=collapsed] .app-page .nav-category>summary{justify-content:center;padding:12px}
[data-sidebar=collapsed] .app-page .nav-category-label,[data-sidebar=collapsed] .app-page .nav-category-chevron{display:none}
[data-sidebar=collapsed] .app-page .nav-category-icon{display:flex}
[data-sidebar=collapsed] .app-page .nav-category-links{margin:0;padding:0;border:0}}
@media(min-width:1700px){.app-page .main-content{padding-inline:42px}
.app-page .topbar{padding-inline:42px}}
@media(max-width:1350px){.app-page .topbar-search-label,.app-page .topbar-search kbd{display:none}
.app-page .topbar-search{width:44px;padding:0;justify-content:center}
.app-page .workspace-breadcrumb{display:none}
.app-page .workspace-switcher>.ui-icon{display:none}
.app-page .topbar-actions{gap:8px}
.app-page .main-content{padding:26px 26px 50px}
.app-page .topbar{padding-inline:26px}
.app-page .topbar-create>span{display:none}
.app-page .topbar-create>.ui-icon:last-child{display:none}
.app-page .topbar-create{width:44px;height:44px;padding:0;justify-content:center}}
@media(max-width:1100px){.app-page{--sidebar-width:236px}
.app-page .sidebar{padding-inline:11px}
.app-page .sidebar-brand-row{padding-inline:7px}
.app-page .topbar-actions>.theme-button{display:none}
.app-page .topbar-actions>.icon-button[title='Kullanım kılavuzu']{display:none}
.app-page .topbar-context{flex:1}
.app-page .workspace-switcher strong{max-width:175px}
.app-page .main-content{padding:24px 24px 45px}
.app-page .topbar{padding-inline:24px}}
@media(max-width:980px){.app-page .sidebar{width:min(292px,calc(100vw - 42px));box-shadow:var(--shadow-lg)}
.app-page .topbar{min-height:72px}
.app-page .sidebar-brand-row{justify-content:space-between}
.app-page .sidebar-mobile-close{flex-shrink:0}
.app-page .main-content{padding:25px 24px 45px}
.app-page .sidebar-bottom{margin-top:24px}
.app-page .workspace-switcher strong{max-width:220px}}
@media(max-width:680px){.app-page .main-content{padding:21px 18px 38px}
.app-page .topbar{padding-inline:18px;gap:9px;min-height:68px}
.app-page .topbar-actions{gap:6px}
.app-page .topbar-context{gap:9px}
.app-page .account-menu-chevron{display:none}
.app-page .workspace-switcher strong{max-width:150px}
.app-page .topbar-popover{position:fixed;top:67px;right:14px;width:min(360px,calc(100vw - 28px));max-height:calc(100dvh - 90px);overflow:auto}
.app-page .topbar-create-popover{width:min(390px,calc(100vw - 28px))}
.app-page .main-content :where(.page-heading,.page-header){gap:15px;margin-bottom:22px}
.app-page .main-content :where(.page-heading,.page-header) h1{font-size:27px}
.app-page .main-content :where(.page-actions,.page-heading-actions){width:100%;justify-content:start}
.app-page .main-content :where(.page-actions,.page-heading-actions)>*{max-width:100%}
.app-page .main-content :where(.panel,.panel-card){border-radius:14px}
.app-page .page-guide{margin-bottom:17px}
.app-page .page-guide-prompt{flex-wrap:wrap;gap:7px}
.app-page .service-banner{flex-wrap:wrap}
.app-page .service-banner>div{min-width:0;flex:1 1 180px}
.app-page .service-banner>a{margin-left:0}}
@media(max-width:500px){.app-page .topbar{padding-inline:14px}
.app-page .workspace-switcher{display:none}
.app-page .topbar-context{flex:1}
.app-page .topbar-actions{gap:6px}
.app-page .topbar-search{display:flex}
.app-page .main-content{padding:18px 14px 32px}
.app-page .main-content :where(.page-heading,.page-header) h1{font-size:25px}
.app-page .main-content :where(.filter-bar,.filter-grid,.filters){min-width:0;max-width:100%}
.app-page .user-avatar{width:38px;height:38px}
.app-page .topbar-actions .account-menu-summary{width:40px}
.app-page .main-content :where(.page-actions,.page-heading-actions)>:where(a,button){flex:1 1 auto;justify-content:center}}
@media(prefers-reduced-motion:reduce){.app-page .nav-category-chevron .ui-icon{transition:none}}
@media print{.app-page .main-content{padding:0;max-width:none}
.app-page .app-stage{background:white}
.app-page .page-guide{display:none}}
.auth-help-links{display:flex;justify-content:center;align-items:center;gap:16px;padding:18px 24px;font-size:13px;background:var(--surface);color:var(--muted)}