/* 자동 생성(build.py) — C안 앱 tokens.css + app.css + 화면 <style> 을 .appframe 안으로 스코프. 손으로 고치지 말 것 */
.appframe{container:app / inline-size;position:relative;overflow:hidden;text-align:left;letter-spacing:normal}
.appframe{color-scheme: light;

  
  --bg:          #F2F2F4;   
  --surface:     #FFFFFF;   
  --surface-2:   #F6F6F7;   
  --surface-3:   #E8E8EC;   

  
  --ink:         #17171A;   
  --ink-2:       #4E4E57;   
  --ink-3:       #66666F;   
  --ink-off:     #A3A3AB;   

  
  --line:        #E6E6EA;   
  --line-2:      #D4D4DA;   
  --line-input:  #8C8C95;   
  --rail-bg:     #E8E8EC;   
  --rail-hover:  #DCDCE1;   

  
  --accent:        #35611F;  
  --accent-hover:  #2A4F17;
  --on-accent:     #FFFFFF;  
  --accent-ink:    #335D1D;  
  --accent-tint:   #EBF2E8;  
  --accent-tint-2: #D8E5D1;  

  
  --danger:      #D11F48;   
  --on-danger:   #FFFFFF;
  --danger-ink:  #B3173C;
  --danger-tint: #FDECEF;
  --ok-ink:      #0B6E73;   
  --ok-tint:     #E0F1F1;
  --ok-dot:      #14928F;   
  --warn-ink:    #8A5A00;   
  --warn-tint:   #FDF3DC;

  
  --badge-count-bg: var(--ink);       
  --badge-count-fg: var(--surface);
  --badge-mention-bg: var(--accent);  
  --badge-mention-fg: var(--on-accent);
  --badge-urgent-bg: var(--danger);   
  --badge-urgent-fg: var(--on-danger);
  --link:        var(--accent-ink);
  --new-divider: var(--accent);       
  --mention-bg:  var(--accent-tint);
  --selection:   #CDDFC3;
  --scrim:       rgba(23,23,26,.44);

  
  --av-1-bg:#E3E6F2; --av-1-fg:#2E3A66;
  --av-2-bg:#E6EFE9; --av-2-fg:#24513A;
  --av-3-bg:#F2E7E1; --av-3-fg:#6B3420;
  --av-4-bg:#EDE6F0; --av-4-fg:#523060;
  --av-5-bg:#F0EDE0; --av-5-fg:#564A16;
  --av-6-bg:#E1EEF0; --av-6-fg:#1E4D57;

  
  --chart-1:#648828; --chart-2:#4E78C7; --chart-3:#B95C3A; --chart-4:#009098; --chart-5:#A27000; --chart-6:#A85A99;

  
  --ring-panel:   0 0 0 1px var(--line);
  --shadow-pop:   0 0 0 1px rgba(23,23,26,.06), 0 4px 8px -2px rgba(23,23,26,.08), 0 12px 32px -4px rgba(23,23,26,.14);
  --shadow-sheet: 0 0 0 1px rgba(23,23,26,.06), 0 24px 64px -8px rgba(23,23,26,.28);
  --focus-ring:   0 0 0 2px var(--surface), 0 0 0 4px var(--accent);

  
  --font-sans: "Wanted Sans Variable", "Wanted Sans", -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  
  --font-mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  
  --t-micro:   11px;   
  --t-meta:    12px;   
  --t-small:   13px;   
  --t-ui:      14px;   
  --t-body:    15px;   
  --t-title:   17px;   
  --t-head:    22px;   
  --t-display: 30px;   
  --t-input:   16px;   

  
  --w-regular:  400;
  --w-medium:   500;
  --w-semibold: 600;

  --lh-tight: 1.25;
  --lh-ui:    1.4;
  --lh-body:  1.6;
  --ls-title: -0.015em;
  --ls-display: -0.025em;
  --ls-0: 0;

  
  --s-0: 2px;
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-8: 32px;
  --s-10: 40px;
  --s-12: 48px;

  
  --r-xs:   4px;    
  --r-sm:   6px;    
  --r-md:   10px;   
  --r-lg:   14px;   
  --r-pill: 999px;  

  
  --rail-w:   72px;
  --side-w:   264px;
  --thread-w: 360px;
  --head-h:   52px;
  --row-h:    32px;   
  --hit:      44px;   
  --ctl-sm:   28px;
  --ctl-md:   36px;
  --av-xs: 20px;
  --av-sm: 24px;
  --av-md: 32px;
  --av-lg: 40px;
  --icon-sm: 16px;
  --icon-md: 20px;
  --chat-max: 760px;
  --read-max: 960px;
  --sheet-w:  520px;
  --pop-w:    248px;
  --search-w: 200px;
  --mobbar:   60px;
  --gutter:   8px;    
  
  --shot-dark:   #17171A;
  --shot-light:  #FFFFFF;
  --shot-accent: #85C167;   
  --album-w:  280px;  
  --card-w:   420px;  

  
  --demo-h:    48px;
  --preview-w: 390px;
  --preview-h: 844px;

  
  --dur-1: 120ms;
  --dur-2: 200ms;
  --dur-3: 320ms;
  --ease-out: cubic-bezier(.16,1,.3,1);

  
  --z-sticky: 2;
  --z-nav: 10;
  --z-popover: 40;
  --z-sheet: 60;}
.appframe [data-fs="l"]{--t-micro:12px; --t-meta:13px; --t-small:14px; --t-ui:15px; --t-body:16px; --t-title:18px;}
.appframe [data-fs="xl"]{--t-micro:13px; --t-meta:14px; --t-small:15px; --t-ui:16px; --t-body:18px; --t-title:20px;}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .appframe{color-scheme: dark;
    --bg:#111114; --surface:#17171A; --surface-2:#1E1E22; --surface-3:#26262B;
    --ink:#EDEDF0; --ink-2:#B0B0B8; --ink-3:#8D8D96; --ink-off:#5C5C64;
    --line:#26262B; --line-2:#33333A; --line-input:#6E6E78; --rail-bg:#030304; --rail-hover:#1A1A1E; 
    --accent:#85C167; --accent-hover:#97D17B; --on-accent:#112009;
    --accent-ink:#A1D289; --accent-tint:#1C2518; --accent-tint-2:#283522;
    --danger:#FF5C7A; --on-danger:#111113; --danger-ink:#FF7A93; --danger-tint:#33141B;
    --ok-ink:#4CC7C0; --ok-tint:#0F2C2D; --ok-dot:#34B3AC;
    --warn-ink:#E8B04A; --warn-tint:#2E2410;
    --badge-count-bg:#EDEDF0; --badge-count-fg:#111113;
    --selection:#324927; --scrim:rgba(0,0,0,.6);
    --av-1-bg:#262C45; --av-1-fg:#C9D2F5; --av-2-bg:#1E3329; --av-2-fg:#BCE3CB;
    --av-3-bg:#3A2820; --av-3-fg:#F2CDBB; --av-4-bg:#33263A; --av-4-fg:#E2CCEE;
    --av-5-bg:#332E1A; --av-5-fg:#E6DBA8; --av-6-bg:#1A3237; --av-6-fg:#B5E0E8;
    
    --chart-1:#759B3D; --chart-2:#608BDB; --chart-3:#CD6E4C; --chart-4:#00A3AB; --chart-5:#B5820C; --chart-6:#BC6CAB;
    --ring-panel: 0 0 0 1px var(--line);
    --shadow-pop: 0 0 0 1px #33333A, 0 12px 32px -4px rgba(0,0,0,.6);
    --shadow-sheet: 0 0 0 1px #33333A, 0 24px 64px -8px rgba(0,0,0,.7);}}
:root[data-theme="dark"] .appframe{color-scheme: dark;
  --bg:#111114; --surface:#17171A; --surface-2:#1E1E22; --surface-3:#26262B;
  --ink:#EDEDF0; --ink-2:#B0B0B8; --ink-3:#8D8D96; --ink-off:#5C5C64;
  --line:#26262B; --line-2:#33333A; --line-input:#6E6E78; --rail-bg:#030304; --rail-hover:#1A1A1E; 
  --accent:#85C167; --accent-hover:#97D17B; --on-accent:#112009;
  --accent-ink:#A1D289; --accent-tint:#1C2518; --accent-tint-2:#283522;
  --danger:#FF5C7A; --on-danger:#111113; --danger-ink:#FF7A93; --danger-tint:#33141B;
  --ok-ink:#4CC7C0; --ok-tint:#0F2C2D; --ok-dot:#34B3AC;
  --warn-ink:#E8B04A; --warn-tint:#2E2410;
  --badge-count-bg:#EDEDF0; --badge-count-fg:#111113;
  --selection:#324927; --scrim:rgba(0,0,0,.6);
  --av-1-bg:#262C45; --av-1-fg:#C9D2F5; --av-2-bg:#1E3329; --av-2-fg:#BCE3CB;
  --av-3-bg:#3A2820; --av-3-fg:#F2CDBB; --av-4-bg:#33263A; --av-4-fg:#E2CCEE;
  --av-5-bg:#332E1A; --av-5-fg:#E6DBA8; --av-6-bg:#1A3237; --av-6-fg:#B5E0E8;
  --chart-1:#759B3D; --chart-2:#608BDB; --chart-3:#CD6E4C; --chart-4:#00A3AB; --chart-5:#B5820C; --chart-6:#BC6CAB;
  --ring-panel: 0 0 0 1px var(--line);
  --shadow-pop: 0 0 0 1px #33333A, 0 12px 32px -4px rgba(0,0,0,.6);
  --shadow-sheet: 0 0 0 1px #33333A, 0 24px 64px -8px rgba(0,0,0,.7);}
.appframe *,.appframe *::before,.appframe *::after{box-sizing:border-box}
.appframe,.appframe{margin:0;height:100%;overflow-x:hidden}
.appframe{background:var(--bg);color:var(--ink);
  font-family:var(--font-sans);font-size:var(--t-ui);line-height:var(--lh-ui);
  font-weight:var(--w-regular);word-break:keep-all;overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased;font-feature-settings:"ss01" 0;}
.appframe button,.appframe input,.appframe textarea,.appframe select{font:inherit;color:inherit}
.appframe button{cursor:pointer;background:none;border:0;padding:0}
.appframe ::selection{background:var(--selection);color:var(--ink)}
.appframe :focus{outline:none}
.appframe :focus-visible{box-shadow:var(--focus-ring);border-radius:var(--r-sm)}
.appframe input,.appframe textarea{caret-color:var(--accent)}
.appframe .ph,.appframe .ph-fill{font-size:var(--icon-md);line-height:1;flex:none}
.appframe .num{font-variant-numeric:tabular-nums;letter-spacing:var(--ls-0)}
.appframe .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.appframe *{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.appframe *::-webkit-scrollbar{width:var(--s-2);height:var(--s-2)}
.appframe *::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:var(--r-pill)}
.appframe .demo{height:var(--demo-h);display:flex;align-items:center;gap:var(--s-3);
  padding:0 var(--s-4);background:var(--surface);box-shadow:inset 0 -1px 0 var(--line);
  overflow-x:auto;white-space:nowrap;}
.appframe .demo__name{font-weight:var(--w-semibold);font-size:var(--t-small);display:flex;align-items:center;gap:var(--s-2)}
.appframe .demo__name .num{color:var(--ink-3);font-size:var(--t-meta);font-weight:var(--w-regular)}
.appframe .demo__gap{flex:1}
.appframe .seg{display:inline-flex;padding:var(--s-0);gap:var(--s-0);background:var(--surface-3);border-radius:var(--r-sm)}
.appframe .seg button{height:var(--ctl-sm);padding:0 var(--s-3);border-radius:var(--r-xs);font-size:var(--t-small);color:var(--ink-2);display:inline-flex;align-items:center;gap:var(--s-1)}
.appframe .seg button .ph{font-size:var(--icon-sm)}
.appframe .seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);font-weight:var(--w-medium);box-shadow:0 0 0 1px var(--line-2)}
.appframe .seg button:hover:not([aria-pressed="true"]){color:var(--ink)}
.appframe .stage{height:calc(100dvh - var(--demo-h));display:flex;justify-content:center}
.appframe .device{container:app / inline-size;width:100%;height:100%;position:relative}
.appframe .stage[data-width="mobile"]{padding:var(--s-4);background:var(--surface-3)}
.appframe .stage[data-width="mobile"] .device{width:var(--preview-w);height:min(var(--preview-h),100%);
  border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sheet);}
