/* Reference-led refinement, October 2026.
 * Visual layer only: no routing, permissions, data or wallet behaviour changes.
 * The legacy mint token names remain compatibility aliases, not brand colours.
 * Flow informs hierarchy; Linear informs restraint. Neither brand is reproduced.
 */
:root,html[data-theme=light]{
 --ps-accent:#6554d9;--ps-accent-hover:#5746c3;--ps-on-accent:#ffffff;
 --ps-ink:#202124;--ps-muted:#62656e;--ps-canvas:#f7f7f8;--ps-surface:#ffffff;
 --ps-sidebar:#29282f;--ps-input:#f1f1f4;--ps-inset:#ececf0;--ps-line:#e2e2e8;
 --ps-action:#6554d9;--ps-icon-mint:#62656e;
 --ps-mint:var(--ps-accent);--ps-mint-hover:var(--ps-accent-hover);--ps-on-mint:var(--ps-on-accent);
 --ps-mint-soft:#eeeafb;--ps-mint-wash:#f8f7fc;--ps-mint-line:#d5ceef;
 --ps-disabled-bg:#e9e9ee;--ps-disabled-line:#ddddE4;--ps-disabled-text:#797b85;
 --ps-control-radius:8px;--ps-card-radius:12px;--ps-dialog-radius:16px;
 --ps-control-height:36px;--ps-body-size:14px;--ps-section-gap:20px;
 --ps-space-8:24px;--ps-nav-icon:#b6b4c2;--ps-nav-active:#d5caff;
 --purple:var(--ps-action);--mint:var(--ps-accent);--mint-strong:var(--ps-action);
 --text:var(--ps-ink);--surface:var(--ps-surface);--muted:var(--ps-muted);--line:var(--ps-line);
}
html[data-theme=dark]{
 --ps-accent:#6554d9;--ps-accent-hover:#7060de;--ps-on-accent:#ffffff;
 --ps-ink:#eeeff3;--ps-muted:#aaaab5;--ps-canvas:#111113;--ps-surface:#1b1b1f;
 --ps-sidebar:#19191d;--ps-input:#252529;--ps-inset:#222226;--ps-line:#35353d;
 --ps-action:#b6a7ff;--ps-icon-mint:#aaaab5;
 --ps-mint:var(--ps-accent);--ps-mint-hover:var(--ps-accent-hover);--ps-on-mint:var(--ps-on-accent);
 --ps-mint-soft:#302b46;--ps-mint-wash:#1c1a25;--ps-mint-line:#51476e;
 --ps-disabled-bg:#29292f;--ps-disabled-line:#35353d;--ps-disabled-text:#85858f;
 --ps-control-radius:8px;--ps-card-radius:12px;--ps-dialog-radius:16px;
 --ps-control-height:36px;--ps-body-size:14px;--ps-section-gap:20px;--ps-space-8:24px;
 --ps-nav-icon:#b6b4c2;--ps-nav-active:#d5caff;
 --purple:var(--ps-action);--mint:var(--ps-accent);--mint-strong:var(--ps-action);
 --text:var(--ps-ink);--surface:var(--ps-surface);--muted:var(--ps-muted);--line:var(--ps-line);
}

