/* Approved Frame concept, shared by website, installed web app and Telegram. */
.frame-app{font-size:14px;line-height:20px;background:var(--bg);color:var(--ink)}
.frame-app .app-shell{width:min(1280px,100%);padding:16px 32px 80px;margin:0 auto;display:block;min-height:100dvh}
.frame-app :is(button,a){transition:transform 500ms var(--frame-curve),opacity 300ms var(--frame-curve),background-color 300ms var(--frame-curve),color 300ms var(--frame-curve)}
.frame-app button:not(:disabled):active{transform:scale(.98)}
.frame-app :is(h1,h2,h3){letter-spacing:0;font-weight:600}
.frame-app h1{font-size:30px;line-height:36px}.frame-app h2{font-size:18px;line-height:28px}.frame-app h3{font-size:16px;line-height:24px}
.frame-app :is(button,a) svg{width:20px;height:20px;stroke-width:1.7;flex-shrink:0}
.frame-app :is(input,select,textarea){width:100%;min-width:0;max-width:100%;min-height:48px;padding:12px;border:1px solid var(--strong-line);border-radius:8px;background:var(--panel);color:var(--ink);font-size:14px;line-height:20px;font-weight:400}
.frame-app label{font-size:12px;line-height:16px;font-weight:400;color:var(--secondary);gap:8px;min-width:0}
.frame-app input[type=color]{padding:8px;height:48px;cursor:pointer}.frame-app input[type=date]{min-width:0;inline-size:100%;max-inline-size:100%;appearance:none}
.frame-app :is(.primary-button,.ghost-button,.danger-button){display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 12px;min-height:40px;font-size:14px;line-height:20px;font-weight:600;border-radius:8px;box-shadow:none;letter-spacing:0}
.frame-app .primary-button{background:var(--active-bg,var(--accent));color:var(--active-ink,#fff);border:1px solid transparent}.frame-app .primary-button:hover{background:var(--active-bg,var(--accent));opacity:.88;filter:none}
.frame-app .ghost-button{background:var(--panel);border:1px solid var(--strong-line);color:var(--ink)}.frame-app .ghost-button:hover{background:var(--control);border-color:var(--strong-line);box-shadow:none}
.frame-app .danger-button{color:var(--rose);border:1px solid var(--line);background:transparent}
.frame-app .icon-button{display:grid;place-items:center;flex:0 0 40px;width:40px;min-width:40px;height:40px;min-height:40px;padding:0;border:0;border-radius:8px;background:var(--control);color:var(--secondary);font-weight:400}
.frame-app .icon-button:hover{background:var(--line);border:0;color:var(--ink)}
.frame-app :is(.project-card,.order-item,.metric,.period-order,.form-extra,.payment-summary,.mobile-sheet,.detail-modal,.editor-modal,.settings-modal,.confirm-box){background-image:none}
.frame-skip{position:fixed;top:8px;left:8px;transform:translateY(-150%);z-index:30;background:var(--panel);color:var(--ink);border-radius:8px;padding:12px}.frame-skip:focus{transform:none}
.frame-navigation{position:relative;display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;min-height:64px;padding:8px 16px;margin:0 0 40px;background:var(--glass);backdrop-filter:blur(24px);border:1px solid var(--line);border-radius:16px}
.frame-brand{display:flex;align-items:center;gap:12px;justify-self:start;padding:0;border:0;background:none;color:var(--ink);font-size:24px;line-height:32px;font-weight:700}
.frame-brand-dot{color:var(--accent)}.frame-navigation .workspace-brand-icon{width:32px;height:32px;flex:0 0 32px;border-radius:8px;background:#fff;position:relative;overflow:hidden}.frame-navigation .workspace-brand-icon img{position:absolute;width:60px;height:60px;max-width:none;margin:0;inset:-14px}
.frame-app .frame-navigation .main-tabs{display:flex;align-items:center;gap:8px;margin:0;padding:0;border:0;background:none}
.frame-navigation .main-tab,.frame-navigation [data-open-ai-overview]{display:flex;align-items:center;gap:8px;min-height:40px;padding:8px 12px;border:0;border-radius:8px;background:none;color:var(--secondary);font-size:14px;line-height:20px;font-weight:500;white-space:nowrap;box-shadow:none}
.frame-navigation .main-tab:hover,.frame-navigation [data-open-ai-overview]:hover{background:var(--control)}
.frame-navigation .main-tab.active{background:var(--control);color:var(--ink);border:0;box-shadow:none}.frame-navigation .main-tab.active svg{color:var(--accent)}
.frame-navigation #frameHeaderEnd{justify-self:end;padding-right:48px}
.frame-navigation .frame-avatar{position:absolute;right:16px;top:50%;transform:translateY(-50%);width:32px;min-height:32px;height:32px;padding:0;border:1px solid var(--strong-line);background:var(--control);display:grid;place-items:center;font-size:12px;line-height:16px;border-radius:8px}
.frame-navigation .frame-avatar span{display:none}.frame-navigation .frame-avatar svg{width:16px;height:16px}.frame-navigation .frame-avatar:active{transform:translateY(-50%) scale(.98)}
.frame-app #themeToggleButton{width:40px;height:40px;min-height:40px;padding:0;display:grid;place-items:center;border:0;background:none;color:var(--secondary)}
.frame-app #themeToggleButton:hover{background:var(--control)}
.frame-app .topbar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin:0 0 32px;padding:0;background:none}
.frame-app .topbar .eyebrow{display:none}.frame-app #frameDate{color:var(--muted);font-size:12px;line-height:16px;margin:8px 0 0}
.frame-app #syncStatus{padding:0;font-size:12px;line-height:16px;color:var(--muted);margin-top:8px;min-height:16px}
.frame-app .desktop-actions{gap:12px}.frame-app #desktopCreateOrder{min-height:48px;font-size:16px;line-height:24px}
.frame-app .topbar-actions{display:none!important}
body[data-frame-page=more] .desktop-actions{display:none}
.frame-app .order-item.active:hover{background:var(--control)}.frame-order-price{min-width:0;max-width:160px}.frame-app .order-total{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.frame-app .mobile-dock .main-tab.active,.frame-navigation .main-tab.active svg,.frame-mini-week button.today strong{color:var(--frame-accent-ink)}
.frame-app #moreView :is(.frame-setting-link,#settingsButton),.frame-app #moreView .frame-settings-logout button{box-shadow:none;background-image:none}.frame-app #moreView .frame-settings-logout form{padding:0;margin:0}.frame-app #moreView .frame-settings-logout button{border-radius:8px;box-shadow:none;background:none}.frame-app #moreView .frame-setting-link>svg:first-child{color:var(--muted)}.frame-app #desktopCreateProject{display:inline-flex}
.frame-app #frameHeaderEnd{display:flex;align-items:center;gap:12px}.frame-app #frameHeaderEnd #syncStatus{display:block;max-width:192px;border:0;background:none;color:var(--muted);font-size:12px;line-height:16px;min-height:32px;padding:0;margin:0;overflow-wrap:anywhere}.frame-app #frameHeaderEnd #syncStatus.sync-problem{color:var(--rose)}
.frame-app .project-menu{background:var(--panel);background-image:none;border:1px solid var(--strong-line);border-radius:16px;box-shadow:var(--modal-shadow)}
.frame-app .frame-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:0 0 32px;margin-bottom:32px;border:0;border-bottom:1px solid var(--line);background:none}
.frame-summary .metric{padding:0;border:0!important;border-radius:0;background:transparent;box-shadow:none}.frame-summary .metric:first-child{display:none}
.frame-summary .metric>span{font-size:12px;line-height:16px;color:var(--secondary);font-weight:400}.frame-summary .metric strong{font-size:30px;line-height:36px;font-weight:500;color:var(--ink);margin-top:8px;font-variant-numeric:tabular-nums}
.frame-summary-note{display:block;font-size:12px;line-height:16px;color:var(--muted);margin-top:8px}.frame-summary .metric.good .frame-summary-note{color:var(--positive)}
body[data-frame-page=more] .frame-summary,body[data-frame-page=calendar] .frame-summary{display:none}
.frame-projects-section{margin:0 0 32px;min-width:0}.frame-app .projects-heading{display:flex;align-items:center;gap:12px;margin:0 0 16px;justify-content:flex-start}
.frame-app #openProjectPicker{font-size:18px;line-height:28px;font-weight:600;color:var(--ink);gap:8px}.frame-app #openProjectPicker>svg{display:none}
#frameProjectCount{font-size:12px;line-height:16px;color:var(--muted)}.frame-app .project-heading-actions{margin-left:auto;gap:12px}
.frame-app #desktopCreateProject{min-height:32px;padding:4px 8px;font-size:12px;line-height:16px;font-weight:500;border:0;background:none;color:var(--secondary)}
.frame-app .sort-control select{height:32px;min-height:32px;width:144px;border:0;border-radius:8px;background:transparent;padding:4px 24px 4px 8px;font-size:12px;line-height:16px;color:var(--secondary)}
.frame-app .sort-control>svg:first-child{display:none}.frame-app .sort-control>svg:last-child{width:14px;height:14px;right:4px}
.frame-app .projects-strip{display:flex;gap:12px;padding:2px 2px 8px;margin:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scroll-padding-inline:2px}
.frame-app .project-card{position:relative;display:block;flex:0 0 224px;min-width:0;min-height:144px;padding:16px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:none}
.frame-app .project-card:hover{background:var(--control);border-color:var(--strong-line)}.frame-app .project-card.active{background:var(--panel);border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.frame-app .project-card-main{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:0;width:100%;min-height:112px;padding:0;border:0;background:none;text-align:left;color:var(--ink)}
.frame-app .project-card-main .frame-project-title{display:flex;align-items:center;gap:8px;font-size:14px;line-height:20px;font-weight:500;margin-bottom:24px;padding-right:16px}
.frame-project-title>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.frame-project-title>svg{width:16px;height:16px;margin-left:auto;color:var(--accent)}
.frame-project-dot{display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--project-color,var(--accent));flex-shrink:0}
.frame-app .project-card-main strong{font-size:24px;line-height:32px;font-weight:500;font-variant-numeric:tabular-nums}.frame-app .project-card-main small{font-size:12px;line-height:16px;color:var(--muted);font-weight:400;margin-top:4px}
.frame-app .project-more{position:absolute;right:8px;top:8px;width:24px;min-width:24px;height:24px;padding:4px;min-height:24px;border:0;border-radius:4px;background:none;color:var(--muted)}.frame-app .project-more svg{width:16px;height:16px}.frame-app .project-more:hover{background:var(--control);color:var(--ink)}
.frame-orders-layout{display:grid;grid-template-columns:minmax(0,1fr) 256px;gap:40px;align-items:start}.frame-app .orders-panel{display:flex;flex-direction:column;min-width:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.frame-app .orders-panel>.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 16px}.frame-app .orders-heading-copy{display:flex;align-items:center;gap:12px}.frame-app .orders-heading-copy h2{font-size:18px;line-height:28px}.frame-app #ordersCount{display:none}
#frameOrderCount{font-size:12px;line-height:16px;font-weight:400;color:var(--muted);padding:2px 8px;border-radius:4px;background:var(--control)}
.frame-order-tools{display:flex;align-items:center;gap:8px}.frame-app #frameSearchToggle{width:32px;min-width:32px;flex-basis:32px;height:32px;min-height:32px;background:none}
.frame-app .order-search{margin:0 0 16px}.frame-app .order-search input{background:var(--panel);padding-left:40px}.frame-app .order-search svg{width:16px;height:16px}
.frame-app .orders-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;margin:0;padding:0 0 16px;border-bottom:1px solid var(--line)}
.frame-app .filters{display:flex;align-items:center;gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none}.frame-app .filter-button{font-size:12px;line-height:16px;font-weight:500;border:0;border-radius:8px;background:none;color:var(--secondary);min-height:40px;padding:8px 12px;white-space:nowrap}
.frame-app .filter-button.active{background:var(--control);color:var(--ink);box-shadow:none;border:0}.frame-app .filter-button:hover{background:var(--control)}
.frame-app .view-toggle{display:flex;gap:4px;height:40px;border:0;border-radius:8px;padding:4px;overflow:hidden;background:var(--control)}
.frame-app .view-button{display:grid;place-items:center;width:32px;height:32px;min-height:32px;padding:0;border:0;border-radius:4px;background:none;color:var(--muted)}
.frame-app .view-button.active{background:var(--panel);color:var(--ink);box-shadow:0 1px 4px #0000000a}.frame-app .view-button svg{width:16px;height:16px}
.frame-app .orders-list{display:flex;flex-direction:column;gap:0;border:0}.frame-app .order-item{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:16px;padding:24px;text-align:left;width:100%;border:0;border-bottom:1px solid var(--line);border-radius:8px;background:none;box-shadow:none;transform:none;color:var(--ink)}
.frame-app .order-item:hover{background:var(--control);border-color:var(--line);border-radius:8px;transform:none;box-shadow:none}.frame-app .order-item.active{background:none;box-shadow:none}
.frame-order-symbol{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:var(--control);color:var(--secondary)}
.frame-order-copy{min-width:0}.frame-app .order-title{display:block;font-size:14px;line-height:20px;font-weight:600;margin:0;overflow-wrap:anywhere}
.frame-app .order-meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:12px;line-height:16px;color:var(--muted);margin-top:8px;overflow-wrap:anywhere}.frame-app .order-meta .frame-project-dot{width:6px;height:6px}
.frame-order-timing::before{content:'·';margin-right:8px;color:var(--strong-line)}.frame-late,.frame-app .order-meta .frame-late{color:var(--rose)}
.frame-due-note{display:block;color:var(--warning);font-size:12px;line-height:16px;margin-top:4px;overflow-wrap:anywhere}
.frame-order-price{text-align:right;min-width:112px}.frame-app .order-total{display:block;font-size:16px;line-height:24px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink)}
.frame-payment-status{display:flex;align-items:center;justify-content:flex-end;gap:4px;font-size:12px;line-height:16px;color:var(--muted);margin-top:8px}.frame-payment-status.paid{color:var(--positive)}.frame-payment-status.deposit{color:var(--warning)}.frame-payment-status>svg{width:14px;height:14px}
.frame-app .orders-list.grid-view{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-top:16px}.frame-app .grid-view .order-item{grid-template-columns:40px minmax(0,1fr);align-items:start;row-gap:24px;padding:16px;border:1px solid var(--line);border-radius:8px;background:var(--panel);min-height:0}
.frame-app .grid-view .frame-order-price{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px;text-align:left}.frame-app .grid-view .order-total{font-size:20px;line-height:28px}.frame-app .grid-view .frame-payment-status{margin:0}.frame-app .grid-view .frame-order-timing{flex-basis:100%}.frame-app .grid-view .frame-order-timing::before{display:none}
.frame-app .empty-state{padding:48px 16px;border:0;background:none;border-radius:0;color:var(--muted);font-size:14px;line-height:24px;text-align:center}
#frameWeekAside{border-left:1px solid var(--line);padding-left:24px;min-width:0}#frameWeekAside h2{font-size:14px;line-height:20px;margin:0 0 8px}.frame-aside-caption{font-size:12px;line-height:16px;color:var(--muted);margin:0 0 24px}.frame-mini-week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin:24px 0 32px}.frame-mini-week button{display:flex;flex-direction:column;align-items:center;gap:12px;padding:8px 0;border:0;border-radius:8px;background:none;color:var(--muted);font-size:12px;line-height:16px}.frame-mini-week button.today{background:var(--control)}.frame-mini-week strong{color:var(--ink);font-weight:500}.frame-mini-week button.today strong{color:var(--accent)}.frame-mini-week i{width:4px;height:4px;border-radius:50%;background:var(--strong-line)}.frame-mini-week i.has-work{background:var(--accent)}
.frame-aside-label{font-size:12px;line-height:16px;color:var(--muted);margin:24px 0 16px}.frame-week-task{display:block;width:100%;text-align:left;padding:0;border:0;background:none;margin-bottom:24px;color:var(--ink)}.frame-week-task>span{display:flex;align-items:center;gap:8px;font-size:12px;line-height:16px;margin-bottom:8px}.frame-week-task>span>svg{width:14px;height:14px}.frame-week-task strong{display:block;font-size:14px;line-height:20px;font-weight:500;overflow-wrap:anywhere}.frame-week-task small{display:block;color:var(--muted);font-size:12px;line-height:16px;margin-top:4px;overflow-wrap:anywhere}.frame-week-calendar{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;border:0;border-top:1px solid var(--line);padding:12px 0;background:none;color:var(--secondary);font-size:12px;line-height:16px}.frame-week-calendar>svg{width:16px;height:16px}
.frame-app #moreView{max-width:720px;min-height:0;display:block}.frame-app #moreView.hidden{display:none}.frame-app #moreView .mobile-brand,.frame-app #mobileMoreActions{display:none}
.frame-settings-section{padding:24px 0;border-top:1px solid var(--line)}.frame-settings-section>h2{margin:0 0 24px;font-size:18px;line-height:28px}.frame-setting-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto);align-items:center;gap:24px;margin-bottom:24px}.frame-setting-row:last-child{margin-bottom:0}.frame-setting-copy{display:flex;align-items:center;gap:12px;min-width:0}.frame-setting-copy>svg{color:var(--muted)}.frame-setting-copy>strong{font-weight:500;font-size:14px;line-height:20px}.frame-setting-control{display:flex;align-items:center;justify-content:flex-end;gap:16px;min-width:0}.frame-theme-options{display:flex;gap:4px;padding:4px;background:var(--control);border-radius:8px}.frame-theme-options>button{width:40px;height:40px;min-height:40px;padding:8px;border:0;border-radius:4px;color:var(--muted);background:none;display:grid;place-items:center}.frame-theme-options>button.active{background:var(--panel);color:var(--ink)}
.frame-swatches{display:flex;align-items:center;gap:16px}.frame-swatches>button{display:grid;place-items:center;width:24px;height:24px;min-height:24px;padding:0;border:0;border-radius:50%;background:var(--swatch);color:#fff;flex-shrink:0}.frame-swatches>button>svg{width:14px;height:14px}.frame-swatches>button.active{outline:2px solid var(--swatch);outline-offset:4px}
.frame-app #settingsButton{min-height:40px;padding:8px;border:1px solid var(--strong-line);background:var(--panel);font-size:12px;line-height:16px;font-weight:500}.frame-app #settingsButton svg{width:16px;height:16px}.frame-accent-controls{flex-wrap:wrap;row-gap:12px}
.frame-app #workspaceAccount{padding:0;margin:0 0 16px;border:0;border-radius:0;background:none;box-shadow:none;display:grid;gap:8px}.frame-app #workspaceAccount>strong{font-size:14px;line-height:20px;font-weight:500}.frame-app #workspaceAccount>span{font-size:12px;line-height:16px;color:var(--muted)}
.frame-app #moreView .frame-setting-link{display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;padding:16px 0;min-height:48px;margin:0;border:0;border-radius:0;background:none;color:var(--ink);font-size:14px;line-height:20px;font-weight:500;text-align:left;text-decoration:none}.frame-app #moreView .frame-setting-link>svg:last-child{width:16px;height:16px;margin-left:auto;color:var(--muted)}.frame-app #moreView .frame-setting-link:hover{color:var(--accent)}
.frame-app #moreView .frame-settings-logout{padding:32px 0 0}.frame-app #moreView .frame-settings-logout form{margin:0}.frame-app #moreView .frame-settings-logout button{justify-content:flex-start;padding:8px 0;border:0;background:none;color:var(--rose);font-weight:500}
.frame-app :is(.detail-overlay,.editor-overlay,.settings-overlay,.confirm-overlay,.mobile-sheet-overlay){padding:32px;background:#11131865;backdrop-filter:blur(4px)}
.frame-app :is(.detail-modal,.editor-modal,.settings-modal,.confirm-box,.mobile-sheet,.ai-modal){background:var(--panel);background-image:none;border:1px solid var(--line);border-radius:16px;box-shadow:var(--modal-shadow);max-height:calc(100dvh - 64px);color:var(--ink)}
.frame-app :is(.detail-modal,.editor-modal,.settings-modal,.confirm-box){padding:24px}.frame-app .detail-modal{width:min(640px,100%)}
.frame-app :is(.modal-heading,.mobile-sheet-heading){padding:0 0 24px;margin:0;gap:16px;border:0}.frame-app :is(.modal-heading,.mobile-sheet-heading) h2{font-size:20px;line-height:28px}
.frame-app .mobile-sheet{padding:24px;width:min(640px,100%);overflow-y:auto}.frame-app .mobile-sheet:has(#mobileCreateChoices:not(.hidden)){width:min(448px,100%)}
.frame-app #mobileCreateChoices{display:grid;gap:12px}.frame-app #mobileCreateChoices button{justify-content:flex-start;width:100%;min-height:80px;padding:16px;border:1px solid var(--strong-line);border-radius:8px;background:var(--panel);color:var(--ink);font-size:16px;line-height:24px;font-weight:500}.frame-app #mobileCreateChoices button:hover{background:var(--control)}
.frame-app .form-fields,.frame-app .detail-fields{gap:24px;padding:4px;scrollbar-gutter:stable}.frame-app .inline-fields{gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.frame-app .form-extra{border:1px solid var(--line);border-radius:8px;background:var(--panel)}.frame-app .form-extra summary{padding:16px;font-size:14px;line-height:20px}.frame-app .form-extra .extra-fields{padding:8px 16px 16px;gap:24px}
.frame-app .draft-total{padding:0;background:none;font-size:12px;line-height:16px}.frame-app .draft-total strong{font-size:20px;line-height:28px;font-weight:500}
.frame-app :is(.form-footer,.detail-actions){border-top:1px solid var(--line);padding:16px 0 0;background:var(--panel);margin:0;gap:12px}.frame-app .form-footer .primary-button{min-height:48px}.frame-app .detail-actions .primary-button{min-height:48px}
.frame-app .payment-summary{padding:16px;border:1px solid var(--line);border-radius:8px;background:var(--control);gap:16px}.frame-app .payment-summary span{font-size:12px;line-height:16px}.frame-app .payment-summary strong{font-size:20px;line-height:28px;font-weight:500}.frame-app .payment-row input{min-height:48px;padding:8px}.frame-app .payment-row .icon-button{min-width:32px;width:32px;height:48px;min-height:48px;border:1px solid var(--line);background:none;color:var(--rose)}
.frame-app :is(.description-preview,.rich-editor){border:1px solid var(--strong-line);border-radius:8px;background:var(--panel);padding:12px;color:var(--ink);font-size:14px;line-height:24px}.frame-app .description-preview{margin-top:8px;max-height:144px;overflow:auto}.frame-app .editor-open-button{border:1px solid var(--strong-line);background:var(--panel);border-radius:8px;text-align:left;justify-content:flex-start;min-height:48px;font-size:14px;line-height:20px;font-weight:500;padding:12px}
.frame-app :is(.format-button,.image-attach-button){border:1px solid var(--line);border-radius:8px;min-width:40px;min-height:40px;background:var(--panel);color:var(--ink);font-size:14px;line-height:20px}.frame-app .rich-editor{outline-offset:-2px}
.frame-app .accent-preset{width:32px;height:32px;min-height:32px;border-radius:50%;background:var(--preset-color)}.frame-app .accent-presets{display:flex;flex-wrap:wrap;gap:16px}.frame-app .settings-modal label{gap:12px}
.frame-app .ai-modal{width:min(920px,100%)}.frame-app .ai-modal .modal-heading{padding:24px;border-bottom:1px solid var(--line)}.frame-app .ai-scroll{padding:24px}.frame-app .ai-caption{font-size:12px;line-height:20px}.frame-app .ai-modal h3{font-size:16px;line-height:24px;font-weight:600}
.frame-app .overview-views{display:flex;width:fit-content;padding:4px;border:0;border-radius:8px;background:var(--control);margin-bottom:32px;gap:4px}.frame-app .overview-views button{border:0;border-radius:4px;min-height:40px;padding:8px 16px;font-size:14px;line-height:20px;color:var(--secondary)}.frame-app .overview-views button.active{border:0;background:var(--panel);color:var(--ink)}
.frame-app .ai-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-bottom:24px;border-bottom:1px solid var(--line);margin-bottom:32px}.frame-app .ai-totals>div{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.frame-app .ai-totals dt{font-size:12px;line-height:16px;color:var(--muted)}.frame-app .ai-totals dd,.frame-app .ai-totals>div:first-child dd{font-size:24px;line-height:32px;font-weight:500;margin:0;color:var(--ink);text-align:left;font-variant-numeric:tabular-nums}
.frame-app .distribution-layout{grid-template-columns:176px minmax(0,1fr);gap:32px}.frame-app #incomeDonut{width:176px;height:176px}.frame-app .income-legend-row{grid-template-columns:8px minmax(0,1fr) auto;gap:12px;padding:12px 0}.frame-app .income-swatch{width:8px;height:8px;border-radius:2px}.frame-app .income-legend-name{font-size:12px;line-height:16px}.frame-app .income-legend-value strong{font-size:14px;line-height:20px;font-weight:500}
.frame-app .ai-order-link{padding:16px 0;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;color:var(--ink)}.frame-app .ai-order-link:hover{background:var(--control)}.frame-app .ai-order-title{font-size:14px;line-height:20px;font-weight:500}.frame-app .ai-attention{gap:0}
.frame-app .period-grid{gap:24px;padding:24px 0;border-block:1px solid var(--line);background:none}.frame-app .period-grid .metric{border:0;padding:0;border-radius:0;background:none;box-shadow:none}.frame-app .period-grid .metric strong{font-size:24px;line-height:32px;font-weight:500;color:var(--ink)}
.frame-app .calendar-page-heading h2{display:none}.frame-app .calendar-page-heading{margin-bottom:24px}.frame-app .calendar-scope{margin-block:24px;gap:24px}.frame-app .calendar-scope select{background:var(--panel)}.frame-app .calendar-view-toggle{padding:4px;border-radius:8px;border:0;background:var(--control);gap:4px}.frame-app .calendar-view-toggle .ghost-button{border:0;border-radius:4px;background:none;color:var(--secondary)}.frame-app .calendar-view-toggle .active{background:var(--panel);color:var(--ink)}
.frame-app .month-heading{gap:16px;margin-bottom:24px}.frame-app #calendarMonthTitle{font-size:20px;line-height:28px;font-weight:600}.frame-app .calendar-days{gap:8px}.frame-app .calendar-day{padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:8px;min-height:80px;font-size:14px;line-height:20px;color:var(--ink)}.frame-app .calendar-day.today{outline:0;border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.frame-app .calendar-day.selected{background:var(--control)}
.frame-app .agenda-event,.frame-app .period-order{background:none;box-shadow:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:16px 0}.frame-app .agenda-event{border-left:0}.frame-app .period-order h3{font-size:14px;line-height:20px;font-weight:500}
/* Account, access management and sign-in use the same type and flat surfaces. */
body:has(>.page){font-size:14px;line-height:20px}.page{padding:32px 0 64px}.page h1{font-size:30px;line-height:36px}.page h2{font-size:18px;line-height:28px}.page .section{border:0;border-top:1px solid var(--line);padding:24px 0;margin:24px 0;border-radius:0;background:none;box-shadow:none}.page .page-header{padding-bottom:8px;gap:24px}.page :is(button,.button,input,select){border-radius:8px;min-height:40px;font-size:14px;line-height:20px;padding:8px 12px;transition:opacity 300ms var(--frame-curve),background-color 300ms var(--frame-curve)}.page :is(input,select){min-height:48px;background:var(--panel);border-color:var(--strong-line)}.page .device{grid-template-columns:minmax(0,1fr) auto;gap:16px;padding:16px 0}.page .device strong{font-weight:500}.page .fact strong{font-size:20px;line-height:28px}.page .status{border-radius:4px;background:var(--control);color:var(--positive);font-size:12px;line-height:16px;border:0;padding:4px 8px}.page .status.expired,.page .status.blocked{color:var(--rose)}.page .danger{color:var(--rose)}
.login-page h1{font-size:30px;line-height:36px}.login-page .brand-icon{border-radius:16px}.login-page :is(button,.bot-link){font-size:16px;line-height:24px;border-radius:8px;min-height:48px;padding:12px}.login-page input{font-size:24px;line-height:32px;border-color:var(--strong-line);background:var(--panel)}.login-page button{background:var(--accent)}.login-page .auto-login-status{padding:16px 0}.login-page .login-spinner{border:0;border-radius:4px;background:var(--line);width:64px;height:8px;animation:frame-loading 1200ms var(--frame-curve) infinite alternate}.login-page button[aria-busy=true]::before{border:0;border-radius:4px;width:32px;height:8px;background:currentColor;animation:frame-loading 1200ms var(--frame-curve) infinite alternate}
@keyframes frame-loading{from{opacity:.35}to{opacity:.85}}
@media(min-width:1200px){.frame-app .project-card{flex:1 0 200px;max-width:calc((100% - 48px)/5)}}
@media(max-width:1100px){.frame-orders-layout{grid-template-columns:minmax(0,1fr) 224px;gap:24px}#frameWeekAside{padding-left:16px}.frame-navigation{gap:16px}.frame-navigation .main-tab,.frame-navigation [data-open-ai-overview]{padding:8px}.frame-app .project-card{flex-basis:192px}}
@media(max-width:1000px){.frame-orders-layout{display:block}#frameWeekAside{display:none}}
@media(max-width:860px){
  .frame-app .app-shell{padding:16px 16px 160px}.frame-navigation{display:flex;justify-content:space-between;margin-bottom:32px;border:0;border-radius:0;padding:0;min-height:32px;background:none;backdrop-filter:none}.frame-brand{font-size:20px;line-height:28px;gap:8px}.frame-navigation .workspace-brand-icon{width:28px;height:28px;flex-basis:28px}.frame-navigation .workspace-brand-icon img{width:52px;height:52px;inset:-12px}.frame-navigation #frameHeaderEnd{padding-right:40px}.frame-app #frameNavSlot{display:block}.frame-app .frame-navigation .main-tabs{display:block}.frame-navigation .main-tabs>:not(.frame-avatar){display:none}.frame-navigation .frame-avatar{right:0;width:28px;height:28px;min-height:28px}.frame-app #themeToggleButton{width:32px;height:32px;min-height:32px}.frame-app .topbar{display:block;margin-bottom:32px}.frame-app .topbar h1{font-size:24px;line-height:32px}.frame-app .desktop-actions{display:none}.frame-app #syncStatus{display:none}.frame-app .frame-summary{display:none}
  .frame-projects-section{margin-bottom:16px}.frame-app .projects-heading{gap:8px;margin-bottom:12px}.frame-app #openProjectPicker{font-size:16px;line-height:24px}.frame-app .project-heading-actions{gap:4px}.frame-app .project-heading-actions .sort-control select{width:104px;font-size:12px;padding-left:4px}.frame-app #desktopCreateProject{font-size:12px;padding:4px;min-height:32px}.frame-app #desktopCreateProject svg{width:16px;height:16px}.frame-app .project-card{flex-basis:168px;min-height:112px;padding:16px}.frame-app .project-card-main{min-height:80px}.frame-app .project-card-main .frame-project-title{font-size:12px;line-height:16px;gap:4px;margin-bottom:16px;padding-right:8px}.frame-app .project-card-main strong{font-size:20px;line-height:28px}.frame-app .project-card-main small{font-size:12px;line-height:16px}.frame-app .project-more{width:20px;min-width:20px;height:20px;min-height:20px;padding:2px;top:8px;right:4px}.frame-app .frame-project-title>svg{width:14px;height:14px}
  .frame-app .mobile-overview-actions{order:0;display:flex;align-items:center;justify-content:space-between;padding:8px 0 16px;margin:0 0 24px;border-bottom:1px solid var(--line);gap:12px;flex-wrap:nowrap}.frame-app .mobile-overview-actions .mobile-overview{display:flex;gap:8px;padding:0;min-height:32px;margin:0;border:0;background:none;font-size:14px;line-height:20px;font-weight:500;color:var(--ink)}.frame-app #frameAttentionButton{font-size:12px;line-height:16px;padding:0;border:0;background:none;white-space:nowrap}.frame-app .mobile-overview-actions .mobile-overview svg{width:16px;height:16px}
  .frame-app .orders-panel>.section-heading{margin-bottom:12px;gap:8px}.frame-app .orders-heading-copy{gap:8px}.frame-app .orders-heading-copy h2{font-size:16px;line-height:24px}.frame-order-tools{gap:0}.frame-app .frame-order-tools .sort-control select{width:136px}.frame-app .orders-toolbar{gap:8px;padding-bottom:12px}.frame-app .filters{gap:0}.frame-app .filter-button{padding:8px;font-size:12px;line-height:16px}.frame-app .view-toggle{padding:4px;gap:0}.frame-app .view-button{width:28px}
  .frame-app .order-item{grid-template-columns:32px minmax(0,1fr) auto;gap:12px;padding:16px}.frame-order-symbol{width:32px;height:32px}.frame-order-symbol>svg{width:16px!important;height:16px!important}.frame-app .order-title{font-size:14px;line-height:20px;font-weight:500}.frame-app .order-meta{gap:4px}.frame-order-timing{flex-basis:100%}.frame-order-timing::before{display:none}.frame-order-price{min-width:80px}.frame-app .order-total{font-size:14px;line-height:20px}.frame-payment-status{font-size:12px;line-height:16px;max-width:112px}.frame-due-note{font-size:12px;line-height:16px}.frame-app .orders-list.grid-view{grid-template-columns:minmax(0,1fr)}.frame-app .grid-view .order-item{grid-template-columns:32px minmax(0,1fr);padding:16px;gap:16px}.frame-app .grid-view .order-total{font-size:20px;line-height:28px}
  .frame-app .mobile-dock{position:fixed;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));padding:8px;border:1px solid var(--line);border-radius:24px;background:var(--glass);background-image:none;box-shadow:var(--frame-shadow);backdrop-filter:blur(24px);height:auto;min-height:0}.frame-app .mobile-dock::before,.frame-app .mobile-dock::after{display:none}.frame-app .mobile-dock .main-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:56px;padding:8px 4px;background:none;border:0;border-radius:16px;color:var(--muted);font-size:12px;line-height:16px;font-weight:400;box-shadow:none}.frame-app .mobile-dock .main-tab.active{background:var(--control);color:var(--accent);box-shadow:none}.frame-app .mobile-dock .main-tab svg{width:20px;height:20px}
  .frame-app .mobile-add{width:48px;height:48px;min-height:48px;right:24px;bottom:calc(112px + env(safe-area-inset-bottom));border:0;border-radius:50%;padding:0;background:var(--active-bg);color:var(--active-ink);box-shadow:0 8px 24px #0002}.frame-app .mobile-add svg{width:24px;height:24px}
  .frame-app :is(.detail-overlay,.editor-overlay,.settings-overlay,.confirm-overlay,.mobile-sheet-overlay){padding:24px 16px;align-items:center}.frame-app :is(.detail-modal,.editor-modal,.settings-modal,.confirm-box,.mobile-sheet,.ai-modal){border-radius:16px;background:var(--panel);background-image:none;max-height:calc(100dvh - 48px);border-color:var(--line)}.frame-app :is(.detail-modal,.editor-modal,.settings-modal,.confirm-box,.mobile-sheet){padding:16px}.frame-app :is(.modal-heading,.mobile-sheet-heading){padding:0 0 16px}.frame-app :is(.modal-heading,.mobile-sheet-heading) h2{font-size:18px;line-height:28px}.frame-app :is(.modal-heading,.mobile-sheet-heading) .icon-button{width:32px;height:32px;min-height:32px;min-width:32px;flex-basis:32px;background:var(--control);border:0;border-radius:8px}
  .frame-app :is(input,select,textarea){font-size:16px;line-height:24px;min-height:48px}.frame-app .inline-fields{gap:12px}.frame-app .payment-row{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) 32px}.frame-app .payment-row input{padding:8px;font-size:14px;line-height:20px}.frame-app #mobileCreateChoices button{font-size:14px;line-height:20px}.frame-app .ai-modal .modal-heading{padding:16px}.frame-app .ai-scroll{padding:16px}.frame-app .ai-totals{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.frame-app .ai-totals dd,.frame-app .ai-totals>div:first-child dd{font-size:24px;line-height:32px}.frame-app .distribution-layout{grid-template-columns:128px minmax(0,1fr);gap:16px}.frame-app #incomeDonut{width:128px;height:128px}.frame-app .income-legend-row{gap:8px}.frame-app .income-legend-name{font-size:12px;line-height:16px}.frame-app .income-legend-value strong{font-size:12px;line-height:16px}
  .frame-app .calendar-days{gap:4px}.frame-app .calendar-day{min-height:0;aspect-ratio:1/1.15;padding:8px 4px;min-width:0;font-size:14px;line-height:20px}.frame-app #calendarMonthTitle{font-size:18px;line-height:28px}.frame-app .calendar-scope{gap:16px;margin-block:24px}.frame-app .period-grid{gap:24px 16px}.frame-app .period-grid .metric strong{font-size:20px;line-height:28px}
  .frame-app .frame-settings-section>h2{font-size:16px;line-height:24px}.frame-app .frame-setting-control{gap:16px}.frame-app .frame-settings-section{padding:24px 0}.frame-app .frame-settings-logout{padding-top:32px}
  .page{width:calc(100% - 32px);padding-top:24px}.page h1{font-size:24px;line-height:32px}.page h2{font-size:16px;line-height:24px}.page .section{padding:24px 0;border-radius:0}.page .device{grid-template-columns:minmax(0,1fr) auto;gap:12px}.page .facts{gap:16px}.page .fact strong{font-size:16px;line-height:24px}
}
@media(max-width:480px){.frame-setting-row{grid-template-columns:minmax(0,1fr);gap:16px}.frame-setting-control{justify-content:flex-start;width:100%}.frame-app .project-heading-actions .sort-control select{width:32px;padding:0 24px 0 0;color:transparent}.frame-app .project-heading-actions .sort-control select option{color:var(--ink);background:var(--panel)}.frame-app .project-heading-actions .sort-control>svg:first-child{display:block;left:4px;width:16px;height:16px}.frame-app .project-heading-actions .sort-control>svg:last-child{display:none}.frame-app .frame-summary-note{margin-top:4px}}
@media(max-width:860px){.frame-app #frameHeaderEnd{gap:8px}.frame-app #frameHeaderEnd #syncStatus{display:grid;place-items:center;font-size:0;width:16px;max-width:16px;height:32px;overflow:hidden;line-height:0}.frame-app #frameHeaderEnd #syncStatus::before{content:'';display:block;width:6px;height:6px;border-radius:50%;background:var(--positive)}.frame-app #frameHeaderEnd #syncStatus.sync-problem{font-size:12px;line-height:16px;position:fixed;top:64px;left:16px;right:16px;z-index:5;max-width:none;width:auto;height:auto;padding:12px;border:1px solid var(--rose);background:var(--panel);border-radius:8px}.frame-app #frameHeaderEnd #syncStatus.sync-problem::before{display:none}}
.frame-app .calendar-page{gap:16px}.frame-app .calendar-page-heading{margin:0}.frame-app .calendar-scope{margin:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:16px}
@media(max-width:860px){body[data-frame-page=calendar] .frame-navigation{margin-bottom:24px}body[data-frame-page=calendar] .topbar{margin-bottom:24px}body[data-frame-page=calendar] #frameDate{display:none}.frame-app .calendar-scope{margin:0;grid-template-columns:minmax(0,1fr) auto;align-items:end}.frame-app .calendar-scope label{max-width:none}.frame-app .calendar-scope .calendar-view-toggle{align-self:end}.frame-app .calendar-view-toggle .ghost-button{font-size:12px;line-height:16px;min-height:40px;padding:8px}}
@media(max-width:360px){.frame-app .calendar-scope{grid-template-columns:minmax(0,1fr)}.frame-app .calendar-scope .calendar-view-toggle{justify-self:start}}
@media(max-width:480px){.frame-app .overview-views{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;max-width:100%}.frame-app .overview-views button{min-width:0;padding:8px;font-size:12px;line-height:16px}}
.frame-app .frame-order-price{min-width:0;max-width:160px}.frame-app .order-total{white-space:normal;overflow-wrap:anywhere}
@media(max-width:860px){.frame-app .frame-order-price{max-width:112px}}
.frame-app .grid-view .frame-order-price{max-width:100%}
@media(max-width:860px){.frame-order-price{max-width:112px}.frame-app .grid-view .frame-order-price{max-width:100%}.frame-app .mobile-dock .main-tab.active{color:var(--frame-accent-ink)}}
@media(max-width:360px){.frame-order-symbol{display:none}.frame-app .order-item{grid-template-columns:minmax(0,1fr) auto;gap:8px}.frame-app .grid-view .order-item{grid-template-columns:minmax(0,1fr)}.frame-app .grid-view .frame-order-price{grid-column:auto}.frame-app .distribution-layout{grid-template-columns:minmax(0,1fr)}.frame-app #incomeDonut{margin:0 auto;width:160px;height:160px}.frame-app .date-fields{grid-template-columns:minmax(0,1fr)}.frame-app .view-toggle{display:none}}
@media(prefers-reduced-motion:reduce){.frame-app *,.frame-app *::before,.frame-app *::after{animation:none!important;transition-property:opacity!important}.frame-app button:active{transform:none}.login-page .login-spinner{animation:none}}