.appframe .app{height:100%;display:flex;background:var(--bg);position:relative;overflow:hidden}
.appframe .rail{width:var(--rail-w);flex:none;display:flex;flex-direction:column;align-items:center;padding:var(--s-2) 0;gap:var(--s-1)}
.appframe .rail__logo{width:var(--av-md);height:var(--av-md);border-radius:var(--r-sm);background:var(--accent);color:var(--on-accent);
  display:grid;place-items:center;font-weight:var(--w-semibold);font-size:var(--t-title);letter-spacing:var(--ls-title);margin:var(--s-1) 0 var(--s-2)}
.appframe .rail__nav{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;align-items:center;gap:var(--s-0);width:100%;padding:0 var(--s-2)}
.appframe .rail{--rail-cur:var(--bg)}
.appframe .app[data-divide="tone"] .rail{background:var(--rail-bg);--rail-cur:var(--rail-bg)}
.appframe .app[data-divide="tone"] .rbtn:hover .rbtn__ic{background:var(--rail-hover)}
.appframe .app[data-divide="line"] .rail{box-shadow:inset -1px 0 0 var(--line-2)}
.appframe .rail__sep{width:var(--s-6);height:1px;background:var(--line-2);margin:var(--s-1) 0;flex:none}
.appframe .rbtn{width:100%;flex:none;display:flex;flex-direction:column;align-items:center;gap:var(--s-0);padding:var(--s-0) 0;color:var(--ink-2);border-radius:var(--r-sm);position:relative}
.appframe .rbtn__ic{width:var(--s-10);height:var(--ctl-sm);display:grid;place-items:center;border-radius:var(--r-sm);transition:background var(--dur-1) var(--ease-out)}
.appframe .rbtn__lb{font-size:var(--t-micro);line-height:var(--lh-tight);font-weight:var(--w-medium)}
.appframe .rbtn:hover .rbtn__ic{background:var(--surface-3)}
.appframe .rbtn:hover{color:var(--ink)}
.appframe .rbtn[aria-current="page"]{color:var(--ink)}
.appframe .rbtn[aria-current="page"] .rbtn__ic{background:var(--surface);box-shadow:var(--ring-panel)}
.appframe .rbtn[aria-current="page"] .rbtn__lb{font-weight:var(--w-semibold)}
.appframe .rbtn .ph-fill{display:none}
.appframe .rbtn[aria-current="page"] .ph{display:none}
.appframe .rbtn[aria-current="page"] .ph-fill{display:block}
.appframe .rbtn .badge{position:absolute;top:0;left:calc(50% + var(--s-1));box-shadow:0 0 0 var(--s-0) var(--rail-cur)}
.appframe .rail__bot{display:flex;flex-direction:column;align-items:center;gap:var(--s-2);padding-top:var(--s-2);width:100%;padding-inline:var(--s-2)}
.appframe .badge{min-width:var(--s-5);height:var(--s-5);padding:0 var(--s-1);border-radius:var(--r-pill);
  font-size:var(--t-micro);font-weight:var(--w-semibold);line-height:var(--s-5);text-align:center;
  background:var(--badge-count-bg);color:var(--badge-count-fg);font-variant-numeric:tabular-nums}
.appframe .badge--mention{background:var(--badge-mention-bg);color:var(--badge-mention-fg)}
.appframe .badge--urgent{background:var(--badge-urgent-bg);color:var(--badge-urgent-fg)}
.appframe .av{width:var(--av-md);height:var(--av-md);border-radius:var(--r-pill);flex:none;display:grid;place-items:center;
  font-size:var(--t-small);font-weight:var(--w-semibold);background:var(--av-1-bg);color:var(--av-1-fg);position:relative}
.appframe .av--xs{width:var(--av-xs);height:var(--av-xs);font-size:var(--t-micro)}
.appframe .av--sm{width:var(--av-sm);height:var(--av-sm);font-size:var(--t-micro)}
.appframe .av--bot{border-radius:var(--r-sm)}
.appframe .av[data-c="2"]{background:var(--av-2-bg);color:var(--av-2-fg)}
.appframe .av[data-c="3"]{background:var(--av-3-bg);color:var(--av-3-fg)}
.appframe .av[data-c="4"]{background:var(--av-4-bg);color:var(--av-4-fg)}
.appframe .av[data-c="5"]{background:var(--av-5-bg);color:var(--av-5-fg)}
.appframe .av[data-c="6"]{background:var(--av-6-bg);color:var(--av-6-fg)}
.appframe .av--noah{background:var(--ink);color:var(--surface);border-radius:var(--r-sm)}
.appframe .av__on{position:absolute;right:calc(var(--s-0) * -1);bottom:calc(var(--s-0) * -1);width:var(--s-2);height:var(--s-2);border-radius:var(--r-pill);background:var(--ok-dot);box-shadow:0 0 0 var(--s-0) var(--bg)}
.appframe .avs{display:flex}
.appframe .avs .av{box-shadow:0 0 0 var(--s-0) var(--surface)}
.appframe .avs .av+.av{margin-left:calc(var(--s-1) * -1.5)}
.appframe .btn{height:var(--ctl-md);padding:0 var(--s-4);border-radius:var(--r-sm);display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);
  font-size:var(--t-ui);font-weight:var(--w-medium);white-space:nowrap;transition:background var(--dur-1) var(--ease-out),color var(--dur-1) var(--ease-out)}