/* Quiet type hierarchy, not blanket enlargement. Mobile form fields stay 16px. */
html[data-theme] body:not(.login-mode){font-size:14px;line-height:1.55;color:var(--ps-ink);background:var(--ps-canvas)}
html[data-theme] body:not(.login-mode) h1{font-size:24px;line-height:1.35;font-weight:650;letter-spacing:-.5px}
html[data-theme] body:not(.login-mode) h2{font-size:16px;line-height:1.5;font-weight:600;letter-spacing:-.2px}
html[data-theme] body:not(.login-mode) h3{font-size:14px;line-height:1.5;font-weight:600}
html[data-theme] body:not(.login-mode) :is(.page-head p,.post p,.detail-body){font-size:14px;line-height:1.65}
html[data-theme] body:not(.login-mode) .page-head{margin-bottom:24px;gap:16px}
html[data-theme] body:not(.login-mode) .stat{padding:20px}
html[data-theme] body:not(.login-mode) .stat b{font-size:28px;font-weight:650;line-height:1.2;margin-top:12px;letter-spacing:-.6px}
html[data-theme] body:not(.login-mode) :is(.panel,.post,.project-card,.org-content){padding:24px}
html[data-theme] body:not(.login-mode) :is(.project-grid,.split,.help-grid,.member-grid,.org-layout,.stats,.kanban){gap:16px}
html[data-theme] body:not(.login-mode) :is(.panel,.post,.project-card,.stat,.task-card,.table-box,.org-panel,.org-content){border-radius:12px}
/* Hairline boundaries only on grouped content surfaces; not on every control. */
html[data-theme] body:not(.login-mode) :is(.panel,.post,.stat,.task-card,.table-box,.org-panel,.org-content){border:1px solid var(--ps-line)!important}
html[data-theme] body:not(.login-mode) :is(.table-box th,.table-box td){font-size:13px;line-height:1.5}
html[data-theme] body:not(.login-mode) .table-box :is(th,td){padding:12px 16px}
html[data-theme] body:not(.login-mode) :is(.project-card p,.project-meta,.task-data){font-size:12px;line-height:1.6}

/* Primary / secondary / text hierarchy. The former all-solid-action treatment
   is deliberately superseded. Messenger controls belong to the chat stylesheet. */
