/* Shared visual components. Existing action attributes and native form values are preserved. */
html{scroll-padding-top:88px}body{font-family:var(--font-sans);font-size:var(--text-base);line-height:1.6;color:var(--ink);background:var(--background);-webkit-font-smoothing:antialiased}button,input,select,textarea{font-family:inherit!important}button,a,input,select,summary,textarea{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}button,a,input,select,textarea,summary{transition:background-color var(--motion),border-color var(--motion),color var(--motion),box-shadow var(--motion)}:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--brand)!important;outline-offset:3px!important;box-shadow:none!important}h1,h2,h3,h4{color:var(--ink);font-weight:var(--font-semibold);letter-spacing:-.025em;line-height:1.15}h2{font-size:var(--text-lg)}h3{font-size:var(--text-base)}p{line-height:1.6}button img.icon-svg,.icon-svg{width:18px;height:18px}svg{stroke-width:1.5}small,.helper,.fc-caption{color:var(--secondary)}[hidden]{display:none!important}
:where(.primary-btn,.secondary-btn,.public-button,.auth-submit,.topbar-create,.studio-button){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 16px;font-size:var(--text-sm);font-weight:var(--font-medium);line-height:1.4;border:1px solid var(--hairline);border-radius:var(--radius-control);box-shadow:none;text-decoration:none;white-space:normal}
body .primary-btn,body .public-button,body .auth-submit,body .topbar-create{background:var(--brand-solid);border-color:var(--brand-solid);color:#fff;box-shadow:none;border-radius:8px;font-size:var(--text-sm);font-weight:var(--font-medium);min-height:40px}body .primary-btn:hover,body .public-button:hover,body .auth-submit:hover,body .topbar-create:hover{background:var(--brand-solid-hover);border-color:var(--brand-solid-hover);box-shadow:none;transform:none}body .secondary-btn,body .public-button.secondary,body .studio-secondary{background:var(--surface);border:1px solid var(--hairline);color:var(--ink);box-shadow:none;border-radius:8px;font-size:var(--text-sm);font-weight:var(--font-medium);min-height:36px}body .secondary-btn:hover,body .public-button.secondary:hover,body .studio-secondary:hover{background:var(--surface-hover);border-color:#C5C7C7;color:var(--ink);transform:none}body .link-btn,body .fc-text-button{color:var(--brand);font-size:var(--text-sm);letter-spacing:0;font-weight:var(--font-medium)}body .icon-btn,body .calendar-nav-btn{width:36px;height:36px;border-radius:8px;background:transparent;border:1px solid var(--hairline);box-shadow:none;color:var(--secondary)}body .icon-btn:hover{background:var(--surface-hover)}
body :where(input:not([type=checkbox]):not([type=range]),select,textarea){border:1px solid var(--hairline);border-radius:8px;background:var(--surface);color:var(--ink);font-size:var(--text-sm);line-height:1.5;min-height:40px;padding:8px 12px;box-shadow:none;max-width:100%}body input::placeholder,body textarea::placeholder{color:var(--muted);opacity:1}body label,.field label{font-size:var(--text-sm);color:var(--secondary)}input[type=checkbox]{width:16px;height:16px;accent-color:var(--brand);flex-shrink:0}body :where(.card,.activity-panel,.connected-panel,.fc-card,.month-card,.task-work-card,.project-card,.subject-hub-card){border:1px solid var(--hairline);border-radius:12px;background:var(--surface);box-shadow:var(--shadow-card);color:var(--ink)}
body :where(.section-head,.work-heading,.fc-heading){margin-bottom:32px;gap:24px;align-items:center}body :where(.section-head,.work-heading,.fc-heading) h1{font-size:30px;font-weight:var(--font-semibold);letter-spacing:-.035em;line-height:1.15;margin:0 0 8px}body :where(.section-head,.work-heading,.fc-heading) p{font-size:15px;line-height:1.6;margin:0;color:var(--secondary)}body :where(.eyebrow,.work-kicker,.dashboard-panel-kicker,.fc-eyebrow){font-size:var(--text-xs);letter-spacing:0;text-transform:none;color:var(--secondary);font-weight:var(--font-medium)}body .work-kicker,body .fc-heading .fc-eyebrow{display:none}
body :where(.view-tabs,.chart-range,.mode-switch,.compact-tabs,.calendar-mode,.matieres-tabs){display:inline-flex;gap:2px;padding:3px;border:1px solid var(--hairline);border-radius:8px;background:var(--background);box-shadow:none;margin:0}body :where(.view-tabs,.chart-range,.mode-switch,.compact-tabs,.calendar-mode,.matieres-tabs)>button{border:0;border-radius:5px;min-height:30px;padding:5px 12px;background:transparent;color:var(--secondary);font-size:var(--text-sm);line-height:1.4;font-weight:var(--font-medium);box-shadow:none}body :where(.view-tabs,.chart-range,.mode-switch,.compact-tabs,.calendar-mode,.matieres-tabs)>button.active,body :where(.view-tabs,.chart-range,.mode-switch)>button[aria-pressed=true]{background:var(--surface);color:var(--brand);box-shadow:0 1px 3px #0B12200A;font-weight:var(--font-semibold)}body .matieres-tabs button::before{display:none}
body :where(.empty-state,.desk-empty,.dashboard-panel-empty,.task-work-empty,.fc-empty,.agenda-empty,.project-empty){padding:24px;text-align:left;min-height:0;background:transparent;border:0;box-shadow:none;border-radius:0;color:var(--secondary)}body :where(.empty-state,.desk-empty,.task-work-empty,.fc-empty,.agenda-empty,.project-empty)>:is(.empty-icon,.icon-svg){width:24px;height:24px;margin:0 0 12px;display:block;background:transparent;box-shadow:none}body :where(.empty-state,.desk-empty,.task-work-empty,.fc-empty,.agenda-empty,.project-empty) :is(h2,h3){font-size:var(--text-base);color:var(--ink);margin:0 0 8px}body :where(.empty-state,.desk-empty,.task-work-empty,.fc-empty,.agenda-empty,.project-empty) p{font-size:var(--text-sm);margin:0 0 12px;max-width:48ch;color:var(--secondary)}body :where(.empty-state,.desk-empty,.task-work-empty,.fc-empty,.agenda-empty,.project-empty) button{min-height:32px;background:transparent;border:0;color:var(--brand);padding:4px 0;box-shadow:none}body :where(.topbar-create-menu,.topbar-profile-menu,.notification-panel,.topbar-search-results,.action-menu>div,.studio-popover,.modal){background:var(--surface);border:1px solid var(--hairline);border-radius:12px;box-shadow:var(--shadow-menu);color:var(--ink)}.modal{padding:32px;max-width:min(560px,calc(100vw - 32px))}.modal h2{margin-bottom:24px}.modal .form-actions{border-top:1px solid var(--hairline);padding-top:20px;margin-top:24px}
/* StatStrip: adjacent cells on one connected surface. */
body .dashboard-metrics,body .progress-overview,body .matieres-stats{display:grid;gap:0;padding:0;border:1px solid var(--hairline);border-radius:12px;background:var(--surface);overflow:hidden}body .dashboard-metric,body .progress-metric,body .matieres-stat{border:0;border-right:1px solid var(--hairline);border-radius:0;background:transparent;box-shadow:none;min-height:96px;padding:20px;text-align:left;display:block;transform:none;color:var(--ink)}body .dashboard-metric:last-child,body .matieres-stat:last-child{border-right:0}body .dashboard-metric:hover{background:var(--surface-hover);transform:none;box-shadow:none}body .dashboard-metric-icon,body .progress-metric>span,body .matieres-stat-icon{display:none}body .dashboard-metric>span,body .progress-metric>div{display:flex;flex-direction:column}body .dashboard-metric small,body .progress-metric small{font-size:var(--text-label);font-weight:var(--font-regular);color:var(--secondary);order:-1}body .dashboard-metric strong,body .progress-metric strong,body .matieres-stat strong{font-size:28px;line-height:1.2;letter-spacing:-.035em;font-weight:var(--font-semibold);margin:6px 0;color:var(--ink);font-variant-numeric:tabular-nums}body .dashboard-metric em,body .progress-metric em{font-size:var(--text-xs);font-style:normal;color:var(--secondary)}
/* Select and DatePicker progressive enhancement, backed by their original inputs. */
.studio-control{position:relative;display:inline-flex;min-width:0;max-width:100%;vertical-align:middle}.studio-control>select,.studio-control>input.studio-native{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;opacity:0;pointer-events:none}.studio-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--hairline);border-radius:8px;background:var(--surface);font-size:var(--text-sm);color:var(--ink);text-align:left}.studio-select-trigger:after{content:'';width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:0 2px 3px 0;flex-shrink:0}.studio-select-trigger span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.studio-popover{position:fixed;z-index:1000;min-width:180px;max-width:calc(100vw - 24px);padding:6px}.studio-options{max-height:280px;overflow:auto}.studio-options button{display:block;width:100%;border:0;border-radius:6px;background:none;color:var(--ink);padding:8px 10px;text-align:left;font-size:var(--text-sm);min-height:36px}.studio-options button:hover,.studio-options button:focus-visible{background:var(--surface-hover)}.studio-options button[aria-selected=true]{color:var(--brand);background:var(--brand-tint)}.studio-date-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.studio-date-head button{background:none;border:0;padding:8px;color:var(--ink)}.studio-date-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.studio-date-grid>span{text-align:center;font-size:var(--text-xs);color:var(--secondary)}.studio-date-grid button{border:0;background:none;color:var(--ink);width:34px;height:34px;border-radius:7px;font-variant-numeric:tabular-nums}.studio-date-grid button:hover{background:var(--surface-hover)}.studio-date-grid button.selected{background:var(--brand);color:white}.studio-date-grid button.today{box-shadow:inset 0 0 0 1px var(--brand)}.studio-date-grid button.outside{opacity:.4}.studio-date-clear{border:0;background:none;color:var(--brand);font-size:var(--text-sm);padding:10px}
/* App shell: measured at 100% browser zoom. */
body:not(.landing-view):not(.auth-pending){zoom:1!important;background:var(--background)}body .main{margin-left:var(--sidebar-width);padding-top:var(--topbar-height);min-width:0}body:not(.landing-view):not(.auth-pending) #page{box-sizing:border-box;width:100%;max-width:calc(var(--app-width) + 80px);margin:0 auto;padding:32px 32px 64px;min-width:0}body .topbar{position:fixed;top:0;left:0;right:0;height:64px;background:var(--surface);border-bottom:1px solid var(--hairline);box-shadow:none;z-index:50}body .topbar-brand{width:232px;flex:0 0 232px;padding:0 24px;border-right:1px solid var(--hairline);background:var(--surface)}body .topbar-content{padding:0 32px;gap:24px;justify-content:center}body .topbar-search{flex:0 1 520px;max-width:520px;margin-left:auto}body .topbar-search input{height:36px;min-height:36px;border-radius:8px;background:var(--background);border-color:var(--hairline);font-size:var(--text-sm);padding-left:40px}body .topbar-shortcut{font-family:var(--font-sans);color:var(--secondary);font-size:var(--text-xs)}body .topbar-actions{margin-left:auto;gap:12px}body .topbar-create{height:36px;min-height:36px;border-radius:8px;font-size:var(--text-sm);padding:6px 12px}body .topbar-icon-btn{height:36px;width:36px;border:0;background:transparent;border-radius:8px}body .topbar-profile{height:36px;font-weight:var(--font-medium)}body .topbar-avatar,body .sidebar .sidebar-avatar{background:var(--surface-hover);color:var(--ink);border-radius:8px;width:32px;height:32px;flex-basis:32px;font-size:var(--text-xs)}body .topbar-profile>img{margin:0}body .topbar-divider{background:var(--hairline)}body #sidebar{width:232px;top:64px;bottom:0;height:auto;padding:24px 12px 12px;background:var(--surface);border-right:1px solid var(--hairline);box-shadow:none}body .sidebar>.nav-label{font-size:var(--text-xs);letter-spacing:0;text-transform:none;font-weight:var(--font-regular);padding:0 12px 12px;color:var(--secondary)}body .sidebar #mainNav{padding:0 0 16px;scrollbar-width:none}body .sidebar #mainNav::-webkit-scrollbar{display:none}body .sidebar .nav-item{height:36px;min-height:36px;margin-bottom:4px;padding:0 12px;gap:12px;border-radius:6px;background:transparent;color:var(--secondary);font-size:var(--text-sm);line-height:20px;font-weight:var(--font-medium);box-shadow:none}body .sidebar .nav-item:hover{background:var(--background);color:var(--ink)}body .sidebar .nav-item.active{background:var(--brand-tint);color:var(--brand);box-shadow:inset 2px 0 var(--brand)}body .sidebar .nav-item.active .icon-svg{filter:invert(27%) sepia(91%) saturate(4984%) hue-rotate(219deg);opacity:1}body .sidebar .nav-item::before{display:none}body .sidebar .nav-item[data-page=tasks],body .sidebar .nav-item[data-page=progress]{margin-top:20px}body .sidebar-footer{padding:12px 0 0;border:0;background:var(--surface)}body .sidebar-progress{border:0;background:none;padding:8px 12px 16px;border-radius:0}body .sidebar-level .level-shield{width:24px;height:24px;flex-basis:24px;background:transparent}body .sidebar-level strong{color:var(--ink);font-size:var(--text-label)}body .sidebar-level small,body .sidebar-xp>small{color:var(--secondary);font-size:var(--text-xs)}body .sidebar-xp-track{height:3px;background:var(--hairline)}body .sidebar-xp-track span{background:#8496B3}body .sidebar .sidebar-profile{min-height:48px;border:0;background:transparent;padding:8px;gap:8px}body .sidebar-profile-copy strong{font-size:var(--text-sm);color:var(--ink)}body .sidebar-profile-copy small{font-size:var(--text-xs);color:var(--secondary)}body .sidebar .sidebar-signout{display:none!important}.studio-profile-wrap{position:relative}.studio-profile-menu{position:absolute;bottom:54px;left:0;right:0;z-index:60;padding:6px;background:var(--surface);border:1px solid var(--hairline);box-shadow:var(--shadow-menu);border-radius:12px}.studio-profile-menu button{display:block;width:100%;padding:8px;border:0;background:none;text-align:left;font-size:var(--text-sm);color:var(--ink);border-radius:6px}.studio-profile-menu button:hover{background:var(--surface-hover)}.studio-bottom-nav{display:none}.mobile-header{display:none!important}
@media(min-width:768px) and (max-width:1100px){:root{--sidebar-width:72px}body #sidebar{width:72px;padding:20px 8px 12px}body .topbar-brand{width:72px;flex-basis:72px;padding:0 16px}body .topbar-brand .prepago-wordmark,body .sidebar .nav-label,body .sidebar-progress,body .sidebar-profile-copy,body .sidebar-profile-arrow{display:none}body .sidebar .nav-item{justify-content:center;padding:0;font-size:0;gap:0}body .sidebar .nav-item .icon{margin:0}body .sidebar .sidebar-profile{justify-content:center;padding:8px 0}body .topbar-content{padding:0 24px}body .sidebar>.brand{display:none}.studio-profile-menu{right:auto;width:192px}body #topbarProfileName{display:none}body #sidebar{transform:none;visibility:visible}}
@media(max-width:767px){body .main{margin-left:0;padding-top:64px}body #sidebar{display:none!important}body .topbar{display:flex;height:64px}body .topbar-brand{width:auto;flex:0 0 auto;padding:0 16px;border:0}body .topbar-brand .prepago-wordmark{display:none}body .topbar-content{padding:0 16px 0 0;gap:8px}body .topbar-search{max-width:none;flex:1}body .topbar-search input{width:100%;font-size:var(--text-sm);padding-right:12px}body .topbar-shortcut,body .topbar-profile-wrap,body .topbar-divider,body .notification-wrap,body .topbar-create>img{display:none}body .topbar-create{font-size:0;padding:0;width:36px;gap:0}body .topbar-create-plus{font-size:22px}body:not(.landing-view):not(.auth-pending) #page{padding:24px 16px 100px}body .section-head,body .work-heading,body .fc-heading{gap:16px;align-items:flex-start;margin-bottom:24px;flex-wrap:wrap}.studio-bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:0;left:0;right:0;z-index:70;background:var(--surface);border-top:1px solid var(--hairline);padding:4px 8px max(4px,env(safe-area-inset-bottom))}.studio-bottom-nav button{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:8px 2px;border:0;background:none;color:var(--secondary);font-size:var(--text-xs);min-height:52px}.studio-bottom-nav button[aria-current=page]{color:var(--brand);background:var(--brand-tint);border-radius:8px}.studio-more{position:fixed;bottom:76px;left:16px;right:16px;z-index:80;padding:8px;background:var(--surface);border:1px solid var(--hairline);border-radius:12px;box-shadow:var(--shadow-menu);display:grid;grid-template-columns:1fr 1fr;gap:4px}.studio-more button{display:flex;align-items:center;gap:12px;padding:12px;border:0;background:none;color:var(--ink);text-align:left;border-radius:8px}.studio-more button:hover{background:var(--background)}body .dashboard-metrics{grid-template-columns:1fr 1fr}body .dashboard-metric:nth-child(2){border-right:0}body .dashboard-metric:nth-child(-n+2){border-bottom:1px solid var(--hairline)}body .primary-btn,body .secondary-btn{min-height:44px}.studio-select-trigger{min-height:44px}}
body.auth-pending .studio-bottom-nav,body.landing-view .studio-bottom-nav,body.focus-cockpit-immersive .studio-bottom-nav,body.auth-pending .studio-more,body.landing-view .studio-more,body.focus-cockpit-immersive .studio-more{display:none!important}
/* Primary actions share the brand blue; focus mode keeps its own timer controls. */
body:not(.focus-cockpit-immersive) #page .primary-btn{background:var(--brand-solid);border:1px solid var(--brand-solid);color:#fff;box-shadow:none}body:not(.focus-cockpit-immersive) #page .primary-btn:hover{background:var(--brand-solid-hover);border-color:var(--brand-solid-hover)}body:not(.focus-cockpit-immersive) #page .primary-btn .icon-svg{filter:brightness(0) invert(1)}body:not(.focus-cockpit-immersive) #page .fc-timer-actions .primary-btn{background:var(--ink);color:var(--surface);border-color:var(--ink)}body:not(.focus-cockpit-immersive) #page .fc-timer-actions .primary-btn .icon-svg{filter:brightness(0) invert(1)}
body.auth-pending>#sidebar,body.landing-view>#sidebar{visibility:hidden!important}body .topbar{margin:0}.studio-control:has(select:invalid),.studio-control:has(input:invalid){outline-offset:2px}.studio-select-trigger:disabled{cursor:not-allowed}
body:not(.landing-view) #prepagoLanding{display:none!important}body:not(.auth-pending) #authGate[hidden]{display:none!important}body .nav-item .icon-svg{width:18px;height:18px}body .field:has(>.studio-control)>.studio-control{width:100%}