.appframe .btn .ph{font-size:var(--icon-sm)}
.appframe .btn--sm{height:var(--ctl-sm);padding:0 var(--s-3);font-size:var(--t-small)}
.appframe .btn--primary{background:var(--accent);color:var(--on-accent)}
.appframe .btn--primary:hover{background:var(--accent-hover)}
.appframe .btn--secondary{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.appframe .btn--secondary:hover{background:var(--surface-2)}
.appframe .btn--ghost{color:var(--ink-2)}
.appframe .btn--ghost:hover{background:var(--surface-2);color:var(--ink)}
.appframe .btn--danger{color:var(--danger-ink)}
.appframe .btn:disabled{background:transparent;color:var(--ink-off);box-shadow:none;cursor:default}
.appframe .ibtn{width:var(--ctl-md);height:var(--ctl-md);border-radius:var(--r-sm);display:inline-grid;place-items:center;color:var(--ink-2);flex:none;transition:background var(--dur-1) var(--ease-out)}
.appframe .ibtn:hover{background:var(--surface-2);color:var(--ink)}
.appframe .ibtn--sm{width:var(--ctl-sm);height:var(--ctl-sm);position:relative}
.appframe .ibtn--sm::after{content:"";position:absolute;inset:calc((var(--ctl-sm) - var(--hit)) / 2)}
.appframe .ibtn--sm .ph{font-size:var(--icon-sm)}
.appframe .tag{display:inline-flex;align-items:center;gap:var(--s-1);height:var(--s-5);padding:0 var(--s-2);border-radius:var(--r-xs);
  font-size:var(--t-meta);font-weight:var(--w-medium);background:var(--surface-3);color:var(--ink-2);white-space:nowrap}
.appframe .tag .ph{font-size:var(--t-small)}
.appframe .tag--warn{background:var(--warn-tint);color:var(--warn-ink)}
.appframe .tag--ok{background:var(--ok-tint);color:var(--ok-ink)}
.appframe .tag--danger{background:var(--danger-tint);color:var(--danger-ink)}
.appframe .tag--lead{background:var(--ink);color:var(--surface)}
.appframe kbd{font-family:var(--font-mono);font-size:var(--t-micro);padding:0 var(--s-1);border-radius:var(--r-xs);background:var(--surface-3);color:var(--ink-2)}
.appframe .field{width:100%;height:var(--ctl-md);padding:0 var(--s-3);border-radius:var(--r-sm);border:1px solid var(--line-input);background:var(--surface);font-size:var(--t-ui)}
.appframe .field::placeholder,.appframe textarea::placeholder{color:var(--ink-3)}
.appframe .field:focus-visible,.appframe .field:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint-2)}
.appframe .side{width:var(--side-w);flex:none;display:flex;flex-direction:column;min-height:0;position:relative}
.appframe .side__resize{position:absolute;top:0;bottom:0;right:calc(var(--s-1) * -1);width:var(--s-2);cursor:col-resize;z-index:var(--z-sticky);touch-action:none}
.appframe .side__resize::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;transform:translateX(-50%);background:transparent;transition:background var(--dur-1) var(--ease-out)}
.appframe .side__resize:hover::after,.appframe .side__resize:focus-visible::after,.appframe .app.is-resizing .side__resize::after{background:var(--accent)}
.appframe .side__resize:focus-visible{box-shadow:none}
.appframe .app.is-resizing,.appframe .app.is-resizing *{cursor:col-resize !important;user-select:none}
.appframe .side__head{height:var(--head-h);display:flex;align-items:center;gap:var(--s-2);padding:0 var(--s-3) 0 var(--s-2)}
.appframe .side__org{font-size:var(--t-body);font-weight:var(--w-semibold);letter-spacing:var(--ls-title)}
.appframe .conn{display:inline-flex;align-items:center;gap:var(--s-1);font-size:var(--t-meta);color:var(--ink-3)}
.appframe .conn::before{content:"";width:var(--s-2);height:var(--s-2);border-radius:var(--r-pill);background:var(--ok-dot)}
.appframe .side__head .ibtn{margin-left:auto}
.appframe .side__search{padding:0 var(--s-2) var(--s-2);display:flex;flex-direction:column;gap:var(--s-2)}
.appframe .search{position:relative;display:flex;align-items:center}
.appframe .search .ph{position:absolute;left:var(--s-3);font-size:var(--icon-sm);color:var(--ink-3);pointer-events:none}
.appframe .search .field{padding-left:calc(var(--s-3) + var(--icon-sm) + var(--s-2));height:var(--ctl-sm);font-size:var(--t-small);background:var(--surface)}
.appframe .search kbd{position:absolute;right:var(--s-2)}
.appframe .ftabs{display:flex;gap:var(--s-1);padding:0 var(--s-2) var(--s-2)}
.appframe .ftabs button{height:var(--ctl-sm);padding:0 var(--s-3);border-radius:var(--r-pill);font-size:var(--t-small);color:var(--ink-2)}
.appframe .ftabs button:hover{background:var(--surface-3)}
.appframe .ftabs button[aria-pressed="true"]{background:var(--ink);color:var(--surface);font-weight:var(--w-medium)}
.appframe .side__scroll{flex:1;overflow-y:auto;padding:0 var(--s-2) var(--s-4)}
.appframe .sec{margin-top:var(--s-3)}
.appframe .sec__h{height:var(--ctl-sm);width:100%;display:flex;align-items:center;gap:var(--s-1);padding:0 var(--s-2);color:var(--ink-3);font-size:var(--t-meta);font-weight:var(--w-medium);border-radius:var(--r-sm)}
.appframe .sec__h .ph{font-size:var(--t-meta)}
.appframe .sec__h:hover{color:var(--ink)}
.appframe .sec__add{margin-left:auto;opacity:0}
.appframe .sec:hover .sec__add,.appframe .sec__add:focus-visible{opacity:1}
.appframe .ch{height:var(--row-h);width:100%;display:flex;align-items:center;gap:var(--s-2);padding:0 var(--s-2);border-radius:var(--r-sm);color:var(--ink-2);font-size:var(--t-ui);text-align:left}
.appframe .ch:hover{background:var(--surface-3);color:var(--ink)}
.appframe .ch>.ph{font-size:var(--icon-sm);color:var(--ink-3)}
.appframe .ch__nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appframe .ch--unread{color:var(--ink);font-weight:var(--w-semibold)}
.appframe .ch--unread>.ph{color:var(--ink-2)}
.appframe .ch[aria-current="page"]{background:var(--surface);color:var(--ink);font-weight:var(--w-medium);box-shadow:var(--ring-panel)}
.appframe .ch[aria-current="page"]>.ph{color:var(--ink-2)}
.appframe .ch__draft{font-size:var(--t-meta);color:var(--accent-ink);font-weight:var(--w-regular)}
.appframe .main{flex:1;min-width:0;margin:var(--gutter) var(--gutter) var(--gutter) 0;background:var(--surface);border-radius:var(--r-md);box-shadow:var(--ring-panel);display:flex;overflow:hidden;position:relative}
.appframe .screen{flex:1;min-width:0;display:flex}
.appframe .room{flex:1;min-width:0;display:flex;flex-direction:column}
.appframe .rhead{height:var(--head-h);flex:none;display:flex;align-items:center;gap:var(--s-3);padding:0 var(--s-3) 0 var(--s-5);box-shadow:inset 0 -1px 0 var(--line)}
.appframe .rhead__menu{display:none}
.appframe .rhead__title{display:flex;align-items:center;gap:var(--s-1);min-width:0}
.appframe .rhead__title .ph{color:var(--ink-3);font-size:var(--icon-sm)}
.appframe .rhead__title h1{margin:0;font-size:var(--t-title);font-weight:var(--w-semibold);letter-spacing:var(--ls-title);white-space:nowrap}
.appframe .rhead__topic{font-size:var(--t-small);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.appframe .rhead__count{font-size:var(--t-meta);color:var(--ink-2);display:flex;align-items:center;gap:var(--s-2);padding:var(--s-1) var(--s-2) var(--s-1) var(--s-1);border-radius:var(--r-pill)}
.appframe .rhead__count:hover{background:var(--surface-2)}
.appframe .rhead .search{width:var(--search-w)}
.appframe .rhead__acts{display:flex;gap:var(--s-1);align-items:center}
.appframe .pinbar{flex:none;display:flex;align-items:center;gap:var(--s-2);height:var(--ctl-md);padding:0 var(--s-5);font-size:var(--t-small);color:var(--ink-2);box-shadow:inset 0 -1px 0 var(--line)}
.appframe .pinbar .ph{font-size:var(--icon-sm);color:var(--ink-3)}
.appframe .pinbar b{font-weight:var(--w-medium);color:var(--ink)}
.appframe .pinbar .num{margin-left:auto;font-size:var(--t-meta);color:var(--ink-3)}
.appframe .log{flex:1;overflow-y:auto;padding:var(--s-2) 0 var(--s-4);position:relative}
.appframe .log__col{max-width:var(--chat-max)}
.appframe .day{position:sticky;top:var(--s-2);z-index:var(--z-sticky);display:flex;justify-content:center;margin:var(--s-4) 0 var(--s-2);pointer-events:none}
.appframe .day span{position:relative;pointer-events:auto;background:color-mix(in srgb,var(--surface) 78%,transparent);-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);box-shadow:var(--shadow-pop);border-radius:var(--r-pill);height:var(--s-6);padding:0 var(--s-3);display:inline-flex;align-items:center;font-size:var(--t-meta);font-weight:var(--w-medium);color:var(--ink-2)}
.appframe .msg{display:grid;grid-template-columns:var(--av-md) minmax(0,1fr);column-gap:var(--s-3);padding:var(--s-1) var(--s-5);position:relative}
.appframe .msg--first{padding-top:var(--s-3)}
.appframe .msg:hover,.appframe .msg.is-hover,.appframe .msg:focus-within{background:var(--surface-2)}
.appframe .msg__gut{display:flex;justify-content:center}
.appframe .msg__time-side{font-size:var(--t-micro);font-variant-numeric:tabular-nums;color:var(--ink-3);line-height:var(--lh-body);padding-top:var(--s-0);opacity:0}
.appframe .msg:hover .msg__time-side,.appframe .msg.is-hover .msg__time-side,.appframe .msg:focus-within .msg__time-side{opacity:1}
.appframe .msg__meta{display:flex;align-items:baseline;gap:var(--s-2);line-height:var(--lh-ui)}
.appframe .msg__name{font-size:var(--t-ui);font-weight:var(--w-semibold)}
.appframe .msg__time{font-size:var(--t-meta);color:var(--ink-3);font-variant-numeric:tabular-nums}
.appframe .msg__text{font-size:var(--t-body);line-height:var(--lh-body);margin:0;overflow-wrap:anywhere}
.appframe .msg__text a{color:var(--link);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.appframe .msg__edited{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .mention{background:var(--accent-tint-2);color:var(--accent-ink);font-weight:var(--w-medium);border-radius:var(--r-xs);padding:0 var(--s-1)}
.appframe .chref{background:var(--surface-3);color:var(--ink);border-radius:var(--r-xs);padding:0 var(--s-1);font-weight:var(--w-medium);white-space:nowrap}
.appframe .chref .ph{font-size:.85em;color:var(--ink-3);margin-right:var(--s-0);vertical-align:-0.05em}
.appframe .msg--mention{background:var(--mention-bg)}
.appframe .msg--mention:hover{background:var(--mention-bg)}
.appframe .msg--mine .msg__name::after{content:"나";margin-left:var(--s-2);font-size:var(--t-micro);font-weight:var(--w-medium);color:var(--ink-2);background:var(--surface-3);border-radius:var(--r-xs);padding:0 var(--s-1);vertical-align:2px}
.appframe .seen{display:inline-flex;align-items:center;gap:var(--s-1);font-size:var(--t-meta);color:var(--ink-3);margin-top:var(--s-1)}
.appframe .seen .ph{font-size:var(--icon-sm);color:var(--ok-ink)}
.appframe .acts{position:absolute;top:calc(var(--s-4) * -1);right:var(--s-5);display:none;align-items:center;gap:var(--s-0);padding:var(--s-0);background:var(--surface);border-radius:var(--r-sm);box-shadow:var(--shadow-pop);z-index:var(--z-sticky)}
.appframe .msg:hover .acts,.appframe .msg.is-hover .acts,.appframe .msg:focus-within .acts{display:flex}
.appframe .acts button{height:var(--ctl-sm);min-width:var(--ctl-sm);border-radius:var(--r-xs);display:grid;place-items:center;color:var(--ink-2);font-size:var(--t-ui)}
.appframe .acts button:hover{background:var(--surface-3);color:var(--ink)}
.appframe .acts .ph{font-size:var(--icon-sm)}
.appframe .acts i.sep{width:1px;height:var(--s-4);background:var(--line-2);margin:0 var(--s-1)}
.appframe .rx{display:flex;flex-wrap:wrap;gap:var(--s-1);margin-top:var(--s-2)}
.appframe .rx button{height:var(--s-6);padding:0 var(--s-2);border-radius:var(--r-pill);display:inline-flex;align-items:center;gap:var(--s-1);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line);font-size:var(--t-small)}
.appframe .rx button .num{font-size:var(--t-meta);color:var(--ink-2)}
.appframe .rx button[aria-pressed="true"]{background:var(--accent-tint);box-shadow:inset 0 0 0 1px var(--accent-tint-2)}
.appframe .rx button[aria-pressed="true"] .num{color:var(--accent-ink);font-weight:var(--w-semibold)}
.appframe .rx button:hover{box-shadow:inset 0 0 0 1px var(--line-input)}
.appframe .rx .rx__add{color:var(--ink-3);opacity:0}
.appframe .msg:hover .rx__add,.appframe .msg.is-hover .rx__add{opacity:1}
.appframe .rx__add .ph{font-size:var(--icon-sm)}
.appframe .tsum{display:flex;align-items:center;gap:var(--s-2);margin-top:var(--s-2);padding:var(--s-1) var(--s-2) var(--s-1) var(--s-1);border-radius:var(--r-sm);width:max-content;max-width:100%;font-size:var(--t-small)}
.appframe .tsum b{font-weight:var(--w-semibold);color:var(--ink)}
.appframe .tsum span{color:var(--ink-3)}
.appframe .tsum .ph{font-size:var(--icon-sm);color:var(--ink-3)}
.appframe .tsum:hover,.appframe .tsum[aria-expanded="true"]{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-2)}
.appframe .file{display:flex;align-items:center;gap:var(--s-3);margin-top:var(--s-2);padding:var(--s-3);max-width:var(--card-w);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface)}
.appframe .file__ic{width:var(--av-lg);height:var(--av-lg);border-radius:var(--r-sm);background:var(--danger-tint);color:var(--danger-ink);display:grid;place-items:center}
.appframe .file__nm{font-weight:var(--w-medium);font-size:var(--t-ui);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.appframe .file__mt{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .file>div{flex:1;min-width:0}
.appframe .album{display:flex;gap:var(--s-2);margin-top:var(--s-2);flex-wrap:wrap}
.appframe .shot{width:var(--album-w);max-width:100%;aspect-ratio:16/9;border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--s-4);gap:var(--s-1);background:var(--shot-dark);color:var(--shot-light)}
.appframe .shot b{font-size:var(--t-display);font-weight:var(--w-semibold);font-variant-numeric:tabular-nums;color:var(--shot-accent);line-height:1;letter-spacing:var(--ls-display)}
.appframe .shot small{font-size:var(--t-small)}
.appframe .shot--b{background:var(--shot-accent);color:var(--shot-dark)}
.appframe .shot--b b{color:var(--shot-dark)}
.appframe .album__cap{width:100%;font-size:var(--t-meta);color:var(--ink-3)}
.appframe .card{margin-top:var(--s-2);max-width:var(--card-w);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface);padding:var(--s-4);display:flex;flex-direction:column;gap:var(--s-3)}
.appframe .card__head{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-small);font-weight:var(--w-semibold)}
.appframe .card__head .ph{font-size:var(--icon-sm);color:var(--ink-2)}
.appframe .card__head .tag{margin-left:auto}
.appframe .steps{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-meta);color:var(--ink-3)}
.appframe .steps span{display:inline-flex;align-items:center;gap:var(--s-1)}
.appframe .steps .ph{font-size:var(--t-small)}
.appframe .steps .done{color:var(--ink-2)}
.appframe .steps .cur{color:var(--ink);font-weight:var(--w-semibold)}
.appframe .steps .cur::before{content:"";width:var(--s-2);height:var(--s-2);border-radius:var(--r-pill);background:var(--accent)}
.appframe .steps>i{flex:1;height:1px;background:var(--line-2);min-width:var(--s-3)}
.appframe .card__title{font-size:var(--t-title);font-weight:var(--w-semibold);letter-spacing:var(--ls-title);line-height:var(--lh-tight)}
.appframe .card__amt{font-size:var(--t-head);font-weight:var(--w-semibold);font-variant-numeric:tabular-nums;letter-spacing:var(--ls-title);line-height:var(--lh-tight)}
.appframe .card__why{font-size:var(--t-ui);color:var(--ink-2);line-height:var(--lh-body)}
.appframe .kv{display:grid;grid-template-columns:max-content 1fr;gap:var(--s-1) var(--s-4);font-size:var(--t-small);margin:0}
.appframe .kv dt{color:var(--ink-3)}
.appframe .kv dd{margin:0;color:var(--ink)}
.appframe .card__foot{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap}
.appframe .card__who{font-size:var(--t-meta);color:var(--ink-3);margin-right:auto}
.appframe .newsep{display:flex;align-items:center;gap:var(--s-2);margin:var(--s-3) var(--s-5) var(--s-1);color:var(--accent-ink);font-size:var(--t-meta);font-weight:var(--w-semibold)}
.appframe .newsep::before{content:"";flex:1;height:1px;background:var(--new-divider)}
.appframe .typing{height:var(--s-6);display:flex;align-items:center;gap:var(--s-2);padding:0 var(--s-5);font-size:var(--t-meta);color:var(--ink-3);flex:none}
.appframe .dots{display:inline-flex;gap:var(--s-0)}
.appframe .dots i{width:var(--s-1);height:var(--s-1);border-radius:var(--r-pill);background:var(--ink-3);animation:af-blink 1.2s var(--ease-out) infinite}
.appframe .dots i:nth-child(2){animation-delay:.15s}
.appframe .dots i:nth-child(3){animation-delay:.3s}
@keyframes af-blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
.appframe .composer{flex:none;margin:0 var(--s-5) var(--s-4);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-input);background:var(--surface);transition:box-shadow var(--dur-1) var(--ease-out)}
.appframe .composer:focus-within{box-shadow:inset 0 0 0 1px var(--accent),0 0 0 3px var(--accent-tint-2)}
.appframe .composer textarea{field-sizing:content;max-height:calc(var(--s-12) * 4);display:block;width:100%;border:0;background:transparent;resize:none;padding:var(--s-3) var(--s-4) var(--s-1);font-size:var(--t-body);line-height:var(--lh-body);min-height:var(--s-12)}
.appframe .composer textarea:focus-visible{box-shadow:none}
.appframe .ctools{display:flex;align-items:center;gap:var(--s-1);padding:var(--s-1) var(--s-2) var(--s-2)}
.appframe .ctools .ibtn{width:var(--ctl-sm);height:var(--ctl-sm)}
.appframe .ctools .ibtn .ph{font-size:var(--icon-md)}
.appframe .ctools .create{height:var(--ctl-sm);padding:0 var(--s-2) 0 var(--s-1);border-radius:var(--r-sm);display:inline-flex;align-items:center;gap:var(--s-1);font-size:var(--t-small);font-weight:var(--w-medium);color:var(--ink)}
.appframe .ctools .create .ph{font-size:var(--icon-md)}
.appframe .ctools .create:hover{background:var(--surface-2)}
.appframe .ctools i.sep{width:1px;height:var(--s-4);background:var(--line-2);margin:0 var(--s-1)}
.appframe .chint{margin-left:auto;font-size:var(--t-meta);color:var(--ink-3);display:flex;align-items:center;gap:var(--s-1)}
.appframe .send{height:var(--ctl-sm);padding:0 var(--s-3);margin-left:var(--s-2)}
.appframe .thread{width:var(--thread-w);flex:none;display:none;flex-direction:column;box-shadow:inset 1px 0 0 var(--line);min-width:0}
.appframe .app.thread-open .thread{display:flex}
.appframe .thread__head{height:var(--head-h);flex:none;display:flex;align-items:center;gap:var(--s-2);padding:0 var(--s-2) 0 var(--s-4);box-shadow:inset 0 -1px 0 var(--line)}
.appframe .thread__head h2{margin:0;font-size:var(--t-body);font-weight:var(--w-semibold)}
.appframe .thread__head span{font-size:var(--t-small);color:var(--ink-3);flex:1;display:flex;align-items:center;gap:var(--s-1)}
.appframe .thread__head span .ph{font-size:var(--t-small)}
.appframe .thread__back{display:none}
.appframe .thread__body{flex:1;overflow-y:auto;padding:var(--s-2) 0}
.appframe .thread .msg{padding-left:var(--s-4);padding-right:var(--s-4)}
.appframe .thread .acts{right:var(--s-4)}
.appframe .tsep{display:flex;align-items:center;gap:var(--s-2);margin:var(--s-3) var(--s-4) var(--s-1);font-size:var(--t-meta);color:var(--ink-3)}
.appframe .tsep::after{content:"";flex:1;height:1px;background:var(--line)}
.appframe .thread .composer{margin:0 var(--s-4) var(--s-4)}
.appframe .thread .composer textarea{min-height:var(--s-10)}
.appframe .view{flex-direction:column}
.appframe .vhead{flex:none;padding:var(--s-5) var(--s-8) 0;display:flex;flex-direction:column;gap:var(--s-4);box-shadow:inset 0 -1px 0 var(--line)}
.appframe .vhead__row{display:flex;align-items:flex-start;gap:var(--s-4)}
.appframe .vhead__txt{flex:1;min-width:0}
.appframe .vhead h1{margin:0;font-size:var(--t-head);font-weight:var(--w-semibold);letter-spacing:var(--ls-title);line-height:var(--lh-tight);display:flex;align-items:baseline;gap:var(--s-3)}
.appframe .vhead h1 .num{font-size:var(--t-ui);font-weight:var(--w-regular);color:var(--ink-3)}
.appframe .vhead p{margin:var(--s-1) 0 0;font-size:var(--t-ui);color:var(--ink-2)}
.appframe .vhead__acts{display:flex;align-items:center;gap:var(--s-2);flex:none}
.appframe .vhead__note{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .tabs{display:flex;gap:var(--s-5);overflow-x:auto;scrollbar-width:none;margin-bottom:-1px}
.appframe .tabs::-webkit-scrollbar{display:none}
.appframe .tabs button{height:var(--s-10);display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-ui);color:var(--ink-2);white-space:nowrap;box-shadow:inset 0 -2px 0 transparent;border-radius:0;flex:none}
.appframe .tabs button:hover{color:var(--ink)}
.appframe .tabs button[aria-selected="true"]{color:var(--ink);font-weight:var(--w-medium);box-shadow:inset 0 -2px 0 var(--ink)}
.appframe .tabs .num{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .vbody{flex:1;overflow-y:auto;padding:var(--s-6) var(--s-8) var(--s-12)}
.appframe .vbody__in{max-width:var(--read-max)}
.appframe .noah{max-width:var(--chat-max);margin-inline:auto}
.appframe .noah h2.hello{margin:var(--s-4) 0 var(--s-5);font-size:var(--t-display);font-weight:var(--w-medium);letter-spacing:var(--ls-display);line-height:var(--lh-tight);text-wrap:balance}
.appframe .ask{border-radius:var(--r-lg);box-shadow:inset 0 0 0 1px var(--line-input);background:var(--surface);transition:box-shadow var(--dur-1) var(--ease-out)}
.appframe .ask:focus-within{box-shadow:inset 0 0 0 1px var(--accent),0 0 0 3px var(--accent-tint-2)}
.appframe .ask textarea{display:block;width:100%;border:0;background:transparent;resize:none;padding:var(--s-4) var(--s-4) var(--s-2);font-size:var(--t-body);line-height:var(--lh-body);min-height:calc(var(--s-12) * 2)}
.appframe .ask textarea:focus-visible{box-shadow:none}
.appframe .ask__foot{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-2) var(--s-2) var(--s-2) var(--s-4)}
.appframe .ask__foot .chint{margin-left:0}
.appframe .ask__foot .btn{margin-left:auto}
.appframe .asknote{margin:var(--s-3) 0 0;font-size:var(--t-small);color:var(--ink-2);display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center}
.appframe .asknote b{font-weight:var(--w-semibold);color:var(--ink)}
.appframe .asknote .lk{color:var(--link);text-decoration:underline;text-underline-offset:3px}
.appframe .blk{margin-top:var(--s-10)}
.appframe .blk__h{display:flex;align-items:center;gap:var(--s-2);margin:0 0 var(--s-3);font-size:var(--t-small);font-weight:var(--w-semibold);color:var(--ink-2)}
.appframe .blk__h .lk{margin-left:auto;font-weight:var(--w-medium);color:var(--ink-2);display:inline-flex;align-items:center;gap:var(--s-1);font-size:var(--t-small)}
.appframe .blk__h .lk:hover{color:var(--ink)}
.appframe .blk__h .lk .ph{font-size:var(--icon-sm)}
.appframe .qa{padding:var(--s-5) 0;display:flex;flex-direction:column;gap:var(--s-3);box-shadow:inset 0 1px 0 var(--line)}
.appframe .qa__q{display:flex;gap:var(--s-3);align-items:flex-start}
.appframe .qa__q p{margin:0;font-size:var(--t-body);font-weight:var(--w-medium);flex:1}
.appframe .qa__q .num{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .wait{display:flex;flex-direction:column;gap:var(--s-2);padding-left:calc(var(--av-sm) + var(--s-3))}
.appframe .wait__st{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-small)}
.appframe .wait__st b{font-weight:var(--w-semibold)}
.appframe .wait__st .num{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .spin{width:var(--icon-sm);height:var(--icon-sm);border-radius:var(--r-pill);border:2px solid var(--line-2);border-top-color:var(--accent);animation:af-spin 900ms linear infinite;flex:none}
@keyframes af-spin{to{transform:rotate(1turn)}}
.appframe .stream{margin:0;font-size:var(--t-body);line-height:var(--lh-body);color:var(--ink-2)}
.appframe .stream::after{content:"";display:inline-block;width:2px;height:1em;vertical-align:-0.15em;margin-left:var(--s-0);background:var(--accent);animation:af-blink 1s steps(1) infinite}
.appframe .ans{padding-left:calc(var(--av-sm) + var(--s-3));display:flex;flex-direction:column;gap:var(--s-3)}
.appframe .ans p{margin:0;font-size:var(--t-body);line-height:var(--lh-body)}
.appframe .ans ol{margin:0;padding-left:var(--s-5);font-size:var(--t-body);line-height:var(--lh-body)}
.appframe .vref{display:inline-flex;align-items:center;gap:var(--s-1);height:var(--s-6);padding:0 var(--s-2);border-radius:var(--r-xs);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line-2);font-size:var(--t-small);color:var(--ink);vertical-align:1px}
.appframe .vref .ph{font-size:var(--icon-sm);color:var(--ink-3)}
.appframe .vref:hover{box-shadow:inset 0 0 0 1px var(--line-input)}
.appframe .why{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2);padding-top:var(--s-3);box-shadow:inset 0 1px 0 var(--line)}
.appframe .why__lb{font-size:var(--t-meta);font-weight:var(--w-semibold);color:var(--ink-3);margin-right:var(--s-1)}
.appframe .why .num{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .qgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-6) var(--s-4)}
.appframe .qg h3{margin:0 0 var(--s-1);font-size:var(--t-meta);font-weight:var(--w-medium);color:var(--ink-3)}
.appframe .qg button{display:block;width:100%;text-align:left;padding:var(--s-2);margin-left:calc(var(--s-2) * -1);border-radius:var(--r-sm);font-size:var(--t-ui);color:var(--ink-2);line-height:var(--lh-ui)}
.appframe .qg button:hover{background:var(--surface-2);color:var(--ink)}
.appframe .tadd{display:flex;gap:var(--s-2);max-width:var(--read-max)}
.appframe .tadd .field{flex:1}
.appframe .thelp{font-size:var(--t-small);color:var(--ink-3);margin:0 0 var(--s-4)}
.appframe .tgrp+.tgrp{margin-top:var(--s-8)}
.appframe .tgrp__h{display:flex;align-items:center;gap:var(--s-2);margin:0 0 var(--s-1);padding:0 var(--s-2);font-size:var(--t-small);font-weight:var(--w-semibold);color:var(--ink-2)}
.appframe .tgrp__h .ph{font-size:var(--icon-sm);color:var(--ink-3)}
.appframe .tgrp__h .num{font-weight:var(--w-regular);color:var(--ink-3);font-size:var(--t-meta)}
.appframe .trow{display:flex;align-items:flex-start;gap:var(--s-3);padding:var(--s-3) var(--s-2);border-radius:var(--r-sm);position:relative}
.appframe .trow+.trow{box-shadow:0 -1px 0 var(--line)}
.appframe .trow:hover{background:var(--surface-2);box-shadow:none}
.appframe .trow:hover+.trow{box-shadow:none}
.appframe .tchk{width:var(--s-5);height:var(--s-5);border-radius:var(--r-pill);box-shadow:inset 0 0 0 1.5px var(--line-input);flex:none;margin-top:var(--s-0);display:grid;place-items:center;color:transparent}
.appframe .tchk .ph{font-size:var(--t-meta)}
.appframe .tchk:hover{box-shadow:inset 0 0 0 1.5px var(--ink);color:var(--ink-3)}
.appframe .tmain{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--s-1)}
.appframe .ttx{font-size:var(--t-body);line-height:var(--lh-ui)}
.appframe .tmeta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1) var(--s-3);font-size:var(--t-meta);color:var(--ink-3)}
.appframe .tmeta>span{display:inline-flex;align-items:center;gap:var(--s-1)}
.appframe .tmeta .ph{font-size:var(--t-small)}
.appframe .tdue--over{color:var(--danger-ink);font-weight:var(--w-medium)}
.appframe .tgot{display:flex;align-items:center;gap:var(--s-2);margin-top:var(--s-1);font-size:var(--t-small);color:var(--ink-2)}
.appframe .tgot b{font-weight:var(--w-medium);color:var(--accent-ink)}
.appframe .tact{display:flex;gap:var(--s-1);opacity:0;transition:opacity var(--dur-1) var(--ease-out)}
.appframe .trow:hover .tact,.appframe .trow:focus-within .tact{opacity:1}
@media (hover:none){.appframe .tact{opacity:1}}
.appframe .tgo{color:var(--ink-3);align-self:center}
.appframe .tvis{margin-top:var(--s-10);font-size:var(--t-meta);color:var(--ink-3);display:flex;align-items:center;gap:var(--s-1)}
.appframe .tvis .ph{font-size:var(--icon-sm)}
.appframe .mobbar{display:none}
.appframe .pop{position:absolute;z-index:var(--z-popover);top:var(--pop-y,var(--s-12));left:var(--pop-x,var(--s-12));width:var(--pop-w);background:var(--surface);border-radius:var(--r-md);box-shadow:var(--shadow-pop);padding:var(--s-1);display:none;
  transform-origin:top right;animation:af-pop var(--dur-2) var(--ease-out)}