html[data-theme] body:not(.login-mode) button:not(:where(header button,.rail button,.app-dock button,#sidebar button,#chat-popup-layer button,#messenger button,.nav-item,.tabs button,.policy-tabs button,.star,.notification,.biz-title,.org-profile,.org-department,.org-all,.org-expand,.org-select-member,.modal-head button,.folder-add,.appearance-tools button,.danger,.org-danger,[data-delete],[data-resource-delete],[data-member-remove],[data-chat-delete],[data-chat-remove],[name=decision][value=reject])){background:var(--ps-input);color:var(--ps-ink);font-weight:500}
html[data-theme] body:not(.login-mode) button:not(:where(header button,.rail button,.app-dock button,#sidebar button,#chat-popup-layer button,#messenger button,.nav-item,.tabs button,.policy-tabs button,.star,.notification,.biz-title,.org-profile,.org-department,.org-all,.org-expand,.org-select-member,.modal-head button,.folder-add,.appearance-tools button,.danger,.org-danger,[data-delete],[data-resource-delete],[data-member-remove],[data-chat-delete],[data-chat-remove],[name=decision][value=reject])):hover:not(:disabled){background:var(--ps-inset);color:var(--ps-ink)}
html[data-theme] body:not(.login-mode) :is(.toolbar>button,.toolbar form>button,.page-head>button,.form-actions>button,.editor>button,.org-search>button,.org-selection>button,.org-chat){min-height:36px;padding:7px 12px;font-size:13px;line-height:20px;font-weight:500;border-radius:8px}
html[data-theme] body:not(.login-mode) button.primary{min-height:36px;padding:7px 12px;border-radius:8px;background:var(--ps-accent);color:var(--ps-on-accent);font-size:13px;font-weight:600;line-height:20px}
html[data-theme] body:not(.login-mode) button.primary:hover:not(:disabled){background:var(--ps-accent-hover);color:var(--ps-on-accent)}
html[data-theme] body:not(.login-mode) :is(.panel>p>button[data-detail],.post-title,.post-bottom button,.compose-actions button){background:transparent;color:var(--ps-ink);font-weight:500;text-align:start}
html[data-theme] body:not(.login-mode) :is(.panel>p>button[data-detail],.post-title,.post-bottom button,.compose-actions button):hover:not(:disabled){background:transparent;color:var(--ps-action)}
html[data-theme] body:not(.login-mode) :is(input,select):not([type=checkbox]):not([type=radio]){min-height:36px}
html[data-theme] body:not(.login-mode) :is(input,select,textarea):not([type=checkbox]):not([type=radio]){font-size:14px;border-radius:8px;background:var(--ps-input);color:var(--ps-ink)}
html[data-theme] body:not(.login-mode) :is(input[type=checkbox],input[type=radio]){accent-color:var(--ps-accent)}
html[data-theme] body:not(.login-mode) .tabs button{font-size:13px;font-weight:500;padding-top:13px;padding-bottom:13px}
html[data-theme] body:not(.login-mode) .tabs button.active{color:var(--ps-action);font-weight:600;background:var(--ps-mint-soft);border-radius:8px 8px 0 0}
/* These are semantic status colours, not the old brand palette. */
html[data-theme] body:not(.login-mode) .status{color:#102b2c}
html[data-theme] body:not(.login-mode) .status.s3{color:#ffffff}
html[data-theme] body:not(.login-mode) .star{color:var(--ps-muted)}
html[data-theme] body:not(.login-mode) .star.on{color:#946200}
html[data-theme=dark] body:not(.login-mode) .star.on{color:#e6b45b}
html[data-theme] body:not(.login-mode) :is(.org-content h2 span,.org-selection span){color:var(--ps-muted)}

/* Preserve the compact app header and both explicitly requested boundaries. */
html[data-theme] body:not(.login-mode)>.app-header{background:var(--ps-surface);border-bottom:1px solid var(--ps-line)!important;box-shadow:none!important}
html[data-theme] body:not(.login-mode)>.app-header .brand{font-size:13px;letter-spacing:.3px}
html[data-theme] body:not(.login-mode)>.app-header .brand b{font-weight:650}
html[data-theme] body:not(.login-mode)>.app-header #search-form{background:var(--ps-input);box-shadow:none}
html[data-theme] body:not(.login-mode)>.app-header #search-form input{background:transparent;border-radius:0;font-size:13px}
html[data-theme] body:not(.login-mode)>.app-header #search-form>span{color:var(--ps-muted)}
html[data-theme] body:not(.login-mode)>.app-header :is(#mobile-menu svg,.head-tools>button[data-nav] svg),html[data-theme] .header-appearance svg{width:20px;height:20px;stroke-width:1.75;color:var(--ps-muted);background:transparent}
html[data-theme] body:not(.login-mode)>.app-header .head-tools>button.avatar{background:var(--ps-mint-soft);color:var(--ps-action);font-weight:600}
html[data-theme] body:not(.login-mode)>.app-header .head-tools>button.avatar:hover{background:var(--ps-inset);color:var(--ps-action)}
html[data-theme] body:not(.login-mode) .rail svg{width:20px;height:20px;color:var(--ps-muted);stroke-width:1.75}

/* Flow-like dark navigation, neutral resting glyphs and restrained violet
   selection. No new structure, permissions or per-account preferences. */
html[data-theme] body:not(.login-mode) :is(#sidebar,.app-dock){
 --ps-sidebar:#29282f;--ps-surface:#29282f;--ps-ink:#e4e3ea;--ps-muted:#b6b4c2;
 --ps-icon-mint:#b6b4c2;--ps-action:#d5caff;--ps-mint-soft:#403951;--ps-inset:#34333c;--ps-input:#34333c;
 --ps-mint:var(--ps-accent);--purple:var(--ps-action);--muted:var(--ps-muted);
 background:var(--ps-sidebar);color:var(--ps-ink);
}
html[data-theme=dark] body:not(.login-mode) :is(#sidebar,.app-dock){--ps-sidebar:#19191d;--ps-surface:#19191d;--ps-inset:#25252b;--ps-input:#25252b;--ps-mint-soft:#332e45}
html[data-theme] body:not(.login-mode) #sidebar{padding-left:16px;padding-right:16px}
html[data-theme] body:not(.login-mode) #sidebar .nav-item{min-height:44px;padding:9px 10px;gap:10px;border-radius:8px;font-size:13px;line-height:20px;font-weight:400}
html[data-theme] body:not(.login-mode) #sidebar .nav-item.active{color:var(--ps-action);background:var(--ps-mint-soft);font-weight:600}
html[data-theme] body:not(.login-mode) #sidebar .nav-icon{width:24px;height:24px;background:transparent}
html[data-theme] body:not(.login-mode) #sidebar .nav-icon svg{width:18px;height:18px;stroke-width:1.75;color:var(--ps-muted);opacity:1}
html[data-theme] body:not(.login-mode) #sidebar .nav-item.active .nav-icon svg{color:var(--ps-action)}
html[data-theme] body:not(.login-mode) #sidebar .sidebar-group-toggle{font-size:12px;font-weight:600;color:var(--ps-muted);padding:8px 10px}
html[data-theme] body:not(.login-mode) #sidebar .sidebar-group-chevron svg{color:var(--ps-muted);stroke-width:1.75}
html[data-theme] body:not(.login-mode) #sidebar .sidebar-top{border-bottom:1px solid #46444f!important}
html[data-theme=dark] body:not(.login-mode) #sidebar .sidebar-top{border-bottom-color:#35353d!important}
html[data-theme] body:not(.login-mode) #sidebar .company{font-size:13px;font-weight:600;gap:10px}
html[data-theme] body:not(.login-mode) #sidebar .company small{font-size:11px;font-weight:400;line-height:1.5}
html[data-theme] body:not(.login-mode) #sidebar .company>.avatar{background:var(--ps-inset);color:var(--ps-ink);border-radius:9px}
html[data-theme] body:not(.login-mode) #sidebar .sidebar-order-edit{color:#b0b0b0;font-weight:400;background:transparent}
html[data-theme] body:not(.login-mode) #sidebar .menu-order-actions button{background:var(--ps-input);color:var(--ps-ink);font-weight:500;border-radius:8px}
html[data-theme] body:not(.login-mode) #sidebar .menu-order-actions button.primary{background:var(--ps-accent);color:var(--ps-on-accent)}
html[data-theme] body:not(.login-mode) .app-dock .dock-icon{background:transparent;box-shadow:none}
html[data-theme] body:not(.login-mode) .app-dock .dock-icon svg{color:var(--ps-muted);stroke-width:1.75}
html[data-theme] body:not(.login-mode) .app-dock .active .dock-icon svg{color:var(--ps-action)}
html[data-theme] body:not(.login-mode) .app-dock .dock-item.active{background:var(--ps-mint-soft);color:var(--ps-action)}
html[data-theme] body:not(.login-mode) .app-dock .dock-item.active::after{background:var(--ps-action)}

/* Preserve borderless intro, mascot animation and exact requested footer.
   Monochrome presentation retains original artwork; no source asset is altered. */
html[data-theme] body.login-mode{--intro-mint:var(--ps-accent);background:var(--ps-canvas)}
html[data-theme] body.login-mode main,html[data-theme] body.login-mode .login{background:var(--ps-canvas)}
html[data-theme] body.login-mode .intro-logo{filter:grayscale(1)}
html[data-theme] body.login-mode .login-service-name{color:var(--ps-ink);font-weight:650}
html[data-theme] body.login-mode :is(.login-instruction,.intro-security-label){color:var(--ps-muted)}
html[data-theme] body.login-mode #wallet-login{background:var(--ps-accent);color:var(--ps-on-accent);font-weight:600}
html[data-theme] body.login-mode #wallet-login:hover{background:var(--ps-accent-hover);color:var(--ps-on-accent);filter:none}
html[data-theme] body.login-mode .login-button-arrow{background:#ffffff1f;color:var(--ps-on-accent)}
html[data-theme] body.login-mode #wallet-login:focus-visible{outline:3px solid var(--ps-action)}
html[data-theme] body.login-mode .intro-security-scan{background:var(--ps-inset)}
html[data-theme] body.login-mode :is(.intro-security-shield,.intro-security-dot){color:var(--ps-action)}
html[data-theme] #pwa-install-dialog #pwa-install{background:var(--ps-accent);color:var(--ps-on-accent)}

@media(max-width:760px){
 :root,html[data-theme]{--ps-control-height:44px;--ps-section-gap:16px;--ps-body-size:14px;--ps-space-8:16px}
 html[data-theme] body:not(.login-mode) main{padding:20px 16px var(--ps-bottom-inset)}
 html[data-theme] body:not(.login-mode) h1{font-size:22px;line-height:1.4}
 html[data-theme] body:not(.login-mode) h2{font-size:16px}
 html[data-theme] body:not(.login-mode) h3{font-size:14px}
 html[data-theme] body:not(.login-mode) :is(.panel,.post,.project-card,.org-content,.stat){padding:16px}
 html[data-theme] body:not(.login-mode) .page-head{margin-bottom:20px;align-items:flex-start}
 html[data-theme] body:not(.login-mode) :is(button.primary,.toolbar>button,.toolbar form>button,.page-head>button,.form-actions>button,.editor>button,.org-search>button,.org-selection>button,.org-chat){min-height:44px;padding:10px 14px;font-size:14px;line-height:22px}
 html[data-theme] body:not(.login-mode) :is(input,select,textarea):not([type=checkbox]):not([type=radio]){font-size:16px}
 html[data-theme] body:not(.login-mode) :is(input,select):not([type=checkbox]):not([type=radio]){min-height:44px}
 html[data-theme] body:not(.login-mode)>.app-header #search-form input{font-size:16px;min-height:40px}
 html[data-theme] body:not(.login-mode) #sidebar .nav-item{min-height:44px;font-size:14px}
 html[data-theme] body:not(.login-mode) #sidebar .sidebar-group-toggle{font-size:13px}
 html[data-theme] body:not(.login-mode) :is(.post p,.detail-body){font-size:14px;line-height:1.7}
 html[data-theme] body:not(.login-mode) .app-dock .dock-label{font-size:11px}
 html[data-theme] body.chat-page:not(.login-mode) main{padding:0}
}

/* Profile images and rounded setting surfaces. */
.settings-list>.row{border-radius:10px;padding:16px;gap:16px;min-width:0}
.settings-list>.row>small{min-width:0;overflow-wrap:anywhere}
.profile-avatar,header button.avatar{overflow:hidden;flex-shrink:0}
.profile-avatar img,header button.avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.profile-avatar svg,header button.avatar svg{display:block;width:66%;height:66%;margin:auto}
.profile-edit-trigger{display:flex;align-items:center;gap:10px;background:transparent!important;padding:4px!important;color:var(--ps-muted);font-size:13px}
.profile-edit-trigger>.avatar{width:56px;height:56px;min-width:56px}
.profile-edit-trigger:focus-visible{outline:2px solid var(--ps-accent);outline-offset:3px}
.profile-editor{display:grid;gap:16px;text-align:center;max-width:440px;margin:auto}
.profile-preview{display:grid;place-items:center;width:112px;height:112px;border-radius:50%;margin:auto;background:var(--ps-inset);color:var(--ps-accent);font-size:36px}
.profile-upload{position:relative;display:block;justify-self:center;border-radius:8px;background:var(--ps-input);min-height:44px;padding:12px 20px;cursor:pointer}
.profile-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.profile-upload:focus-within{outline:2px solid var(--ps-accent);outline-offset:3px}
.profile-editor p{font-size:12px;line-height:1.6;margin:0}
.profile-editor h3{font-size:14px;margin:8px 0 0;text-align:left}
.profile-icon-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.profile-icon-grid button{display:grid;place-items:center;min-width:0;min-height:48px;aspect-ratio:1;border:1px solid transparent!important;border-radius:10px;background:var(--ps-input);padding:10px}
.profile-icon-grid button[aria-pressed=true]{color:var(--ps-accent);background:var(--ps-mint-soft);border-color:var(--ps-accent)!important}
.profile-icon-grid svg{width:26px;height:26px;max-width:100%}
.profile-editor-actions{display:flex;justify-content:space-between;gap:12px;margin-top:8px}
.profile-editor-actions button{min-height:44px;padding:10px 20px}
@media(max-width:480px){.profile-icon-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.profile-icon-grid button{aspect-ratio:auto;min-height:54px}.settings-list>.row{padding:14px;gap:12px}.profile-edit-trigger{flex-wrap:wrap;justify-content:center}}

/* Sidebar new-content counts: a fixed circle, including 99+, in either theme. */
#sidebar .nav-item .nav-unread-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 26px;width:26px;height:26px;min-width:26px;max-width:26px;padding:0;margin-left:auto;border:0;border-radius:50%;background:#00EDE8;color:#073C3B;font-size:11px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;box-sizing:border-box;white-space:nowrap;}