:root{--color-accent: #ec3013;--font-heading: "Archivo", system-ui, sans-serif;--font-body: "Archivo", system-ui, sans-serif;--ink: #f2f5fb;--ink-70: rgba(242, 245, 251, .72);--ink-66: rgba(242, 245, 251, .66);--ink-62: rgba(242, 245, 251, .62);--ink-58: rgba(242, 245, 251, .58);--ink-55: rgba(242, 245, 251, .55);--ink-50: rgba(242, 245, 251, .5);--ink-42: rgba(242, 245, 251, .42);--ink-strong: #ffffff;--ink-body: rgba(242, 245, 251, .9);--bg-base: #0a1733;--shell: radial-gradient(1100px 700px at 12% 8%, #1c3f7d 0%, rgba(28, 63, 125, 0) 60%), radial-gradient(900px 600px at 92% 92%, #43204a 0%, rgba(67, 32, 74, 0) 58%), linear-gradient(155deg, #0a1733 0%, #0d2148 52%, #091428 100%);--glow-warm: radial-gradient(circle, rgba(236, 48, 19, .34), rgba(236, 48, 19, 0) 70%);--glow-cool: radial-gradient(circle, rgba(64, 150, 255, .28), rgba(64, 150, 255, 0) 70%);--panel-bg: rgba(255, 255, 255, .07);--panel-border: rgba(255, 255, 255, .14);--panel-shadow: 0 8px 32px rgba(4, 12, 30, .38);--panel-blur: blur(22px) saturate(140%);--overlay-bg: rgba(14, 30, 62, .82);--overlay-border: rgba(255, 255, 255, .18);--overlay-shadow: 0 24px 60px rgba(3, 10, 26, .6);--reader-head-bg: rgba(12, 26, 54, .72);--scrim: rgba(4, 10, 24, .55);--fill-soft: rgba(255, 255, 255, .08);--fill: rgba(255, 255, 255, .09);--fill-strong: rgba(255, 255, 255, .12);--fill-stronger: rgba(255, 255, 255, .14);--fill-hover: rgba(255, 255, 255, .18);--fill-hover-strong: rgba(255, 255, 255, .2);--line-soft: rgba(255, 255, 255, .1);--line: rgba(255, 255, 255, .14);--line-strong: rgba(255, 255, 255, .18);--line-active: rgba(255, 255, 255, .34);--row-read: rgba(255, 255, 255, .015);--row-unread: rgba(255, 255, 255, .16);--row-open: rgba(255, 255, 255, .26);--row-hover: rgba(255, 255, 255, .1);--row-line: rgba(255, 255, 255, .07);--row-line-unread: rgba(255, 255, 255, .22);--row-line-open: rgba(255, 255, 255, .36);--row-tanda: var(--color-accent);--accent-2: #ff7a45;--accent-grad: linear-gradient(135deg, var(--color-accent) 0%, #ff7a45 100%);--accent-glow: 0 8px 20px rgba(236, 48, 19, .34);--accent-soft: #ff9d84;--link: #ffb3a3;--link-hover: #ffffff;--brand-shadow: 0 6px 18px rgba(236, 48, 19, .4);--avatar-grad: linear-gradient(135deg, #4b8dff, #12b3a0);--avatar-grad-2: linear-gradient(135deg, #ffa14a, #e0562b);--avatar-ink: #08172f;--selection: rgba(236, 48, 19, .4);--danger-ink: #ffbdae;--danger-bg: rgba(236, 48, 19, .22);--danger-line: rgba(255, 138, 110, .4);--danger-hover: rgba(236, 48, 19, .34);--ok-ink: #8fe7d6;--ok-bg: rgba(64, 214, 190, .16);--ok-line: rgba(64, 214, 190, .3);--star: #ffd166;--cat-keuangan-tint: rgba(255, 163, 140, .22);--cat-keuangan-ink: #ffb9a6;--cat-proyek-tint: rgba(96, 164, 255, .22);--cat-proyek-ink: #9dc6ff;--cat-penawaran-tint: rgba(255, 206, 109, .2);--cat-penawaran-ink: #ffd794;--cat-pln-tint: rgba(64, 214, 190, .2);--cat-pln-ink: #8fe7d6;--cat-sosial-tint: rgba(179, 142, 255, .22);--cat-sosial-ink: #cbb4ff;--cat-internal-tint: rgba(255, 255, 255, .12);--cat-internal-ink: rgba(242, 245, 251, .8);--cat-fallback-tint: rgba(255, 255, 255, .14);--cat-fallback-ink: rgba(242, 245, 251, .85);--scroll-thumb: rgba(255, 255, 255, .22);color-scheme:dark}[data-theme=light]{--ink: #142445;--ink-70: rgba(20, 36, 69, .76);--ink-66: rgba(20, 36, 69, .7);--ink-62: rgba(20, 36, 69, .66);--ink-58: rgba(20, 36, 69, .62);--ink-55: rgba(20, 36, 69, .58);--ink-50: rgba(20, 36, 69, .54);--ink-42: rgba(20, 36, 69, .46);--ink-strong: #0a1733;--ink-body: rgba(20, 36, 69, .92);--bg-base: #e7edf8;--shell: radial-gradient(1100px 700px at 12% 8%, #cfe0fb 0%, rgba(207, 224, 251, 0) 60%), radial-gradient(900px 600px at 92% 92%, #f2dcec 0%, rgba(242, 220, 236, 0) 58%), linear-gradient(155deg, #eef3fc 0%, #e2eaf8 52%, #eaeef7 100%);--glow-warm: radial-gradient(circle, rgba(236, 48, 19, .14), rgba(236, 48, 19, 0) 70%);--glow-cool: radial-gradient(circle, rgba(64, 150, 255, .16), rgba(64, 150, 255, 0) 70%);--panel-bg: rgba(255, 255, 255, .72);--panel-border: rgba(15, 32, 68, .1);--panel-shadow: 0 8px 32px rgba(15, 32, 68, .1);--overlay-bg: rgba(255, 255, 255, .92);--overlay-border: rgba(15, 32, 68, .14);--overlay-shadow: 0 24px 60px rgba(15, 32, 68, .22);--reader-head-bg: rgba(255, 255, 255, .86);--scrim: rgba(20, 36, 69, .28);--fill-soft: rgba(15, 32, 68, .045);--fill: rgba(15, 32, 68, .06);--fill-strong: rgba(15, 32, 68, .09);--fill-stronger: rgba(15, 32, 68, .11);--fill-hover: rgba(15, 32, 68, .13);--fill-hover-strong: rgba(15, 32, 68, .16);--line-soft: rgba(15, 32, 68, .09);--line: rgba(15, 32, 68, .12);--line-strong: rgba(15, 32, 68, .16);--line-active: rgba(15, 32, 68, .3);--row-read: rgba(15, 32, 68, .14);--row-unread: rgba(255, 255, 255, 1);--row-open: rgba(15, 32, 68, .15);--row-hover: rgba(15, 32, 68, .11);--row-line: rgba(15, 32, 68, .08);--row-line-unread: rgba(15, 32, 68, .18);--row-line-open: rgba(15, 32, 68, .32);--row-tanda: var(--color-accent);--accent-glow: 0 8px 20px rgba(236, 48, 19, .28);--accent-soft: #c2320f;--link: #bf2d0d;--link-hover: #8c1f08;--brand-shadow: 0 6px 18px rgba(236, 48, 19, .3);--avatar-grad: linear-gradient(135deg, #2f6ff0, #0e9c8b);--avatar-grad-2: linear-gradient(135deg, #e07a12, #c33f16);--avatar-ink: #ffffff;--selection: rgba(236, 48, 19, .24);--danger-ink: #a82609;--danger-bg: rgba(236, 48, 19, .12);--danger-line: rgba(236, 48, 19, .32);--danger-hover: rgba(236, 48, 19, .2);--ok-ink: #0a6f5f;--ok-bg: rgba(16, 160, 138, .14);--ok-line: rgba(16, 160, 138, .34);--star: #d99b06;--cat-keuangan-tint: rgba(224, 84, 44, .14);--cat-keuangan-ink: #a1361a;--cat-proyek-tint: rgba(38, 110, 220, .13);--cat-proyek-ink: #1c56ad;--cat-penawaran-tint: rgba(199, 140, 8, .18);--cat-penawaran-ink: #825c05;--cat-pln-tint: rgba(10, 160, 140, .16);--cat-pln-ink: #086b5d;--cat-sosial-tint: rgba(120, 80, 220, .13);--cat-sosial-ink: #553aa8;--cat-internal-tint: rgba(15, 32, 68, .08);--cat-internal-ink: rgba(20, 36, 69, .74);--cat-fallback-tint: rgba(15, 32, 68, .09);--cat-fallback-ink: rgba(20, 36, 69, .8);--scroll-thumb: rgba(15, 32, 68, .24);color-scheme:light}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;height:100%;font-family:var(--font-body);background:var(--bg-base)}#root{height:100%}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:800;line-height:1.12;letter-spacing:-.015em;margin:0 0 8px}a{color:var(--link);text-decoration:none}a:hover{color:var(--link-hover)}input::placeholder,textarea::placeholder{color:var(--ink-50)}:focus{outline:none}:focus-visible{outline:2px solid var(--accent-soft);outline-offset:2px}::selection{background:var(--selection)}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:99px}.mdt-scroll{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) transparent}.gl{background:var(--panel-bg);backdrop-filter:var(--panel-blur);-webkit-backdrop-filter:var(--panel-blur);border:1px solid var(--panel-border);box-shadow:var(--panel-shadow)}.overlay{background:var(--overlay-bg);backdrop-filter:blur(26px) saturate(140%);-webkit-backdrop-filter:blur(26px) saturate(140%);border:1px solid var(--overlay-border);box-shadow:var(--overlay-shadow)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;text-decoration:none;font-family:var(--font-heading);font-weight:800;font-size:14px;line-height:1.2;background:transparent;border:1px solid transparent;padding:8px 14.4px;border-radius:99px;color:var(--ink)}.btn svg{display:block}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-glass{background:var(--fill);border-color:var(--line-strong)}.btn-glass:hover{background:var(--fill-hover)}.btn-glass-strong{background:var(--fill-strong);border-color:var(--line-strong)}.btn-glass-strong:hover{background:var(--fill-hover-strong)}.btn-danger{color:var(--danger-ink);background:var(--danger-bg);border-color:var(--danger-line)}.btn-danger:hover{background:var(--danger-hover)}.btn-danger-ghost{color:var(--danger-ink)}.btn-danger-ghost:hover{background:var(--danger-bg)}.btn-accent{background:var(--accent-grad);color:#fff}.btn-accent:hover{filter:brightness(1.08)}.nav-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;border:1px solid var(--item-border, transparent);border-radius:99px;background:var(--item-bg, transparent);font-family:var(--font-body);font-size:13px;font-weight:var(--item-weight, 400);color:var(--ink)}.nav-item:hover{background:var(--fill-stronger)}.tab-chip{flex:none;cursor:pointer;border:1px solid var(--chip-border);border-radius:99px;background:var(--chip-bg);padding:9px 16px;font-family:var(--font-heading);font-weight:var(--chip-weight);font-size:12.5px;color:var(--chip-color);display:flex;align-items:center;gap:8px;white-space:nowrap;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.tab-chip:hover{filter:brightness(1.12)}[data-theme=light] .tab-chip:hover{filter:brightness(.96)}.msg-row{display:grid;align-items:center;gap:10px;cursor:pointer;border-radius:16px;background:var(--row-bg);border:1px solid var(--row-border);margin-bottom:5px;text-align:left;width:100%;font:inherit;color:inherit}.msg-row:hover{background:var(--row-hover)}.msg-row[data-belum=true]{box-shadow:inset 3px 0 0 var(--row-tanda)}.msg-row[data-cursor=true]{outline:2px solid var(--accent-soft);outline-offset:-2px}.star-btn{border:0;background:transparent;cursor:pointer;padding:0;display:flex}.att-card{display:flex;align-items:center;gap:10px;border-radius:16px;background:var(--fill-soft);border:1px solid var(--line-strong);padding:10px 14px;cursor:pointer;font:inherit;color:inherit}.att-card:hover{border-color:var(--accent-soft)}.ellipsis{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kicker{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-55)}.icon-btn{flex:none;border:0;cursor:pointer;background:var(--fill-stronger);color:var(--ink);border-radius:99px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.icon-btn:hover{background:var(--fill-hover)}.thread-head{display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;border:1px solid var(--line-soft);border-radius:16px;background:var(--fill-soft);padding:10px 14px;font:inherit;color:inherit}.thread-head:hover{background:var(--fill-strong)}.kbd{display:inline-flex;align-items:center;justify-content:center;min-width:22px;padding:2px 7px;border-radius:7px;border:1px solid var(--line-strong);border-bottom-width:2px;background:var(--fill-strong);font-family:var(--font-heading);font-weight:700;font-size:11.5px;color:var(--ink)}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}