.appframe .pop.is-open{display:block}
@keyframes af-pop{from{transform:scale(.97) translateY(calc(var(--s-1) * -1))}}
.appframe .pop__rx{display:flex;gap:var(--s-0);padding:var(--s-1);box-shadow:inset 0 -1px 0 var(--line);margin-bottom:var(--s-1)}
.appframe .pop__rx button{flex:1;height:var(--ctl-md);border-radius:var(--r-sm);font-size:var(--t-title);display:grid;place-items:center}
.appframe .pop__rx button:hover{background:var(--surface-2)}
.appframe .pop__rx .ph{font-size:var(--icon-sm);color:var(--ink-2)}
.appframe .mi{width:100%;height:var(--ctl-md);display:flex;align-items:center;gap:var(--s-3);padding:0 var(--s-3);border-radius:var(--r-sm);font-size:var(--t-ui);color:var(--ink);text-align:left}
.appframe .mi .ph{font-size:var(--icon-sm);color:var(--ink-2)}
.appframe .mi:hover,.appframe .mi:focus-visible{background:var(--surface-2);box-shadow:none}
.appframe .mi--danger,.appframe .mi--danger .ph{color:var(--danger-ink)}
.appframe .mi kbd{margin-left:auto}
.appframe .pop hr{border:0;height:1px;background:var(--line);margin:var(--s-1) 0}
.appframe .scrim{position:absolute;inset:0;z-index:var(--z-sheet);background:var(--scrim);display:none;align-items:center;justify-content:center;padding:var(--s-6);animation:af-fade var(--dur-2) var(--ease-out)}
.appframe .scrim.is-open{display:flex}
@keyframes af-fade{from{opacity:0}}
.appframe .sheet{width:100%;max-width:var(--sheet-w);max-height:100%;overflow-y:auto;background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-sheet);display:flex;flex-direction:column;animation:af-rise var(--dur-3) var(--ease-out)}
@keyframes af-rise{from{opacity:0;transform:translateY(var(--s-3))}}
.appframe .sheet__head{display:flex;align-items:flex-start;gap:var(--s-3);padding:var(--s-6) var(--s-6) 0}
.appframe .sheet [tabindex="-1"]:focus-visible{box-shadow:none}
.appframe .sheet__head h2{margin:0;font-size:var(--t-head);font-weight:var(--w-semibold);letter-spacing:var(--ls-title);line-height:var(--lh-tight)}
.appframe .sheet__head p{margin:var(--s-2) 0 0;font-size:var(--t-ui);color:var(--ink-2);line-height:var(--lh-body)}
.appframe .sheet__head .ibtn{margin:calc(var(--s-2) * -1) calc(var(--s-2) * -1) 0 auto}
.appframe .sheet__body{padding:var(--s-6);display:flex;flex-direction:column;gap:var(--s-5)}
.appframe .fl{display:flex;flex-direction:column;gap:var(--s-2)}
.appframe .fl>span:first-child{font-size:var(--t-small);font-weight:var(--w-medium);color:var(--ink)}
.appframe .fl small{font-size:var(--t-meta);color:var(--ink-3);font-weight:var(--w-regular)}
.appframe .fl textarea.field{height:auto;min-height:calc(var(--s-12) * 2);padding:var(--s-2) var(--s-3);line-height:var(--lh-body);resize:vertical}
.appframe .fl2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4)}
.appframe .chips{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.appframe .chips button{height:var(--ctl-md);padding:0 var(--s-4);border-radius:var(--r-pill);font-size:var(--t-ui);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink-2)}
.appframe .chips button:hover{box-shadow:inset 0 0 0 1px var(--line-input);color:var(--ink)}
.appframe .chips button[aria-pressed="true"]{background:var(--ink);color:var(--surface);box-shadow:none;font-weight:var(--w-medium)}
.appframe .suffix{position:relative}
.appframe .suffix .field{padding-right:var(--s-8);font-variant-numeric:tabular-nums}
.appframe .suffix em{position:absolute;right:var(--s-3);top:50%;transform:translateY(-50%);font-style:normal;color:var(--ink-3);font-size:var(--t-ui)}
.appframe .line{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;padding:var(--s-3);border-radius:var(--r-sm);background:var(--surface-2);font-size:var(--t-ui)}
.appframe .line>span{display:inline-flex;align-items:center;gap:var(--s-2)}
.appframe .line .ph{font-size:var(--icon-sm);color:var(--ink-3)}
.appframe .line .num{margin-left:auto;font-size:var(--t-meta);color:var(--ink-3)}
.appframe .sheet__foot{display:flex;justify-content:flex-end;gap:var(--s-2);padding:var(--s-4) var(--s-6);box-shadow:inset 0 1px 0 var(--line);position:sticky;bottom:0;background:var(--surface)}
@container app (max-width: 1180px){.appframe .thread{position:absolute;right:0;top:0;bottom:0;background:var(--surface);z-index:var(--z-nav);box-shadow:inset 1px 0 0 var(--line),var(--shadow-pop)}
.appframe .rhead .search{display:none}}
@container app (max-width: 760px){.appframe .app{flex-direction:column}
.appframe .rail,.appframe .side{display:none}
.appframe .main{margin:0;border-radius:0;box-shadow:none;padding-bottom:var(--mobbar)}
.appframe .app.thread-open .thread{position:absolute;inset:0;width:auto;z-index:var(--z-sheet);box-shadow:none;animation:af-rise var(--dur-3) var(--ease-out)}
.appframe .thread__head{padding:0 var(--s-1)}
.appframe .thread__back{display:inline-grid;width:var(--hit);height:var(--hit)}
.appframe .thread__x{display:none}
.appframe .thread .composer{margin:0 var(--s-2) var(--s-2)}
.appframe .rhead{padding:0 var(--s-1);gap:var(--s-1)}
.appframe .rhead__menu{display:inline-grid;width:var(--hit);height:var(--hit)}
.appframe .rhead__acts .ibtn{width:var(--hit);height:var(--hit)}
.appframe .rhead__topic,.appframe .rhead__count,.appframe .rhead__pin{display:none}
.appframe .rhead__title{flex:1}
.appframe .rhead__title h1{overflow:hidden;text-overflow:ellipsis}
.appframe .rhead__count{padding:var(--s-1)}
.appframe .pinbar{padding:0 var(--s-4)}
.appframe .msg{padding-left:var(--s-4);padding-right:var(--s-4);grid-template-columns:var(--av-md) minmax(0,1fr)}
.appframe .msg__time-side{opacity:1}
.appframe .acts{display:none!important}
.appframe .msg.is-hover{background:transparent}
.appframe .newsep{margin-inline:var(--s-4)}
.appframe .typing{padding:0 var(--s-4)}
.appframe .shot{width:calc(50% - var(--s-1))}
.appframe .shot b{font-size:var(--t-head)}
.appframe .card,.appframe .file{max-width:100%}
.appframe .card__who{flex-basis:100%}
.appframe .card__foot .btn{flex:1}
.appframe .composer{margin:0 var(--s-2) var(--s-2)}
.appframe .composer textarea{font-size:var(--t-input);min-height:var(--hit);padding:var(--s-3) var(--s-3) var(--s-1)}
.appframe .ctools .ibtn.desk,.appframe .ctools i.sep,.appframe .chint{display:none}
.appframe .ctools .create{width:var(--hit);height:var(--hit);padding:0;justify-content:center}
.appframe .ctools .create span{display:none}
.appframe .ctools .ibtn{width:var(--hit);height:var(--hit)}
.appframe .send{height:var(--hit);margin-left:auto}
.appframe .vhead{padding:var(--s-4) var(--s-4) 0;gap:var(--s-3)}
.appframe .vhead__row{flex-wrap:wrap}
.appframe .vhead__note{display:none}
.appframe .vhead h1{font-size:var(--t-head)}
.appframe .vbody{padding:var(--s-4) var(--s-4) var(--s-12)}
.appframe .noah h2.hello{font-size:var(--t-head);margin-top:0}
.appframe .ask textarea{font-size:var(--t-input)}
.appframe .qgrid{grid-template-columns:minmax(0,1fr)}
.appframe .wait,.appframe .ans{padding-left:0}
.appframe .tadd{flex-wrap:wrap}
.appframe .tadd .field{flex-basis:100%;font-size:var(--t-input);height:var(--hit)}
.appframe .tadd .btn{flex:1;height:var(--hit)}
.appframe .trow{flex-wrap:wrap}
.appframe .tact{opacity:1;order:3;flex-basis:100%;padding-left:var(--s-5)}
.appframe .tact .btn{height:var(--hit)}
.appframe .trow{padding:var(--s-3) 0}
.appframe .tgrp__h{padding:0}
.appframe .fl2{grid-template-columns:1fr}
.appframe .field{font-size:var(--t-input);height:var(--hit)}
.appframe .mobbar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;position:absolute;left:0;right:0;bottom:0;height:var(--mobbar);background:var(--surface);box-shadow:inset 0 1px 0 var(--line);z-index:var(--z-nav)}
.appframe .mobbar>*{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s-1);color:var(--ink-2);position:relative;min-height:var(--hit)}
.appframe .mobbar>* span:last-child{font-size:var(--t-micro);font-weight:var(--w-medium)}
.appframe .mobbar>[aria-current="page"]{color:var(--ink)}
.appframe .mobbar .ph-fill{display:none}
.appframe .mobbar>[aria-current="page"] .ph{display:none}
.appframe .mobbar>[aria-current="page"] .ph-fill{display:block}
.appframe .mobbar .badge{position:absolute;top:var(--s-1);left:calc(50% + var(--s-1))}
.appframe .pop{left:var(--s-2)!important;right:var(--s-2);top:auto!important;bottom:calc(var(--mobbar) + var(--s-2));width:auto;transform-origin:bottom center}
.appframe .app.has-pop::after{content:"";position:absolute;inset:0;background:var(--scrim);z-index:calc(var(--z-popover) - 1)}
.appframe .mi{height:var(--hit)}
.appframe .scrim{align-items:flex-end;padding:0}
.appframe .sheet{max-width:none;border-radius:var(--r-lg) var(--r-lg) 0 0;max-height:92%}
.appframe .sheet__head{padding:var(--s-5) var(--s-4) 0}
.appframe .sheet__body{padding:var(--s-5) var(--s-4)}
.appframe .sheet__foot{padding:var(--s-3) var(--s-4)}
.appframe .sheet__foot .btn{flex:1;height:var(--hit)}}
.appframe .rail__nav{scrollbar-width:none}
.appframe .rail__nav::-webkit-scrollbar{display:none}
@media (prefers-reduced-motion: reduce){.appframe *,.appframe *::before,.appframe *::after{animation-duration:1ms!important;animation-iteration-count:1!important}
.appframe .pop,.appframe .sheet{animation:none}}
.appframe{--notif-w:      360px;   
  --ask-w:        360px;   
  --sheet-w-wide: 560px;   
  --sheet-w-doc:  720px;   
  --tile-min:     240px;}
.appframe [data-fs="s"]{--t-small:12px; --t-ui:13px; --t-body:14px; --t-title:16px;}
.appframe [data-font="system"]{--font-sans: system-ui, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;}
.appframe [hidden]{display:none!important}
.appframe a{color:inherit;text-decoration:none}
.appframe .demo__name{color:var(--ink)}
.appframe .demo__name:hover .num{color:var(--ink-2)}
.appframe{--mg-revenue:var(--av-2-fg); --mg-core:var(--av-1-fg); --mg-ai:var(--av-4-fg); --mg-growth:var(--av-3-fg); --mg-builder:var(--av-6-fg); --mg-slate:var(--ink-3);
  --mt-revenue:var(--av-2-bg); --mt-core:var(--av-1-bg); --mt-ai:var(--av-4-bg); --mt-growth:var(--av-3-bg); --mt-builder:var(--av-6-bg); --mt-slate:var(--surface-3);}
.appframe .field--sm{width:auto;height:var(--ctl-sm);padding:0 var(--s-2);font-size:var(--t-small)}
.appframe .demo-state{margin-top:var(--s-12);padding-top:var(--s-4);box-shadow:inset 0 1px 0 var(--line)}
.appframe .rail__cap{font-size:var(--t-micro);line-height:var(--lh-tight);color:var(--ink-3);white-space:nowrap;margin-bottom:var(--s-0);flex:none}
.appframe .rbtn--dim{opacity:.72}
.appframe .pop__head{display:flex;align-items:center;gap:var(--s-3);padding:var(--s-2) var(--s-3) var(--s-3);box-shadow:inset 0 -1px 0 var(--line);margin-bottom:var(--s-1)}
.appframe .pop__head b{display:block;font-weight:var(--w-semibold)}
.appframe .pop__head small{display:block;font-size:var(--t-meta);color:var(--ink-3)}
.appframe .pop__label{padding:var(--s-2) var(--s-3) var(--s-1);font-size:var(--t-meta);font-weight:var(--w-medium);color:var(--ink-3)}
.appframe .mi--2{height:auto;min-height:var(--ctl-md);padding:var(--s-2) var(--s-3);align-items:flex-start}
.appframe .mi--2 .ph{margin-top:var(--s-0)}
.appframe .mi small{display:block;font-size:var(--t-meta);color:var(--ink-3)}
.appframe .mi__on{margin-left:auto;visibility:hidden}
.appframe .mi[aria-pressed="true"] .mi__on{visibility:visible}
.appframe .pop--notif{width:var(--notif-w);padding:0;flex-direction:column;max-height:calc(100% - var(--s-12))}
.appframe .pop--notif.is-open{display:flex}
.appframe .nhead{display:flex;align-items:center;gap:var(--s-3);height:var(--head-h);flex:none;padding:0 var(--s-2) 0 var(--s-4);box-shadow:inset 0 -1px 0 var(--line)}
.appframe .nhead h2{margin:0;flex:1;font-size:var(--t-body);font-weight:var(--w-semibold)}
.appframe .nhead label{display:inline-flex;align-items:center;gap:var(--s-1);font-size:var(--t-small);color:var(--ink-2);cursor:pointer}
.appframe .nhead input{margin:0;accent-color:var(--accent)}
.appframe .pop--notif .ftabs{flex:none;padding:var(--s-2) var(--s-3);overflow-x:auto;scrollbar-width:none;box-shadow:inset 0 -1px 0 var(--line)}
.appframe .ftabs b{margin-left:var(--s-1);font-weight:var(--w-semibold)}
.appframe .nlist{overflow-y:auto;padding:var(--s-1)}
.appframe .ni{display:flex;align-items:flex-start;gap:var(--s-3);width:100%;padding:var(--s-3);border-radius:var(--r-sm);text-align:left}
.appframe .ni:hover{background:var(--surface-2)}
.appframe .ni.is-unread::after{content:"";width:var(--s-2);height:var(--s-2);margin-top:var(--s-2);border-radius:var(--r-pill);background:var(--accent);flex:none}
.appframe .ni__b{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--s-0)}
.appframe .ni__h{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-small)}
.appframe .ni__h b{font-weight:var(--w-semibold)}
.appframe .ni__p{font-size:var(--t-small);color:var(--ink-2);line-height:var(--lh-ui);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.appframe .ni__m{display:flex;align-items:center;gap:var(--s-1);font-size:var(--t-meta);color:var(--ink-3)}
.appframe .ni__m .ph{font-size:var(--t-meta)}
.appframe .sheet--wide{max-width:var(--sheet-w-wide)}
.appframe .sheet--doc{max-width:var(--sheet-w-doc)}
.appframe .sheet--ask{max-width:var(--ask-w)}
.appframe .sheet--ask .sheet__body{padding-bottom:var(--s-4)}
.appframe .sheet--ask .sheet__body p{margin:0;font-size:var(--t-body);line-height:var(--lh-body)}
.appframe .btn--destructive{background:var(--danger);color:var(--on-danger)}
.appframe .btn--destructive:hover{background:var(--danger-ink)}
.appframe .grp{display:flex;flex-direction:column;gap:var(--s-3);padding-bottom:var(--s-5);box-shadow:inset 0 -1px 0 var(--line)}
.appframe .grp:last-child{padding-bottom:0;box-shadow:none}
.appframe .grp h3{margin:0;font-size:var(--t-ui);font-weight:var(--w-semibold)}
.appframe .note{margin:0;font-size:var(--t-small);line-height:var(--lh-body);color:var(--ink-2)}
.appframe .lk{color:var(--link);text-decoration:underline;text-underline-offset:3px}
.appframe .setrow{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2) var(--s-3);flex-wrap:wrap}
.appframe .setrow>span{font-size:var(--t-small);color:var(--ink-2)}
.appframe .prof{display:flex;align-items:flex-start;gap:var(--s-4)}
.appframe .prof>.fl{flex:1;min-width:0}
.appframe .av--lg{width:var(--av-lg);height:var(--av-lg);font-size:var(--t-body)}
.appframe .handle{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .list{display:flex;flex-direction:column;padding:var(--s-1);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface)}
.appframe .lrow{display:flex;align-items:center;gap:var(--s-3);min-height:var(--s-12);padding:var(--s-2) var(--s-3);border-radius:var(--r-sm);width:100%;text-align:left}
.appframe .lrow+.lrow{box-shadow:0 -1px 0 var(--line)}
.appframe a.lrow:hover,.appframe button.lrow:hover{background:var(--surface-2);box-shadow:none}
.appframe .lrow__ic{width:var(--av-md);height:var(--av-md);border-radius:var(--r-sm);display:grid;place-items:center;flex:none;background:var(--surface-3);color:var(--ink-2)}
.appframe .lrow__ic .ph{font-size:var(--icon-sm)}
.appframe .lrow__ic--ok{background:var(--ok-tint);color:var(--ok-ink)}
.appframe .lrow__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--s-0)}
.appframe .lrow__t{font-size:var(--t-ui);font-weight:var(--w-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appframe .lrow__s{font-size:var(--t-meta);color:var(--ink-3);line-height:var(--lh-ui)}
.appframe .lrow__end{display:flex;align-items:center;gap:var(--s-2);flex:none}
.appframe .tour-why{padding:var(--s-4);border-radius:var(--r-md);background:var(--surface-2);font-size:var(--t-ui);line-height:var(--lh-body);color:var(--ink-2)}
.appframe .tour-why b{color:var(--ink);font-weight:var(--w-semibold)}
.appframe .morelist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-2)}
.appframe .morelist>a,.appframe .morelist>button{display:flex;align-items:center;gap:var(--s-3);min-width:0;height:var(--s-12);padding:0 var(--s-3);border-radius:var(--r-sm);background:var(--surface-2);font-size:var(--t-ui);color:var(--ink);text-align:left}
.appframe .morelist>a:hover,.appframe .morelist>button:hover{background:var(--surface-3)}
.appframe .morelist [aria-current="page"]{box-shadow:inset 0 0 0 1px var(--line-input);font-weight:var(--w-medium)}
.appframe .morelist span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appframe .morelist .ph{font-size:var(--icon-md);color:var(--ink-2)}
.appframe .morelist__cap{grid-column:1/-1;margin-top:var(--s-2);font-size:var(--t-meta);color:var(--ink-3)}
.appframe .empty{display:flex;flex-direction:column;align-items:center;gap:var(--s-2);padding:var(--s-12) var(--s-6);text-align:center;color:var(--ink-2)}
.appframe .empty__ic{width:var(--s-12);height:var(--s-12);margin-bottom:var(--s-2);border-radius:var(--r-md);display:grid;place-items:center;background:var(--surface-3);color:var(--ink-2)}
.appframe .empty h2{margin:0;font-size:var(--t-title);font-weight:var(--w-semibold);color:var(--ink);letter-spacing:var(--ls-title)}
.appframe .empty p{margin:0;max-width:var(--sheet-w);font-size:var(--t-ui);line-height:var(--lh-body)}
.appframe .empty .btn{margin-top:var(--s-2)}
.appframe .empty details{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .empty--fail .empty__ic{background:var(--danger-tint);color:var(--danger-ink)}
.appframe .tbl-wrap{overflow-x:auto;border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface)}
.appframe .tbl{width:100%;border-collapse:collapse;font-size:var(--t-small);font-variant-numeric:tabular-nums}
.appframe .tbl th{padding:var(--s-2) var(--s-3);text-align:left;white-space:nowrap;font-size:var(--t-meta);font-weight:var(--w-medium);color:var(--ink-3);box-shadow:inset 0 -1px 0 var(--line)}
.appframe .tbl td{padding:var(--s-3);vertical-align:top;box-shadow:inset 0 -1px 0 var(--line)}
.appframe .tbl tr:last-child td{box-shadow:none}
.appframe .tbl tbody tr:hover{background:var(--surface-2)}
.appframe .tbl .r{text-align:right}
.appframe .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--tile-min),1fr));gap:var(--s-4)}
.appframe .grid>.card{margin:0;max-width:none}
.appframe .stat{display:flex;flex-direction:column;gap:var(--s-1);padding:var(--s-4);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface)}
.appframe .stat__k{font-size:var(--t-small);color:var(--ink-2)}
.appframe .stat__v{font-size:var(--t-head);font-weight:var(--w-semibold);letter-spacing:var(--ls-title);line-height:var(--lh-tight);font-variant-numeric:tabular-nums}
.appframe .stat__d{font-size:var(--t-meta);color:var(--ink-3)}
.appframe .stat--due .stat__v{color:var(--danger-ink)}
.appframe .toast{position:absolute;left:0;right:0;bottom:var(--s-6);margin-inline:auto;width:max-content;max-width:calc(100% - var(--s-8));z-index:var(--z-sheet);display:none;align-items:center;gap:var(--s-3);min-height:var(--ctl-md);padding:var(--s-1) var(--s-2) var(--s-1) var(--s-4);border-radius:var(--r-pill);background:var(--ink);color:var(--surface);font-size:var(--t-ui);box-shadow:var(--shadow-pop)}
.appframe .toast.is-open{display:flex;animation:af-rise var(--dur-2) var(--ease-out)}
.appframe .toast button{height:var(--ctl-sm);padding:0 var(--s-3);border-radius:var(--r-pill);font-weight:var(--w-semibold);color:var(--surface);text-decoration:underline;text-underline-offset:3px}
@container app (max-width: 760px){.appframe .side__resize{display:none}
.appframe .app.side-open .side{display:flex;position:absolute;left:0;right:0;top:0;bottom:var(--mobbar);width:auto;z-index:var(--z-nav);background:var(--bg);animation:af-fade var(--dur-2) var(--ease-out)}
.appframe .pop--notif{width:auto;max-height:calc(100% - var(--mobbar) - var(--s-4))}
.appframe .toast{bottom:calc(var(--mobbar) + var(--s-3))}
.appframe .grid{grid-template-columns:minmax(0,1fr)}
.appframe .field--sm{height:var(--hit);font-size:var(--t-input)}
.appframe .prof{flex-wrap:wrap}
.appframe .empty{padding:var(--s-10) var(--s-4)}}
/* appr.html */
.appframe .appr-sec__dot{width:var(--s-2);height:var(--s-2);border-radius:var(--r-pill);background:var(--ink-3);flex:none}
.appframe .appr-sec__dot--formal{background:var(--warn-ink)}
.appframe .appr-sec__dot--work{background:var(--accent)}
.appframe .appr-sec__note{font-weight:var(--w-regular);color:var(--ink-3);font-size:var(--t-meta)}
.appframe .appr-row{align-items:center}
.appframe .appr-row .lrow__ic{align-self:flex-start}
.appframe .appr-open{text-align:left;cursor:pointer}
.appframe .appr-open:hover .ttx{text-decoration:underline;text-underline-offset:3px}
.appframe .appr-amt{margin-left:var(--s-2);font-weight:var(--w-semibold)}
.appframe .appr-side{display:flex;flex-direction:column;align-items:flex-end;gap:var(--s-2);flex:none}
.appframe .appr-st{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;justify-content:flex-end}
.appframe .appr-acts{display:flex;align-items:center;gap:var(--s-1)}
.appframe .appr-acts i.sep{width:1px;height:var(--s-4);background:var(--line-2);margin:0 var(--s-1)}
.appframe .appr-auto{font-size:var(--t-meta);color:var(--ink-2);display:inline-flex;align-items:center;gap:var(--s-1)}
.appframe .appr-auto--soon{color:var(--danger-ink);font-weight:var(--w-medium)}
.appframe .appr-auto--hold{color:var(--warn-ink)}
.appframe .appr-note{font-size:var(--t-small);color:var(--ink-2)}
.appframe .appr-f{margin:0 0 var(--s-4)}
.appframe .appr-steps{flex-wrap:wrap;row-gap:var(--s-2)}
.appframe .appr-steps .no{color:var(--danger-ink);font-weight:var(--w-semibold)}
.appframe .appr-steps .av{margin-right:var(--s-0)}
.appframe .appr-why{padding:var(--s-3);border-radius:var(--r-sm);background:var(--danger-tint);color:var(--danger-ink);font-size:var(--t-small);line-height:var(--lh-body)}
.appframe .appr-files{display:flex;flex-direction:column;gap:var(--s-1)}
.appframe .appr-files a{display:inline-flex;align-items:center;gap:var(--s-2);font-size:var(--t-small);color:var(--link)}
.appframe .appr-forms{display:flex;flex-direction:column;gap:var(--s-4)}
.appframe .appr-forms h3{margin:0 0 var(--s-1);font-size:var(--t-meta);font-weight:var(--w-medium);color:var(--ink-3)}
.appframe .appr-seq{color:var(--ink-3);font-weight:var(--w-regular);margin-right:var(--s-1)}
.appframe .appr-route{display:flex;flex-direction:column;gap:var(--s-2)}
.appframe .appr-cc{font-weight:var(--w-regular);font-size:var(--t-meta);color:var(--ink-3)}
.appframe .appr-wait{padding:var(--s-3);border-radius:var(--r-sm);background:var(--surface-2);font-size:var(--t-small);color:var(--ink-2);line-height:var(--lh-body)}
.appframe .appr-money{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-2)}
.appframe .appr-money select{width:auto}
.appframe .appr-tbl .field{height:var(--ctl-sm);min-width:calc(var(--s-12) * 2)}
.appframe .appr-tbl td{padding:var(--s-1)}
.appframe .appr-err{font-size:var(--t-small);color:var(--danger-ink)}
.appframe .appr-chip{display:inline-flex;align-items:center;gap:var(--s-1)}
@container app (max-width: 760px){.appframe .appr-row{flex-wrap:wrap}
.appframe .appr-side{flex-basis:100%;align-items:stretch;padding-left:calc(var(--av-md) + var(--s-3))}
.appframe .appr-st{justify-content:flex-start}
.appframe .appr-acts{flex-wrap:wrap}
.appframe .appr-acts .btn{height:var(--hit);flex:1}
.appframe .appr-acts i.sep{display:none}
.appframe .appr-row .tgo{display:none}}
/* turn.html */
.appframe .turn-sec+.turn-sec{margin-top:var(--s-8)}
.appframe .turn-sec .blk__h .badge{margin-left:var(--s-1)}
.appframe .turn-row .lrow__s{display:flex;align-items:center;gap:var(--s-2);min-width:0}
.appframe .turn-row .lrow__s>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appframe .turn-left{font-size:var(--t-meta);color:var(--warn-ink);white-space:nowrap}
.appframe .turn-row .ph-caret-right{color:var(--ink-3)}
@container app (max-width: 760px){.appframe .turn-row{align-items:flex-start}
.appframe .turn-row .lrow__t{white-space:normal}
.appframe .turn-row .lrow__end{padding-top:var(--s-1)}
.appframe .turn-row .lrow__s{flex-wrap:wrap}
.appframe .turn-row .lrow__s>span:last-child{white-space:normal}}
/* att.html */
.appframe .att-nag{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-2) var(--s-3);padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--warn-tint);color:var(--warn-ink);font-size:var(--t-ui);margin-bottom:var(--s-6)}
.appframe .att-nag>span{flex:1;min-width:0;display:flex;gap:var(--s-2);align-items:flex-start}
.appframe .att-nag>span .ph{font-size:var(--icon-sm);margin-top:var(--s-0)}
.appframe .att-note{display:flex;gap:var(--s-2);align-items:flex-start;padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--surface-2);margin-bottom:var(--s-4)}
.appframe .att-ks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-3)}
.appframe .att-ks .stat__v small{font-size:var(--t-small);font-weight:var(--w-regular);color:var(--ink-3);margin-left:var(--s-1)}
.appframe a.stat:hover{background:var(--surface-2)}
.appframe .att-ks a.stat .stat__v{color:var(--warn-ink)}
.appframe .att-sub{margin-top:var(--s-4)}
.appframe .att-today{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface)}
.appframe .att-cell{display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-4)}
.appframe .att-cell+.att-cell{box-shadow:inset 1px 0 0 var(--line)}
.appframe .att-cell>span{font-size:var(--t-small);color:var(--ink-2)}
.appframe .att-cell b{font-size:var(--t-head);font-weight:var(--w-semibold);letter-spacing:var(--ls-title);line-height:var(--lh-tight);font-variant-numeric:tabular-nums}
.appframe .att-cell em{font-style:normal;font-size:var(--t-meta);color:var(--ink-3)}
.appframe .att-cell .btn{align-self:flex-start}
.appframe .att-why{margin-top:var(--s-3)}
.appframe .att-hbtn{margin-left:auto}
.appframe .att-tbl td em{font-style:normal;color:var(--ink-3);margin-left:var(--s-1)}
.appframe .att-tbl td.att-none{color:var(--ink-3)}
@container app (max-width: 760px){.appframe .att-ks{grid-template-columns:repeat(2,minmax(0,1fr))}
.appframe .att-today{grid-template-columns:minmax(0,1fr)}
.appframe .att-cell{flex-direction:row;align-items:center;flex-wrap:wrap;min-height:var(--s-12);padding:var(--s-3) var(--s-4)}
.appframe .att-cell+.att-cell{box-shadow:inset 0 1px 0 var(--line)}
.appframe .att-cell>span{width:var(--s-12)}
.appframe .att-cell b{font-size:var(--t-title)}
.appframe .att-cell .btn{margin-left:auto;height:var(--hit)}
.appframe .att-nag>span{flex-basis:100%}
.appframe .att-nag .btn{height:var(--hit)}}
/* cal.html */
.appframe .cal-up{display:flex;align-items:center;gap:var(--s-3) var(--s-4);flex-wrap:wrap;padding:var(--s-4);border-radius:var(--r-md);background:var(--surface-2);margin-bottom:var(--s-5)}
.appframe .cal-up>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--t-small);color:var(--ink-2);line-height:var(--lh-body)}
.appframe .cal-up b{font-size:var(--t-ui);color:var(--ink);font-weight:var(--w-semibold)}
.appframe .cal-pick{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.appframe .cal-pick button{height:var(--ctl-sm);padding:0 var(--s-3);border-radius:var(--r-pill);font-size:var(--t-small);display:inline-flex;align-items:center;gap:var(--s-2);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink)}
.appframe .cal-pick button:hover{background:var(--surface-2)}
.appframe .cal-dot{display:inline-block;width:var(--s-2);height:var(--s-2);border-radius:var(--r-pill);background:var(--c);flex:none}
.appframe .cal-pick button[aria-pressed="false"]{color:var(--ink-3)}
.appframe .cal-pick button[aria-pressed="false"] .cal-dot{background:transparent;box-shadow:inset 0 0 0 1px var(--ink-3)}
.appframe .cal-pick .ph{font-size:var(--icon-sm);color:var(--ink-3)}
.appframe .cal-off{margin:var(--s-2) 0 0;font-size:var(--t-small);color:var(--ink-3)}
.appframe .cal-off .lk{font-size:var(--t-small)}
.appframe .cal-fail{margin-top:var(--s-4);padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--warn-tint);color:var(--warn-ink);font-size:var(--t-small)}
.appframe .cal-fail .lk{color:inherit}
.appframe .cal-days{margin-top:var(--s-6)}
.appframe .cal-dh{margin:var(--s-6) 0 var(--s-2);font-size:var(--t-small);font-weight:var(--w-semibold);color:var(--ink-2);display:flex;align-items:center;gap:var(--s-2)}
.appframe .cal-dh:first-child{margin-top:0}
.appframe .cal-dh.is-today{color:var(--ink)}
.appframe .cal-dh.is-today::before{content:"";width:var(--s-2);height:var(--s-2);border-radius:var(--r-pill);background:var(--accent)}
.appframe .cal-ev{display:grid;grid-template-columns:calc(var(--s-12) * 2) minmax(0,1fr) auto;align-items:center;gap:var(--s-1) var(--s-4);width:100%;text-align:left;padding:var(--s-3);border-radius:var(--r-sm);cursor:pointer}
.appframe .cal-ev+.cal-ev{box-shadow:0 -1px 0 var(--line)}
.appframe .cal-ev:hover{background:var(--surface-2);box-shadow:none}
.appframe .cal-tm{font-size:var(--t-small);color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.appframe .cal-tm.all{color:var(--ink-3)}
.appframe .cal-main{min-width:0;display:flex;flex-direction:column;gap:var(--s-0)}
.appframe .cal-t{display:flex;align-items:center;gap:var(--s-2);min-width:0;font-size:var(--t-ui);font-weight:var(--w-medium)}
.appframe .cal-t>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appframe .cal-s{font-size:var(--t-meta);color:var(--ink-3);display:flex;align-items:center;gap:var(--s-2);min-width:0}
.appframe .cal-act{display:flex;gap:var(--s-1)}
.appframe .cal-rec .cal-recdot{width:var(--s-2);height:var(--s-2);border-radius:var(--r-pill);background:var(--danger)}
.appframe .cal-nav{display:flex;align-items:center;gap:var(--s-2);margin-top:var(--s-6)}
.appframe .cal-nav b{font-size:var(--t-title);font-weight:var(--w-semibold);letter-spacing:var(--ls-title);min-width:calc(var(--s-12) * 2.5);text-align:center}
.appframe .cal-mon{margin-top:var(--s-3);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface);overflow:hidden}
.appframe .cal-wd,.appframe .cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.appframe .cal-wd div{padding:var(--s-2);font-size:var(--t-meta);color:var(--ink-3);text-align:center;box-shadow:inset 0 -1px 0 var(--line)}
.appframe .cal-cell{min-height:calc(var(--s-12) * 2);padding:var(--s-1);display:flex;flex-direction:column;gap:var(--s-0);box-shadow:inset -1px -1px 0 var(--line);min-width:0}
.appframe .cal-cell.out{background:var(--surface-2)}
.appframe .cal-cell.out .cal-dn{color:var(--ink-off)}
.appframe .cal-dn{font-size:var(--t-meta);color:var(--ink-2);padding:var(--s-0) var(--s-1);font-variant-numeric:tabular-nums;align-self:flex-start;border-radius:var(--r-pill);min-width:var(--s-5);text-align:center}
.appframe .cal-cell.sun .cal-dn,.appframe .cal-cell.hol .cal-dn{color:var(--danger-ink)}
.appframe .cal-cell.now .cal-dn{background:var(--accent);color:var(--on-accent);font-weight:var(--w-semibold)}
.appframe .cal-mev{display:block;width:100%;text-align:left;font-size:var(--t-micro);line-height:var(--lh-ui);padding:0 var(--s-1);border-radius:var(--r-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.appframe .cal-mev:hover{background:var(--surface-3)}
.appframe .cal-mev.all{background:var(--surface-3)}
.appframe .cal-mev .num{color:var(--ink-3);margin-right:var(--s-1)}
.appframe .cal-more{font-size:var(--t-micro);color:var(--ink-3);padding:0 var(--s-1)}
.appframe .cal-foot{margin-top:var(--s-10);font-size:var(--t-small);color:var(--ink-3);display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-3);align-items:center}
.appframe .cal-foot .lk{display:inline-flex;align-items:center;gap:var(--s-1)}
.appframe .cal-none{margin-top:var(--s-6)}
@container app (max-width: 760px){.appframe .cal-ev{grid-template-columns:minmax(0,1fr);gap:var(--s-1);padding:var(--s-3)}
.appframe .cal-act{margin-top:var(--s-1)}
.appframe .cal-act .btn{height:var(--hit)}
.appframe .cal-cell{min-height:calc(var(--s-12) * 1.5)}
.appframe .cal-mev .num{display:none}
.appframe .cal-up .btn{width:100%;height:var(--hit)}}
/* minutes.html */
.appframe .mn-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-2);margin:0 0 var(--s-8);padding:0;list-style:none}
.appframe .mn-flow li{padding:var(--s-3);border-radius:var(--r-sm);background:var(--surface-2);display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--t-meta);color:var(--ink-3);line-height:var(--lh-ui)}
.appframe .mn-flow b{font-size:var(--t-small);font-weight:var(--w-semibold);color:var(--ink);display:flex;align-items:center;gap:var(--s-2)}
.appframe .mn-flow .num{color:var(--ink-3);font-weight:var(--w-regular)}
.appframe .mn-row{align-items:center;width:100%;text-align:left;cursor:pointer}
.appframe .mn-row:hover .ttx{text-decoration:underline;text-underline-offset:3px}
.appframe .mn-left{font-size:var(--t-meta);color:var(--ink-2);display:inline-flex;align-items:center;gap:var(--s-1);flex:none}
.appframe .mn-rec{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;padding:var(--s-3) var(--s-4);margin:0 0 var(--s-6);border-radius:var(--r-md);background:var(--danger-tint);color:var(--danger-ink)}
.appframe .mn-rec__dot{width:var(--s-2);height:var(--s-2);border-radius:var(--r-pill);background:var(--danger);animation:af-mnblink calc(var(--dur-3) * 4) var(--ease-out) infinite}
.appframe .mn-rec b{font-weight:var(--w-semibold);color:var(--ink)}
.appframe .mn-rec .num{color:var(--ink-2)}
.appframe .mn-rec__acts{margin-left:auto;display:flex;gap:var(--s-2)}
@keyframes af-mnblink{50%{opacity:.3}}
.appframe .mn-lede{display:block;margin-top:var(--s-1);color:var(--ink-3);font-size:var(--t-small)}
.appframe .mn-prev{align-self:flex-start}
.appframe .mn-zone{display:flex;flex-direction:column;gap:var(--s-2)}
.appframe .mn-zone--sug{padding:var(--s-3);border-radius:var(--r-md);background:var(--accent-tint)}
.appframe .mn-card{display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-3);border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface);font-size:var(--t-ui);line-height:var(--lh-body)}
.appframe .mn-card em{display:block;font-style:normal;font-size:var(--t-meta);color:var(--ink-3)}
.appframe .mn-card__a{display:flex;flex-wrap:wrap;gap:var(--s-1)}
.appframe .mn-card__meta{display:flex;flex-wrap:wrap;gap:var(--s-1)}
.appframe .mn-none{padding:var(--s-3);border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line);font-size:var(--t-small);color:var(--ink-3);text-align:center}
.appframe .mn-ppl{display:flex;flex-wrap:wrap;gap:var(--s-1)}
.appframe .mn-ppl span{display:inline-flex;align-items:center;gap:var(--s-1);height:var(--ctl-sm);padding:0 var(--s-2) 0 var(--s-1);border-radius:var(--r-pill);background:var(--surface-3);font-size:var(--t-small)}
.appframe .mn-det{border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line-2);font-size:var(--t-ui);line-height:var(--lh-body)}
.appframe .mn-det summary{padding:var(--s-3);cursor:pointer;font-weight:var(--w-medium);display:flex;align-items:center;gap:var(--s-2)}
.appframe .mn-det>div{padding:0 var(--s-3) var(--s-3);color:var(--ink-2);white-space:pre-line}
.appframe .mn-radio{display:flex;flex-direction:column;gap:var(--s-1)}
.appframe .mn-radio label{display:flex;align-items:center;gap:var(--s-2);min-height:var(--ctl-md);padding:0 var(--s-3);border-radius:var(--r-sm);box-shadow:inset 0 0 0 1px var(--line-2);font-size:var(--t-ui);cursor:pointer}
.appframe .mn-radio label:has(input:checked){box-shadow:inset 0 0 0 1px var(--ink);font-weight:var(--w-medium)}
.appframe .mn-radio input{margin:0;accent-color:var(--accent)}
.appframe .mn-radio small{margin-left:auto;font-size:var(--t-meta);color:var(--ink-3);font-weight:var(--w-regular)}
.appframe .mn-cap{font-weight:var(--w-regular);font-size:var(--t-meta);color:var(--ink-3);line-height:var(--lh-ui)}
.appframe .mn-check{display:flex;align-items:flex-start;gap:var(--s-2);font-size:var(--t-ui);line-height:var(--lh-body);cursor:pointer}
.appframe .mn-check input{margin:var(--s-1) 0 0;accent-color:var(--accent)}
.appframe .mn-who{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1);padding:var(--s-1);border-radius:var(--r-sm);border:1px solid var(--line-input);background:var(--surface)}
.appframe .mn-who input{flex:1;min-width:calc(var(--s-12) * 2);border:0;height:var(--ctl-sm);padding:0 var(--s-2);background:transparent;font-size:var(--t-ui)}
.appframe .mn-who input:focus-visible{box-shadow:none}
.appframe .mn-who .mn-chip{display:inline-flex;align-items:center;gap:var(--s-1);height:var(--ctl-sm);padding:0 0 0 var(--s-1);border-radius:var(--r-pill);background:var(--surface-3);font-size:var(--t-small)}
@container app (max-width: 760px){.appframe .mn-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
.appframe .mn-row{flex-wrap:wrap}
.appframe .mn-row .tgo{display:none}
.appframe .mn-left{padding-left:calc(var(--av-md) + var(--s-3))}
.appframe .mn-rec__acts{margin-left:0;flex-basis:100%}
.appframe .mn-rec__acts .btn{flex:1;height:var(--hit)}
.appframe .mn-card__a .btn{height:var(--hit)}
.appframe .vhead__acts .btn--secondary span{display:none}
.appframe .mn-who input{font-size:var(--t-input)}}
/* launch 새 화면 */ .appframe .ai-list{margin-top:var(--s-2);max-width:var(--card-w)}
.appframe .ai-list .lrow{min-height:0;padding-block:var(--s-3)}
.appframe .ai-list .lrow__end{margin-left:auto}
.appframe .perf{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:var(--s-6);align-items:start}
.appframe .perf-period{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-5);font-size:var(--t-small);color:var(--ink-3)}
.appframe .perf-col{display:flex;flex-direction:column;gap:var(--s-6);min-width:0}
.appframe .perf-sec{display:flex;flex-direction:column;gap:var(--s-3);min-width:0}
.appframe .perf-h{display:flex;align-items:baseline;gap:var(--s-2) var(--s-3);flex-wrap:wrap;margin:0;font-size:var(--t-ui);font-weight:var(--w-semibold)}
.appframe .perf-h small{font-size:var(--t-meta);font-weight:var(--w-regular);color:var(--ink-3)}
.appframe .perf-h .tag{align-self:center}
.appframe .perf-box{padding:var(--s-4);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line-2);background:var(--surface);display:flex;flex-direction:column;gap:var(--s-4);min-width:0}
.appframe .perf-kpis{display:flex;flex-direction:column}
.appframe .perf-kpi{display:grid;grid-template-columns:minmax(0,11em) minmax(0,1fr) 8.5em 8.5em;align-items:center;gap:var(--s-2) var(--s-4);padding:var(--s-3) 0}
.appframe .perf-kpi+.perf-kpi{box-shadow:0 -1px 0 var(--line)}
.appframe .perf-kpi__n{display:flex;flex-direction:column;gap:var(--s-0);min-width:0}
.appframe .perf-kpi__n b{font-size:var(--t-ui);font-weight:var(--w-semibold)}
.appframe .perf-kpi__n span{display:flex;align-items:center;gap:var(--s-1);font-size:var(--t-meta);color:var(--ink-3)}
.appframe .perf-kpi__v{font-size:var(--t-small);color:var(--ink-2);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.appframe .perf-kpi__v b{color:var(--ink);font-weight:var(--w-semibold);font-size:var(--t-ui)}
.appframe .perf-kpi .tag{justify-self:end}
.appframe .perf-bar{position:relative;height:var(--s-2);border-radius:var(--r-pill);background:var(--surface-3)}
.appframe .perf-bar>i{position:absolute;left:0;top:0;bottom:0;width:var(--v);border-radius:var(--r-pill);background:var(--chart-1);transform-origin:0 50%}
.appframe .perf-bar>b{position:absolute;top:calc(var(--s-1) * -1);bottom:calc(var(--s-1) * -1);left:var(--p);width:2px;margin-left:-1px;border-radius:1px;background:var(--ink)}
.appframe .perf-note{margin:0;font-size:var(--t-meta);color:var(--ink-3);line-height:var(--lh-body)}
.appframe .perf-note i.tick{display:inline-block;width:2px;height:var(--s-3);margin-right:var(--s-2);vertical-align:-2px;border-radius:1px;background:var(--ink)}
.appframe .perf-chart{position:relative;height:calc(var(--s-12) * 3.25);margin:var(--s-2) 0 var(--s-6) calc(var(--s-8) + var(--s-2))}
.appframe .perf-chart svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.appframe .perf-chart .grid line{stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke}
.appframe .perf-chart .grid line.base{stroke:var(--line-2)}
.appframe .perf-chart .pace{fill:none;stroke:var(--ink-3);stroke-width:1.5;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}
.appframe .perf-chart .act{fill:none;stroke:var(--chart-1);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.appframe .perf-chart .wash{fill:var(--chart-1);opacity:.1}
.appframe .perf-chart .today{stroke:var(--line-2);stroke-width:1;vector-effect:non-scaling-stroke}
.appframe .perf-y{position:absolute;right:calc(100% + var(--s-2));transform:translateY(-50%);font-size:var(--t-micro);color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.appframe .perf-x{position:absolute;top:calc(100% + var(--s-2));transform:translateX(-50%);font-size:var(--t-micro);color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.appframe .perf-x--now{color:var(--ink);font-weight:var(--w-semibold)}
.appframe .perf-dot{position:absolute;width:var(--s-3);height:var(--s-3);margin:calc(var(--s-3) / -2) 0 0 calc(var(--s-3) / -2);border-radius:var(--r-pill);background:var(--chart-1);box-shadow:0 0 0 2px var(--surface)}
.appframe .perf-lb{position:absolute;font-size:var(--t-small);font-weight:var(--w-semibold);color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap;transform:translate(var(--s-3),-50%)}
.appframe .perf-lb small{display:block;font-size:var(--t-micro);font-weight:var(--w-regular);color:var(--ink-3)}
.appframe .perf-legend{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-4);margin:0;font-size:var(--t-meta);color:var(--ink-2)}
.appframe .perf-legend span{display:inline-flex;align-items:center;gap:var(--s-2)}
.appframe .perf-legend i{width:var(--s-4);height:0;border-top:2px solid var(--chart-1)}
.appframe .perf-legend i.pace{border-top:2px dashed var(--ink-3)}
.appframe .perf-rep__head{display:flex;align-items:center;gap:var(--s-2);font-size:var(--t-small);font-weight:var(--w-semibold)}
.appframe .perf-rep__head .num{margin-left:auto;font-weight:var(--w-regular);color:var(--ink-3);font-size:var(--t-meta)}
.appframe .perf-rep__sum{margin:0;font-size:var(--t-body);line-height:var(--lh-body)}
.appframe .perf-odd{display:flex;flex-direction:column;gap:var(--s-3);margin:0;padding:0;list-style:none}
.appframe .perf-odd li{display:flex;gap:var(--s-2);align-items:flex-start;font-size:var(--t-ui);line-height:var(--lh-body);color:var(--ink-2)}
.appframe .perf-odd li .ph{flex:none;margin-top:var(--s-0);font-size:var(--icon-sm)}
.appframe .perf-odd .warn .ph{color:var(--warn-ink)}
.appframe .perf-odd .ok .ph{color:var(--ok-ink)}
.appframe .perf-odd .info .ph{color:var(--ink-3)}
.appframe .perf-odd b{color:var(--ink);font-weight:var(--w-semibold)}
.appframe .perf-rep .why{padding-top:var(--s-3)}
.appframe .perf-rep__foot{display:flex;gap:var(--s-2);flex-wrap:wrap}
.appframe .perf-rep__foot .btn:first-child{margin-right:auto}
.appframe .alert-card{max-width:none}
.appframe .alert-card p{margin:0;font-size:var(--t-ui);line-height:var(--lh-body);color:var(--ink-2)}
.appframe .alert-bars{position:relative;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));align-items:end;height:calc(var(--s-12) * 2.5);padding-top:var(--s-5);box-shadow:inset 0 -1px 0 var(--line-2)}
.appframe .alert-bars>span{position:relative;display:flex;justify-content:center;height:100%;align-items:flex-end}
.appframe .alert-bars>span>i{display:block;width:min(var(--s-5),60%);height:var(--h);border-radius:var(--r-xs) var(--r-xs) 0 0;background:var(--chart-1);transform-origin:50% 100%}
.appframe .alert-bars>span>em{position:absolute;bottom:calc(var(--h) + var(--s-1));font-style:normal;font-size:var(--t-meta);font-weight:var(--w-semibold);color:var(--ink);font-variant-numeric:tabular-nums}
.appframe .alert-bars .goal{position:absolute;height:0;left:0;right:0;bottom:var(--g);border-top:1.5px dashed var(--ink-3);pointer-events:none}
.appframe .alert-bars .goal b{position:absolute;right:0;bottom:var(--s-1);font-size:var(--t-micro);font-weight:var(--w-medium);color:var(--ink-3);background:var(--surface);padding-left:var(--s-1)}
.appframe .alert-x{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));margin-top:calc(var(--s-3) * -1 + var(--s-1));font-size:var(--t-micro);color:var(--ink-3);text-align:center;font-variant-numeric:tabular-nums}
.appframe .alert-x span:nth-last-child(-n+2){color:var(--ink);font-weight:var(--w-semibold)}
.appframe .alert-opts td:first-child{font-weight:var(--w-semibold);white-space:nowrap}
.appframe .alert-opts td small{display:block;color:var(--ink-3);font-size:var(--t-meta)}
.appframe .alert-opts tr.is-pick td{background:var(--accent-tint)}
.appframe .alert-opts .tag{margin-left:var(--s-1);vertical-align:1px}
.appframe .alert-acts{display:flex;gap:var(--s-2);flex-wrap:wrap}
.appframe .alert-acts .btn:first-child{margin-left:auto}
@container app (max-width: 760px){.appframe .perf{grid-template-columns:1fr}
.appframe .perf-kpi{grid-template-columns:minmax(0,1fr) max-content;gap:var(--s-2) var(--s-3)}
.appframe .perf-kpi .perf-bar{grid-column:1/-1;grid-row:2}
.appframe .perf-kpi__v{grid-row:3;text-align:left}
.appframe .perf-kpi .tag{grid-row:1;grid-column:2}
.appframe .perf-chart{margin-left:var(--s-8)}
.appframe .alert-opts thead{display:none}
.appframe .alert-opts tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-2) var(--s-3);padding:var(--s-3);box-shadow:inset 0 -1px 0 var(--line)}
.appframe .alert-opts tr:last-child{box-shadow:none}
.appframe .alert-opts td{padding:0;box-shadow:none;font-size:var(--t-small)}
.appframe .alert-opts td:first-child{grid-column:1/-1;white-space:normal}
.appframe .alert-opts tr.is-pick{background:var(--accent-tint)}
.appframe .alert-opts tr.is-pick td{background:none}
.appframe .alert-opts td[data-lb]::before{content:attr(data-lb);display:block;font-size:var(--t-micro);color:var(--ink-3)}}