/* Panel kabuğu — Stil Rehberi v3, Panel Navbar */

.app-shell {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background: #f4f9fa;
}

.app-shell-main { display: flex; flex: 1; flex-direction: column; min-width: 0; }

.pn-header { position: sticky; top: 0; z-index: 40; padding: 14px 24px 0; }
.pn-wrap { position: relative; max-width: 1368px; margin: 0 auto; }
.pn-bar {
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px);
  border: 1px solid #dbe7e3;
  border-radius: 18px;
  display: flex;
  align-items: stretch;
  min-height: 70px;
  box-shadow: 0 1px 2px rgba(11,18,59,.04), 0 16px 40px -30px rgba(11,18,59,.35);
}
.pn-brand {
  display: flex; align-items: center; gap: 11px; padding: 0 18px;
  border-right: 1px solid #dbe7e3; text-decoration: none; color: #1c2541; flex: none;
}
.pn-brand-mark {
  width: 32px; height: 32px; border-radius: 10px; background: #5bc0be;
  display: flex; align-items: center; justify-content: center;
}
.pn-brand-mark i { width: 8px; height: 14px; border-radius: 4px; background: #1c2541; display: block; }
.pn-brand-copy { display: flex; flex-direction: column; gap: 2px; }
.pn-brand-name { font-family: "Plus Jakarta Sans", sans-serif; font-size: 18px; font-weight: 800; letter-spacing: -.02em; line-height: 1; }
.pn-brand-tag { font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #4f6a69; }
.pn-nav { flex: 1; display: flex; align-items: stretch; min-width: 0; }
.pn-link, .pn-mega > button {
  flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 0 10px; border: 0; border-right: 1px solid #dbe7e3; background: transparent; color: #1c2541;
  text-decoration: none; font-family: inherit; font-size: clamp(13px, 1.1vw, 15px); font-weight: 600;
  white-space: nowrap; cursor: pointer;
  background-image: linear-gradient(#5bc0be, #5bc0be); background-repeat: no-repeat;
  background-position: 50% 100%; background-size: 0% 3px;
  transition: background-size .3s cubic-bezier(.16,.84,.28,1), color .18s;
}
.pn-link:hover, .pn-mega:hover > button, .pn-mega:focus-within > button { background-size: 100% 3px; color: #3a506b; }
.pn-link.is-active, .pn-mega.is-active > button { background-size: 100% 3px; font-weight: 700; }
.pn-mega { position: static; flex: 1; display: flex; min-width: 0; }
.pn-mega > button { width: 100%; }
.pn-chev {
  display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px;
  border-radius: 7px; background: #eef4f3; color: #3a506b; flex: none;
  transition: transform .26s cubic-bezier(.16,.84,.28,1), background .2s;
}
.pn-mega:hover .pn-chev, .pn-mega:focus-within .pn-chev,
.pn-account:hover .pn-chev, .pn-account:focus-within .pn-chev { transform: rotate(180deg); background: #e3f7f4; }
.pn-drop {
  position: absolute; top: 70px; left: 0; right: 0; padding-top: 12px;
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-10px);
  transition: opacity .26s, transform .32s, visibility .26s; z-index: 70;
}
.pn-mega:hover .pn-drop, .pn-mega:focus-within .pn-drop,
.pn-account:hover .pn-drop, .pn-account:focus-within .pn-drop {
  opacity: 1; visibility: visible; pointer-events: auto; transform: none;
}
.pn-drop-card {
  background: #fff; border: 1px solid #dbe7e3; border-radius: 20px; padding: 14px;
  box-shadow: 0 26px 56px -30px rgba(11,18,59,.4);
}
.pn-drop-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 6px; }
.pn-drop-item {
  position: relative; display: flex; gap: 13px; padding: 13px; border-radius: 14px; color: #1c2541; text-decoration: none;
}
.pn-drop-item::before {
  content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px;
}
.pn-drop-item:hover { background: #f4f9fa; transform: translateX(4px); }
.pn-ico, .pn-acc-ico {
  width: 38px; height: 38px; border-radius: 12px; background: #e3f7f4; flex: none;
  display: flex; align-items: center; justify-content: center;
}
.pn-acc-ico { width: 34px; height: 34px; border-radius: 11px; }
.pn-drop-item span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pn-drop-item strong { font-size: 15px; }
.pn-drop-item small { font-size: 12.5px; color: #46605f; font-weight: 500; }
.pn-tools { flex: none; display: flex; align-items: center; padding: 0 10px; border-left: 1px solid #dbe7e3; }
.pn-account { position: relative; }
.pn-account-btn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 10px 0 6px;
  border-radius: 999px; color: #1c2541; text-decoration: none;
}
.pn-account:hover .pn-account-btn, .pn-account:focus-within .pn-account-btn { background: #f1f7f5; }
.pn-avatar {
  width: 34px; height: 34px; border-radius: 12px; background: #3a506b; color: #fff;
  font-family: "Plus Jakarta Sans", sans-serif; font-size: 12.5px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
.pn-account-copy { display: flex; flex-direction: column; text-align: left; }
.pn-account-copy strong { font-size: 14px; }
.pn-account-copy small { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #4f6a69; }
.pn-drop-account { top: 100%; left: auto; right: 0; width: 300px; padding-top: 18px; }
.pn-acc-list { display: flex; flex-direction: column; gap: 4px; }
.pn-acc-item {
  display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 13px;
  color: #1c2541; text-decoration: none; font-size: 15px; font-weight: 600;
  background: transparent; border: 0; width: 100%; font-family: inherit; cursor: pointer; text-align: left;
}
.pn-acc-item:hover { background: #f4f9fa; }
.pn-acc-rule { height: 1px; background: #eef3f2; margin: 4px 8px; }
.pn-acc-item.is-danger { color: #8f2f2f; font-weight: 700; }
.pn-acc-item.is-danger .pn-acc-ico { background: #fdf1f1; }
.pn-badge {
  margin-left: auto; min-width: 1.25rem; padding: 0 6px; border-radius: 999px;
  background: #5bc0be; color: #1c2541; font-size: 11px; font-weight: 800; line-height: 1.4rem; text-align: center;
}
.pn-burger { display: none; margin: auto 8px auto auto; width: 42px; height: 42px; border: 0; border-radius: 12px; background: #f4f9fa; cursor: pointer; }
.pn-guest { display: flex; align-items: center; gap: 8px; padding: 0 12px; border-left: 1px solid #dbe7e3; }
.pn-guest a { font-weight: 700; text-decoration: none; color: #1c2541; padding: 8px 14px; border-radius: 999px; }
.pn-guest a.is-primary { background: #3a506b; color: #fff; }

/* Sayfa gövdesi — tüm panel ekranları */
.pn-skin { background: #f4f9fa; color: #1c2541; padding: 18px 24px 64px; }
.pn-skin .np-page,
.pn-skin > .mx-auto { max-width: 1240px; }
.pn-skin > .pv { max-width: 1368px; }
.pn-skin .pv-head h1, .pn-skin .ph h1, .pn-skin .pv-head h2, .pn-skin .ph h2 {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-weight: 800;
  letter-spacing: -.03em;
  color: #1c2541;
}
.pn-skin .pv > .rounded-lg.border,
.pn-skin .pv [class*="BbCard"],
.pn-skin .np-page > .rounded-lg.border {
  border-color: #dbe7e3;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 2px 4px rgba(11,18,59,.04);
}
.pn-skin table { width: 100%; border-collapse: collapse; }
.pn-skin th {
  font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #4f6a69; text-align: left;
}
.pn-skin .text-muted-foreground { color: #46605f !important; }
.pn-skin a.underline, .pn-skin a.text-primary { color: #3a506b; }

.pn-status {
  max-width: 560px; margin: 48px auto; background: #fff; border: 1px solid #dbe7e3;
  border-radius: 28px; padding: 36px 32px; text-align: center;
  box-shadow: 0 2px 4px rgba(11,18,59,.04), 0 24px 50px -34px rgba(11,18,59,.24);
  display: flex; flex-direction: column; gap: 14px; align-items: center;
}
.pn-status h1 { margin: 0; font-size: clamp(26px, 3vw, 34px); }
.pn-status p { margin: 0; color: #46605f; font-size: 16px; line-height: 1.6; }
.pn-status-mark {
  width: 64px; height: 64px; border-radius: 20px; display: flex; align-items: center; justify-content: center;
  font-size: 28px; background: #e3f7f4;
}
.pn-status-mark.is-bad { background: #fbe8e4; }
.pn-status-mark.is-wait { background: #ffeed2; }
.pn-status-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.pn-btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px;
  border-radius: 999px; background: #5bc0be; color: #1c2541; font-weight: 700; text-decoration: none; border: 0;
}
.pn-btn.is-line { background: transparent; border: 1.5px solid #5bc0be; }

.pv { display: flex; flex-direction: column; gap: 18px; max-width: 1368px; margin: 0 auto; }
.pv-head {
  background: #fff; border: 1px solid #dbe7e3; border-radius: 24px; padding: 26px;
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px;
  box-shadow: 0 2px 4px rgba(11,18,59,.04);
}
.pv-kicker { font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #3a506b; }
.pv-head h1 { margin: 7px 0 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: clamp(26px, 2.6vw, 36px); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.pv-head p { margin: 7px 0 0; font-size: 16px; line-height: 1.55; color: #46605f; max-width: 62ch; }
.pv-sheet { background: #fff; border: 1px solid #dbe7e3; border-radius: 24px; overflow: hidden; box-shadow: 0 2px 4px rgba(11,18,59,.04); }
.pv-body { padding: 22px; display: flex; flex-direction: column; gap: 16px; }
.pn-skin .np-subnav {
  display: flex; flex-wrap: wrap; gap: 0 26px; margin: 0; padding: 0 22px;
  border: 1px solid #dbe7e3; border-radius: 24px; background: #fff;
  box-shadow: 0 2px 4px rgba(11,18,59,.04);
}
.pn-skin .np-subnav button {
  padding: 14px 0 11px; border: 0; border-bottom: 3px solid transparent; margin-bottom: -1px;
  background: transparent; font-family: "Plus Jakarta Sans", sans-serif; font-size: 16px; font-weight: 700;
  color: #4f6a69; cursor: pointer;
}
.pn-skin .np-subnav a {
  padding: 14px 0 11px; border-radius: 0; border-bottom: 3px solid transparent; margin-bottom: -1px;
  font-family: "Plus Jakarta Sans", sans-serif; font-size: 16px; font-weight: 700; color: #4f6a69; background: transparent;
}
.pn-skin .np-subnav a:hover { background: transparent; color: #1c2541; border-bottom-color: #bfe4e3; }
.pn-skin .np-subnav a.np-subnav--active { background: transparent; color: #1c2541; font-weight: 800; border-bottom-color: #5bc0be; }
.pn-skin .np-profile { max-width: 1368px; }
.pn-skin .np-profile-h { font-family: "Plus Jakarta Sans", sans-serif; font-size: clamp(26px, 2.6vw, 36px); font-weight: 800; letter-spacing: -.03em; }
.pn-skin .np-profile-tabs { gap: 26px; border-bottom-color: #dbe7e3; }
.pn-skin .np-profile-tab { font-family: "Plus Jakarta Sans", sans-serif; font-size: 16px; font-weight: 700; padding: 14px 0 11px; color: #4f6a69; }
.pn-skin .np-profile-tab.is-on { color: #1c2541; font-weight: 800; border-bottom: 3px solid #5bc0be; }
.pn-skin .np-profile-panel { border-color: #dbe7e3; border-radius: 24px; box-shadow: 0 2px 4px rgba(11,18,59,.04); padding: 26px; }
.pv-split { display: flex; flex-wrap: wrap; gap: 18px; align-items: stretch; }
.pv-form, .pv-tickets { background: #fff; border: 1px solid #dbe7e3; border-radius: 24px; padding: 26px; box-shadow: 0 2px 4px rgba(11,18,59,.04); }
.pv-form { flex: 2 1 520px; display: flex; flex-direction: column; gap: 16px; }
.pv-form h2, .pv-process h2, .pv-tickets h2 { margin: 0; font-size: 21px; }
.pv-aside { flex: 1 1 320px; display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.pv-file { border: 1.5px dashed #b8ccc7; border-radius: 20px; padding: 16px 18px; background: #f4f9fa; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.pv-file strong, .pv-file span, .pv-file p { display: block; }
.pv-file span, .pv-file p { font-size: 13.5px; color: #46605f; }
.pv-form-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #eef3f2; padding-top: 18px; color: #46605f; }
.pv-process { background: #3a506b; color: #fff; border-radius: 24px; padding: 24px; }
.pv-process .pv-kicker { color: #dbe7e3; }
.pv-process h2 { color: #fff; }
.pv-process ol { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; }
.pv-process li { display: flex; gap: 14px; align-items: stretch; }
.pv-process li strong { position: relative; }
.pv-process li:not(:last-child) strong::after { content: ""; position: absolute; left: 15px; top: 32px; bottom: -8px; width: 2px; background: rgba(244,249,250,.25); }
.pv-process li strong { width: 32px; height: 32px; border-radius: 50%; background: #f4f9fa; color: #1c2541; display: flex; align-items: center; justify-content: center; flex: none; }
.pv-process li span { color: #dbe7e3; font-size: 14px; }
.pv-process li b { display: block; color: #fff; font-size: 15.5px; }
.pv-tickets { display: flex; flex-direction: column; gap: 10px; }
.pv-tickets-h { display: flex; justify-content: space-between; align-items: baseline; }
.pv-tickets article { display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 20px; background: #f4f9fa; border: 1.5px solid #b8ccc7; }
.pv-tickets article header { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; font-weight: 700; color: #4f6a69; }
.pv-tickets .is-open, .pv-tickets .is-done { border-radius: 999px; padding: 4px 10px; }
.pv-tickets .is-open { background: #ffeed2; color: #8a5a12; }
.pv-tickets .is-done { background: #eef4f3; color: #46605f; }
.pv-tickets .is-replied { background: #d6efe0; color: #1e7a4f; border-radius: 999px; padding: 4px 10px; }
.pv-form label { display: flex; flex-direction: column; gap: 8px; font-size: 15px; font-weight: 700; }
.pv-form label > span { display: flex; justify-content: space-between; gap: 10px; }
.pv-form label em { font-style: normal; font-size: 13px; font-weight: 600; color: #4f6a69; }
.pv-form .np-input, .pv-form textarea { width: 100%; box-sizing: border-box; min-height: 52px; border: 1.5px solid #b8ccc7; border-radius: 14px; padding: 0 16px; background: #f1f7f5; color: #1c2541; font: inherit; font-weight: 500; }
.pv-form textarea { min-height: 140px; padding: 14px 16px; resize: vertical; }
.gb-stat { display: flex; flex-direction: column; gap: 3px; min-width: 130px; padding: 12px 16px; border-radius: 16px; background: #f4f9fa; border: 1.5px solid #b8ccc7; }
.gb-stat small { font-size: 13px; font-weight: 700; color: #4f6a69; }
.gb-stat b { font-family: "Plus Jakarta Sans", sans-serif; font-size: 24px; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.gb-kind-block { display: flex; flex-direction: column; gap: 10px; }
.gb-kind-block > span { font-size: 15px; font-weight: 700; }
.gb-kinds { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.gb-kinds button { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px; border-radius: 20px; border: 1.5px solid #b8ccc7; background: #f4f9fa; color: #1c2541; text-align: left; cursor: pointer; transition: border-color .18s, background .18s, transform .2s; }
.gb-kinds button:hover { border-color: #5bc0be; transform: translateY(-2px); }
.gb-kinds button.is-on { background: #e3f7f4; border-color: #5bc0be; }
.gb-kinds i { width: 40px; height: 40px; border-radius: 14px; background: #fff; border: 1px solid #dbe7e3; display: flex; align-items: center; justify-content: center; }
.gb-kinds button > span { display: flex; flex-direction: column; gap: 2px; }
.gb-kinds b { font-size: 15px; font-weight: 800; }
.gb-kinds small { font-size: 13px; line-height: 1.4; font-weight: 500; color: #46605f; }
.gb-ticket-scroll { display: flex; flex-direction: column; gap: 8px; max-height: 392px; overflow-y: auto; padding-right: 4px; }
.st-page { background: #fff; border: 1px solid #dbe7e3; border-radius: 24px; min-height: 320px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 48px 24px; text-align: center; box-shadow: 0 2px 4px rgba(11,18,59,.04); }
.st-page h2, .st-empty h2, .st-miss h2 { margin: 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 24px; font-weight: 800; letter-spacing: -.02em; }
.st-page p, .st-empty p, .st-miss p { margin: 0; max-width: 46ch; font-size: 15.5px; line-height: 1.6; color: #46605f; }
.st-spin { position: relative; width: 76px; height: 76px; display: flex; align-items: center; justify-content: center; }
.st-spin::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 5px solid #e3f7f4; }
.st-spin i { position: absolute; inset: 0; border-radius: 50%; border: 5px solid transparent; border-top-color: #5bc0be; border-right-color: #5bc0be; animation: stSpin 1.05s linear infinite; }
.st-spin::after { content: ""; width: 26px; height: 26px; border-radius: 9px; background: #1c2541; }
.st-bar { width: 260px; height: 8px; border-radius: 999px; background: #eef4f3; overflow: hidden; }
.st-bar i { display: block; height: 100%; width: 40%; border-radius: 999px; background: #5bc0be; animation: stBar 2.6s ease-in-out infinite; }
@keyframes stSpin { to { transform: rotate(360deg); } }
@keyframes stBar { 0% { transform: translateX(-120%); } 100% { transform: translateX(320%); } }
.st-mark { width: 80px; height: 80px; border-radius: 26px; display: flex; align-items: center; justify-content: center; font-size: 36px; font-weight: 800; }
.st-mark.is-bad { background: #fde2e0; border: 1px solid #f0d2d2; color: #b3261e; }
.st-code { font-size: 13px; font-weight: 600; color: #4f6a69; background: #f4f9fa; border: 1px solid #e6eeec; border-radius: 999px; padding: 7px 14px; }
.st-acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.st-miss { position: relative; overflow: hidden; background: #1c2541; color: #fff; border-radius: 24px; min-height: 380px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 48px 24px; text-align: center; }
.st-miss::before { content: ""; position: absolute; right: -60px; top: -60px; width: 280px; height: 280px; border-radius: 50%; background: rgba(91,192,190,.14); }
.st-miss b { position: relative; font-family: "Plus Jakarta Sans", sans-serif; font-size: 76px; font-weight: 800; letter-spacing: -.04em; line-height: 1; color: #5bc0be; }
.st-miss h2, .st-miss p, .st-miss .st-acts { position: relative; }
.st-miss p { color: #e3f7f4; }
.st-miss .fn-btn.is-line { border-color: rgba(255,255,255,.34); color: #fff; background: transparent; }
.st-empty { background: #fff; border: 1px solid #dbe7e3; border-radius: 20px; padding: 34px 24px; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.st-empty > span { width: 68px; height: 68px; border-radius: 22px; background: #e3f7f4; color: #3a506b; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 800; }
.st-note { display: flex; flex-direction: column; gap: 3px; border-radius: 14px; padding: 13px 15px; }
.st-note b { font-size: 15px; }
.st-note span { font-size: 13.5px; line-height: 1.55; }
.st-note.is-bad { background: #fde2e0; border: 1px solid #f0d2d2; color: #b3261e; }
.st-note.is-wait { background: #ffeed2; color: #8f5900; }
.st-note.is-ok { background: #d6efe0; color: #1e7a4f; }
.fn-btn.is-busy { background: #3a506b; color: #fff; border-color: #3a506b; opacity: .85; }
.gb-ticket-scroll article { flex: none; min-height: 92px; }
.gb-pick { position: relative; overflow: hidden; }
.gb-pick input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.gb-file-name { margin: 0; font-size: 13.5px; color: #46605f; font-weight: 600; }
.gb-thanks { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; padding: 40px 16px; }
.gb-thanks p { margin: 0; color: #46605f; max-width: 44ch; }
.gb-check { width: 68px; height: 68px; border-radius: 22px; background: #d6efe0; color: #1e7a4f; display: flex; align-items: center; justify-content: center; font-size: 32px; font-weight: 800; }

@media (max-width: 860px) {
  .pn-burger { display: inline-flex; align-items: center; justify-content: center; }
  .pn-nav, .pn-account-copy { display: none; }
  .pn-wrap.is-nav-open .pn-nav {
    display: flex; flex-direction: column; position: absolute; top: 82px; left: 0; right: 0;
    background: #fff; border: 1px solid #dbe7e3; border-radius: 18px; padding: 8px; z-index: 80;
    box-shadow: 0 26px 56px -30px rgba(11,18,59,.4);
  }
  .pn-wrap.is-nav-open .pn-link,
  .pn-wrap.is-nav-open .pn-mega > button { justify-content: flex-start; min-height: 46px; border-right: 0; }
  .pn-wrap.is-nav-open .pn-drop { position: static; display: none; opacity: 1; visibility: visible; transform: none; padding: 0; }
  .pn-wrap.is-nav-open .pn-mega:focus-within .pn-drop,
  .pn-wrap.is-nav-open .pn-account:focus-within .pn-drop { display: block; pointer-events: auto; }
  .pn-drop-account { position: static; width: auto; }
}

.ph { display: flex; flex-direction: column; gap: 20px; max-width: 1368px; margin: 0 auto; color: #1c2541; font-family: "Manrope", system-ui, sans-serif; font-size: 17px; }
.ph-hello, .ph-card {
  background: #fff; border: 1px solid #dbe7e3; border-radius: 24px;
  box-shadow: 0 2px 4px rgba(11,18,59,.04), 0 24px 50px -34px rgba(11,18,59,.24);
}
.ph-hello { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 28px; align-items: center; padding: 26px 28px; }
.ph-hello > div:first-child { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.ph-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13.5px; color: #4f6a69; }
.ph-meta .dot { width: 4px; height: 4px; border-radius: 50%; background: #b8ccc7; flex: none; }
.ph-meta .ph-kicker { color: #3a506b; }
.ph-kicker { font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #4f6a69; }
.ph-hello h1 { margin: 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: clamp(26px, 2.6vw, 36px); font-weight: 800; letter-spacing: -.03em; line-height: 1.1; color: #1c2541; }
.ph-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.ph-chip { display: inline-flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 600; color: #1c2541; background: #f4f9fa; border-radius: 999px; padding: 8px 14px; }
.ph-chip i { width: 8px; height: 8px; border-radius: 50%; background: #5bc0be; flex: none; }
.ph-chip.is-warn { color: #8f5900; background: #ffeed2; }
.ph-chip.is-warn i { background: #8f5900; }
.ph-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
.ph-actions .ph-btn { min-height: 52px; padding: 0 22px; font-size: 16px; gap: 10px; transition: background .18s ease, color .18s ease, border-color .18s ease, transform .12s ease, box-shadow .18s ease; }
.ph-actions .ph-btn:hover { background: #3a506b; color: #fff; transform: translateY(-1px); box-shadow: 0 10px 22px -10px rgba(58,80,107,.55); }
.ph-actions .ph-btn svg { flex: none; }
.ph-btn, .ph-btn-line {
  display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 20px;
  border-radius: 999px; font-size: 15.5px; font-weight: 700; text-decoration: none; white-space: nowrap;
}
.ph-btn { background: #5bc0be; color: #1c2541; }
.ph-btn-line { min-height: 44px; padding: 0 18px; border: 1.5px solid #5bc0be; color: #1c2541; background: transparent; align-self: flex-start; font-size: 14.5px; transition: background .18s ease, border-color .18s ease, transform .12s ease; }
.ph-btn-line:hover { background: #5bc0be; }
.ph-btn-ghost { background: #f4f9fa; border: 1.5px solid #b8ccc7a7; color: #1c2541; padding: 0 20px; }
.ph-card > a.ph-btn { align-self: flex-end; }
.ph-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(216px, 1fr)); gap: 14px; }
.ph-kpi { background: #fff; border: 1px solid #dbe7e3; border-radius: 20px; padding: 20px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 2px 4px rgba(11,18,59,.04); }
.ph-kpi > .ph-kicker { color: #4f6a69; }
.ph-kpi > span:not(.ph-bar) { display: flex; align-items: baseline; gap: 8px; font-size: 14px; color: #46605f; }
.ph-kpi b { font-family: "Plus Jakarta Sans", sans-serif; font-size: 34px; font-weight: 800; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; color: #1c2541; }
.ph-kpi small { font-size: 13.5px; color: #46605f; font-weight: 700; }
.ph-bar { height: 8px; border-radius: 999px; background: #eef4f3; overflow: hidden; display: block; }
.ph-bar i { display: block; height: 100%; background: #5bc0be; border-radius: 999px; }
@keyframes phBlob { 0%,100% { transform: translate3d(0,0,0) scale(1); } 50% { transform: translate3d(-10px,12px,0) scale(1.08); } }
.ph-split { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 16px; align-items: stretch; }
.ph-card { padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.ph-card h2 { margin: 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.ph-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.ph-row { display: flex; align-items: center; gap: 14px; background: #f4f9fa; border-radius: 18px; padding: 14px 16px; }
.ph-row::before { content: ""; width: 40px; height: 40px; border-radius: 13px; background: #e3f7f4 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233a506b' stroke-width='1.9' stroke-linecap='round'%3E%3Cpath d='M12 4.5v9M8.5 8v3.5M15.5 7.5v4M7 19h10'/%3E%3C/svg%3E") center / 19px no-repeat; flex: none; }
.ph-row.is-doc::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233a506b' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='14' rx='3'/%3E%3Cpath d='M7 15l3.2-3.6 2.6 2.6 2.2-2 2.5 3'/%3E%3C/svg%3E"); }
.ph-row > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ph-row strong { display: block; font-size: 15.5px; font-weight: 700; }
.ph-row small { display: block; font-size: 13px; color: #4f6a69; }
.ph-row .amt { font-family: "Plus Jakarta Sans", sans-serif; font-size: 15.5px; font-weight: 700; letter-spacing: -.01em; font-variant-numeric: tabular-nums; white-space: nowrap; flex: none; }
.ph-tag { font-size: 12px; font-weight: 700; border-radius: 999px; padding: 5px 11px; white-space: nowrap; }
.ph-tag.is-draft { color: #8f5900; background: #ffeed2; }
.ph-tag.is-ready { color: #1e7a4f; background: #d6efe0; }
.ph-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ph-live { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 700; background: #e3f7f4; border: 1px solid #bfe4e3; border-radius: 999px; padding: 4px 11px; }
.ph-live i { width: 7px; height: 7px; border-radius: 50%; background: #5bc0be; animation: phTick 1.8s ease-in-out infinite; }
@keyframes phTick { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.35); opacity: .55; } }
.ph-side .ph-card { padding: 22px; box-shadow: 0 2px 4px rgba(11,18,59,.04); }
.ph-side .ph-card:last-child { flex: 1; }
.ph-side .ph-card:last-child > .ph-btn-line { margin-top: auto; }
.ph-wallet b { font-family: "Plus Jakarta Sans", sans-serif; font-size: 34px; font-weight: 800; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.ph-note { display: flex; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid #eef3f2; }
.ph-note:last-of-type { border-bottom: 0; padding-bottom: 0; }
.ph-note i { width: 8px; height: 8px; border-radius: 50%; background: #b8ccc7; margin-top: 7px; flex: none; }
.ph-note.is-new i { background: #5bc0be; }
.ph-note strong { display: block; font-size: 15px; }
.ph-note span { display: block; font-size: 13.5px; line-height: 1.55; color: #46605f; }
.ph-shortcuts { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; }
.ph-shortcuts a { display: flex; flex-direction: column; gap: 8px; background: #f4f9fa; border: 1px solid #e6eeec; border-radius: 18px; padding: 16px 18px; color: #1c2541; text-decoration: none; transition: background .2s ease, transform .24s cubic-bezier(.16,.84,.28,1), border-color .2s ease; }
.ph-shortcuts a:hover { border-color: #5bc0be; background: #e3f7f4; transform: translateY(-2px); color: #1c2541; }
.ph-shortcuts a span:last-child { font-size: 15.5px; font-weight: 700; line-height: 1.45; }
.ph-empty { color: #46605f; font-size: 15px; margin: 0; }
@media (max-width: 980px) {
  .ph-hello, .ph-split { grid-template-columns: 1fr; }
  .ph-actions { justify-content: flex-start; }
}

.pf { display: flex; flex-direction: column; gap: 18px; max-width: 1368px; margin: 0 auto; }
.pf-head-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.pf-saved { display: inline-flex; align-items: center; gap: 8px; background: #d6efe0; border-radius: 999px; padding: 10px 16px; font-size: 14.5px; font-weight: 700; }
.pf-save { min-height: 52px; padding: 0 22px; border: 0; border-radius: 999px; background: #5bc0be; color: #1c2541; font-size: 16px; font-weight: 700; cursor: pointer; }
.pf-save:disabled { opacity: .55; cursor: default; }
.pf-grid { display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-start; }
.pf-col { flex: 1 1 520px; display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.pf-side { flex: 1 1 320px; display: flex; flex-direction: column; gap: 20px; min-width: 0; position: sticky; top: 98px; }
.pf-card { background: #fff; border: 1px solid #dbe7e3; border-radius: 24px; padding: 26px; display: flex; flex-direction: column; gap: 16px; box-shadow: 0 2px 4px rgba(11,18,59,.04); }
.pf-card h2 { margin: 0; font-size: 19px; }
.pf-card-h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; }
.pf-card-h span, .pf-hint { font-size: 14px; color: #46605f; }
.pf-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; }
.pf-fields-end { align-items: end; }
.pf-card label, .pf-note { display: flex; flex-direction: column; gap: 8px; font-size: 15px; font-weight: 700; }
.pf .np-input { min-height: 48px; border: 1.5px solid #e6eeec; border-radius: 14px; padding: 0 14px; font-size: 15px; font-weight: 500; color: #1c2541; background: #fff; width: 100%; }
.pf textarea.np-input { min-height: 88px; padding: 12px 14px; }
.pf-line { height: 52px; padding: 0 22px; border: 1.5px solid #b8ccc7; border-radius: 999px; background: #f4f9fa; color: #1c2541; font-size: 15.5px; font-weight: 700; cursor: pointer; }
.pf-line.is-danger { color: #8f2f2f; border-color: #f0d2d2; background: #fff; }
.pf-error { background: #fff; border: 1px solid #f0d2d2; border-radius: 24px; padding: 20px 24px; display: flex; flex-direction: column; gap: 8px; }
.pf-error span { font-size: 15px; color: #46605f; font-weight: 500; }
.pf-who { display: flex; align-items: center; gap: 14px; }
.pf-avatar { width: 54px; height: 54px; border-radius: 18px; background: #3a506b; color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; flex: none; }
.pf-who strong { display: block; font-size: 19px; }
.pf-who small { display: block; font-size: 14.5px; color: #46605f; font-weight: 500; }
.pf-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pf-pills span { background: #f1f7f5; border-radius: 999px; padding: 7px 13px; font-size: 13.5px; font-weight: 700; }
.pf-pills .is-on { background: #5bc0be; }
.pf-pills .is-off { background: #fbe8e4; color: #8f2f2f; }
.pf-meter { display: flex; flex-direction: column; gap: 8px; border-top: 1px solid #eef3f2; padding-top: 16px; }
.pf-meter span { display: flex; justify-content: space-between; gap: 12px; }
.pf-meter em { font-style: normal; font-size: 14.5px; color: #46605f; font-weight: 500; }
.pf-meter i { height: 8px; border-radius: 999px; background: #eef4f3; display: block; overflow: hidden; }
.pf-meter s { display: block; height: 100%; background: #5bc0be; }
.pf-switch { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; text-align: left; background: transparent; border: 0; border-top: 1px solid #eef3f2; padding: 14px 0 2px; cursor: pointer; }
.pf-switch b { display: block; font-size: 15.5px; }
.pf-switch small { display: block; font-size: 14px; color: #46605f; font-weight: 500; }
.pf-switch i { width: 50px; height: 29px; border-radius: 999px; background: #dbe7e3; display: flex; align-items: center; padding: 3px; flex: none; }
.pf-switch i::after { content: ""; width: 23px; height: 23px; border-radius: 50%; background: #fff; }
.pf-switch i.is-on { background: #5bc0be; justify-content: flex-end; }
.pf-fields-tight { margin-bottom: 12px; padding-bottom: 16px; border-bottom: 1px solid #eef3f2; }
.pf-logo-wide { grid-column: 1 / -1; }
.pf-logo { display: flex; flex-direction: column; gap: 8px; }
.pf-logo small { font-size: 13px; color: #46605f; font-weight: 500; }
.pf-logo-preview { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.pf-logo-preview img { max-height: 56px; max-width: 160px; object-fit: contain; border-radius: 8px; background: #f4f9fa; padding: 6px; }
.pf-session { flex-direction: row; align-items: center; justify-content: space-between; }
.pf-session span { font-size: 15px; color: #46605f; font-weight: 500; }
.pf-session a:last-child { font-size: 15px; font-weight: 700; color: #8f2f2f; text-decoration: none; }
.pf-skel span { height: 52px; border-radius: 16px; background: #eef4f3; display: block; }
@media (max-width: 980px) { .pf-side { position: static; } }

.ai-rec { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 18px; align-items: stretch; }
.ai-mic { position: relative; overflow: hidden; background: #3a506b; color: #fff; border-radius: 20px; padding: 24px; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; box-shadow: 0 18px 34px -20px rgba(58,80,107,.6); }
.ai-mic-top { align-self: stretch; display: flex; justify-content: space-between; font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #dbe7e3; }
.ai-state { min-height: 28px; padding: 0 11px; border-radius: 999px; background: rgba(244,249,250,.12); letter-spacing: 0; text-transform: none; font-size: 12.5px; color: #f4f9fa; display: inline-flex; align-items: center; }
.ai-mic .viz-canvas { width: 100%; max-height: 88px; }
.ai-mic strong { font-family: "Plus Jakarta Sans", sans-serif; font-size: 40px; font-weight: 800; letter-spacing: -.02em; line-height: 1; font-variant-numeric: tabular-nums; }
.ai-go { width: 132px; height: 132px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.7); background: #5bc0be; color: #1c2541; font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; }
.ai-go.is-stop { background: #f4f9fa; color: #8f2f1e; }
.ai-go:disabled { opacity: .6; cursor: default; }
.ai-status { font-size: 14px; color: #e3f7f4; }
.ai-side { background: #f4f9fa; border: 1px solid #e6eeec; border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.ai-side h2 { margin: 0; font-size: 22px; overflow-wrap: anywhere; }
.ai-side p { margin: 0; color: #46605f; font-size: 16px; line-height: 1.55; }
.pk-crumb { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #46605f; }
.pk-crumb a { color: #46605f; text-decoration: none; }
.pk-crumb b { color: #1c2541; }
.pn-skin .pv table th { padding: 12px 14px; background: #f1f7f5; }
.pn-skin .pv table td { padding: 12px 14px; border-top: 1px solid #eef3f2; font-size: 14.5px; }
.pn-skin .pv input:not([type=checkbox]):not([type=radio]), .pn-skin .pv select, .pn-skin .pv textarea { border-radius: 14px; border-color: #e6eeec; }

.od-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.od-chip { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 0 16px; border-radius: 999px; background: #f4f9fa; border: 1.5px solid #b8ccc7; font-size: 14.5px; font-weight: 700; white-space: nowrap; }
.od-chip i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.od-chip.is-ok { background: #d6efe0; border-color: transparent; color: #1e7a4f; }
.od-chip.is-wait { background: #ffeed2; border-color: transparent; color: #8f5900; }
.od-chip.is-bad { background: #fde2e0; border-color: transparent; color: #b3261e; }
.pv-body .od-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 18px; align-items: start; }
.od-card-dark { position: relative; overflow: hidden; background: #1c2541; color: #fff; border-radius: 20px; padding: 26px; display: flex; flex-direction: column; gap: 12px; }
.od-card-dark::after { content: ""; position: absolute; right: -50px; top: -60px; width: 180px; height: 180px; border-radius: 50%; background: rgba(91,192,190,.18); }
.od-card-top, .od-facts, .od-balance, .od-kicker, .od-card-dark > strong, .od-sub { position: relative; }
.od-card-top { display: flex; justify-content: space-between; font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #e3f7f4; }
.od-pill { color: #1c2541; background: #e3f7f4; border-radius: 999px; padding: 5px 11px; letter-spacing: 0; text-transform: none; font-size: 12.5px; }
.od-card-dark > strong { font-family: "Plus Jakarta Sans", sans-serif; font-size: 24px; font-weight: 800; }
.od-card-dark .od-kicker, .od-sub { color: #e3f7f4; }
.od-session .od-kicker { color: #4f6a69; font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.od-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.od-facts span { display: flex; flex-direction: column; gap: 3px; }
.od-facts small { color: #bfe4e3; font-size: 12.5px; }
.od-facts b { font-size: 16px; }
.od-balance { display: flex; align-items: baseline; gap: 10px; }
.od-balance b { font-family: "Plus Jakarta Sans", sans-serif; font-size: 48px; font-weight: 800; letter-spacing: -.03em; line-height: 1; }
.od-balance small { font-size: 16px; color: #e3f7f4; }
.od-form, .od-session { background: #f4f9fa; border: 1px solid #e6eeec; border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.od-form-h h2, .od-list-h h2, .od-block > h2 { margin: 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 19px; font-weight: 800; letter-spacing: -.02em; }
.od-form-h span, .od-muted, .od-empty { color: #46605f; font-size: 14px; }
.od-empty { margin: 0; padding: 16px 18px; }
.od-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.od-form label { display: flex; flex-direction: column; gap: 7px; font-size: 14.5px; font-weight: 700; }
.od-form input, .od-form select, .od-form textarea, .od-chat-send input {
  width: 100%; box-sizing: border-box; min-height: 48px; border: 1.5px solid #e6eeec; border-radius: 14px;
  background: #fff; color: #1c2541; padding: 0 14px; font: inherit; font-weight: 500;
}
.od-form textarea { padding: 12px 14px; min-height: 88px; }
.od-save, .od-session button, .od-chat-send button { align-self: flex-start; min-height: 48px; padding: 0 20px; border: 0; border-radius: 999px; background: #5bc0be; color: #1c2541; font-weight: 700; cursor: pointer; }
.od-save:disabled, .od-session button:disabled, .od-chat-send button:disabled { opacity: .55; cursor: default; }
.od-ok { color: #1e7a4f; font-weight: 700; }
.od-list { background: #fff; border: 1px solid #e6eeec; border-radius: 20px; overflow: hidden; }
.od-list-h { display: flex; justify-content: space-between; padding: 18px 18px 8px; }
.od-move, .od-enroll { display: grid; gap: 12px; align-items: center; padding: 14px 16px; border-top: 1px solid #eef3f2; }
.od-move { grid-template-columns: minmax(0,1fr) auto auto; }
.od-enroll { grid-template-columns: minmax(0,1fr) auto; }
.od-doc { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; padding: 14px 16px; border-top: 1px solid #eef3f2; }
.od-move em { font-style: normal; font-size: 13.5px; color: #46605f; min-width: 88px; text-align: right; }
.od-move span, .od-enroll span, .od-doc > span:first-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.od-move b, .od-enroll b, .od-doc b { font-size: 15px; }
.od-move small, .od-enroll small, .od-doc small { color: #4f6a69; font-size: 13px; }
.od-move strong { font-family: "Plus Jakarta Sans", sans-serif; font-size: 16px; }
.od-move strong.is-plus { color: #1e7a4f; }
.od-tabs { display: flex; flex-wrap: wrap; gap: 0 26px; border-bottom: 1px solid #dbe7e3; margin: -6px 0 4px; }
.od-tabs button { display: inline-flex; align-items: center; gap: 8px; border: 0; border-bottom: 3px solid transparent; background: transparent; padding: 8px 0 12px; margin-bottom: -1px; color: #4f6a69; font-family: "Plus Jakarta Sans", sans-serif; font-size: 16.5px; font-weight: 700; cursor: pointer; }
.od-tabs button b { font-size: 12px; font-weight: 800; color: #1c2541; background: #e3f7f4; border-radius: 999px; padding: 2px 8px; }
.od-tabs button.is-on { color: #1c2541; border-bottom-color: #5bc0be; font-weight: 800; }
.od-inbox { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 18px; align-items: start; }
.od-inbox-list { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.od-ann { display: flex; gap: 12px; width: 100%; text-align: left; padding: 14px 16px; border-radius: 18px; border: 1.5px solid #e6eeec; background: #f4f9fa; color: #1c2541; font: inherit; cursor: pointer; }
.od-ann > span { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.od-ann.is-on { border-color: #5bc0be; }
.od-ann i { width: 8px; height: 8px; border-radius: 50%; background: #5bc0be; margin-top: 8px; flex: none; }
.od-ann-h { display: flex; justify-content: space-between; gap: 10px; }
.od-ann-p { display: block; color: #46605f; font-size: 13.5px; margin-top: 3px; }
.od-read { background: #fff; border: 1px solid #dbe7e3; border-radius: 20px; padding: 24px; }
.od-read span { font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #4f6a69; }
.od-read h2 { margin: 8px 0; font-size: 23px; font-weight: 800; }
.od-read p { white-space: pre-wrap; line-height: 1.7; }
.od-chat { max-width: 760px; background: #f4f9fa; border: 1px solid #e6eeec; border-radius: 20px; overflow: hidden; }
.od-chat-h, .od-chat-send { display: flex; align-items: center; gap: 12px; padding: 14px 18px; background: #fff; }
.od-chat-h { border-bottom: 1px solid #e6eeec; justify-content: space-between; }
.od-chat-h button { border: 0; background: transparent; font-weight: 700; cursor: pointer; }
.od-chat-log { display: flex; flex-direction: column; gap: 10px; padding: 18px; min-height: 220px; }
.od-bubble { align-self: flex-start; max-width: 78%; display: flex; flex-direction: column; gap: 4px; background: #fff; border: 1px solid #e6eeec; border-radius: 18px 18px 18px 6px; padding: 12px 14px; }
.od-bubble.is-mine { align-self: flex-end; background: #3a506b; color: #fff; border: 0; border-radius: 18px 18px 6px 18px; }
.od-bubble small { font-size: 12px; color: #4f6a69; }
.od-bubble.is-mine small { color: #d9e6ea; }
.od-chat-send { border-top: 1px solid #e6eeec; }
.od-chat-send input { flex: 1; }
.od-prefs { max-width: 620px; background: #f4f9fa; border: 1px solid #e6eeec; border-radius: 20px; padding: 8px 20px; }
.od-prefs button { width: 100%; display: flex; justify-content: space-between; gap: 14px; align-items: center; background: transparent; border: 0; border-bottom: 1px solid #e6eeec; padding: 16px 0; text-align: left; cursor: pointer; }
.od-prefs span { display: flex; flex-direction: column; gap: 3px; }
.od-prefs small { color: #46605f; font-weight: 500; }
.od-prefs i { width: 50px; height: 29px; border-radius: 999px; background: #dbe7e3; padding: 3px; display: flex; }
.od-prefs i::after { content: ""; width: 23px; height: 23px; border-radius: 50%; background: #fff; }
.od-prefs i.is-on { background: #5bc0be; justify-content: flex-end; }
.od-block { display: flex; flex-direction: column; gap: 12px; }
.od-sessions { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.od-session h3 { margin: 0; font-size: 18px; font-weight: 800; }
.od-cap { align-self: flex-start; font-size: 12.5px; font-weight: 700; background: #e3f7f4; border-radius: 999px; padding: 5px 11px; }
.od-cap.is-low { background: #ffeed2; color: #8f5900; }
.od-enroll em, .od-doc em { font-style: normal; font-size: 12.5px; font-weight: 700; border-radius: 999px; padding: 5px 11px; background: #e3f7f4; }
.od-enroll em.is-ok, .od-doc em.is-ok { color: #1e7a4f; background: #d6efe0; }
.od-doc em.is-bad { color: #b3261e; background: #fde2e0; }
.od-doc > span:first-child { flex: 1 1 220px; }
.od-dates { color: #46605f; font-variant-numeric: tabular-nums; }
.od-warn { margin: 0; font-size: 15px; font-weight: 700; color: #8f5900; }
.od-applied { font-size: 14.5px; font-weight: 700; color: #1e7a4f; background: #d6efe0; border-radius: 14px; padding: 11px 14px; }
.od-doc em.is-warn, .od-enroll em.is-wait { color: #8f5900; background: #ffeed2; }
.od-doc-acts { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.od-doc-acts button, .od-doc-acts a { min-height: 40px; padding: 8px 14px; border: 1.5px solid #dbe7e3; border-radius: 999px; background: #fff; color: #1c2541; font-size: 13.5px; font-weight: 700; text-decoration: none; cursor: pointer; }
.od-err { color: #b3261e; }
.od-tariff { display: flex; flex-direction: column; gap: 14px; }
.od-tariff-h { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.od-tariff-h span { display: flex; flex-direction: column; gap: 3px; }
.od-tariff-h b { font-family: "Plus Jakarta Sans", sans-serif; font-size: 19px; }
.od-tariff-h small { color: #46605f; }
.od-tariff-h em { font-style: normal; font-size: 13.5px; font-weight: 700; color: #1e7a4f; background: #d6efe0; border-radius: 999px; padding: 7px 13px; }
.od-tariff-row { display: grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.7fr); gap: 12px; align-items: center; padding: 14px 16px; border-top: 1px solid #eef3f2; }
.od-tariff-row.is-head { border-top: 0; background: #f4f9fa; font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #4f6a69; }
.od-tariff-row span:nth-child(n+2), .od-tariff-row strong { text-align: right; }
.od-tariff-row strong { font-family: "Plus Jakarta Sans", sans-serif; }
.od-tariff-row > span:first-child { display: flex; flex-direction: column; gap: 2px; text-align: left; }
@media (max-width: 800px) {
  .od-move, .od-tariff-row, .ai-hist { grid-template-columns: 1fr; }
  .od-tariff-row span, .od-tariff-row strong, .od-move em { text-align: left; }
}
.ai-tabs { padding: 0 22px; margin: 0; }
.ai-ex { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1.5px solid #b8ccc7; }
.ai-ex b { flex: none; font-size: 12px; background: #e3f7f4; color: #3a506b; border-radius: 999px; padding: 4px 10px; }
.ai-hist-h, .ai-cmd-tools, .ai-cmd-acts, .ai-side-h, .ai-ocr-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ai-hist-h input { flex: 1; min-width: 180px; min-height: 44px; border: 1.5px solid #e6eeec; padding: 0 14px; }
.ai-hist { display: grid; grid-template-columns: minmax(0,1fr) auto auto auto; gap: 12px; align-items: center; padding: 14px 16px; border-top: 1px solid #eef3f2; }
.ai-hist > span, .ai-tpl > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ai-hist small, .ai-tpl small { color: #4f6a69; font-size: 13px; }
.ai-hist em { font-style: normal; font-weight: 700; }
.ai-hist button, .ai-tpl button { border: 0; background: transparent; color: #b3261e; font-weight: 700; cursor: pointer; }
.ai-line, .ai-go-line, .ai-file { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border-radius: 999px; font-weight: 700; cursor: pointer; }
.ai-line { border: 1.5px solid #dbe7e3; background: #fff; color: #1c2541; }
.ai-go-line { border: 1.5px solid rgba(244,249,250,.4); background: transparent; color: #fff; }
.ai-file { position: relative; overflow: hidden; border: 0; background: #f4f9fa; color: #1c2541; }
.ai-file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.ai-frame { width: min(100%, 280px); min-height: 160px; border-radius: 16px; border: 1.5px dashed rgba(244,249,250,.45); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.ai-frame img, .ai-frame video { width: 100%; max-height: 280px; object-fit: contain; }
.ai-frame > span { color: #dbe7e3; padding: 20px; text-align: center; }
.ai-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.ai-pills button { min-height: 42px; padding: 0 15px; border-radius: 999px; border: 1.5px solid #dbe7e3; background: #fff; color: #46605f; font-weight: 600; cursor: pointer; }
.ai-pills button.is-on { background: #5bc0be; border-color: #5bc0be; color: #1c2541; }
.ai-tpl-list { display: flex; flex-direction: column; gap: 10px; }
.ai-tpl { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; border: 1px solid #e6eeec; border-radius: 18px; padding: 14px 16px; }
.ai-side textarea { width: 100%; min-height: 160px; padding: 14px; box-sizing: border-box; }
.ocr-card::before, .ocr-card::after { content: ""; position: absolute; border-radius: 50%; background: rgba(91,192,190,.14); pointer-events: none; }
.ocr-card::before { width: 180px; height: 180px; top: -70px; right: -50px; }
.ocr-card::after { width: 140px; height: 140px; bottom: -60px; left: -40px; }
.ocr-stage { position: relative; z-index: 1; width: min(100%, 300px); min-height: 340px; display: flex; align-items: center; justify-content: center; }
.ocr-stage > i { position: absolute; width: 26px; height: 26px; border: 3px solid #5bc0be; }
.ocr-stage > i:nth-child(1) { top: 0; left: 0; border-right: 0; border-bottom: 0; }
.ocr-stage > i:nth-child(2) { top: 0; right: 0; border-left: 0; border-bottom: 0; }
.ocr-stage > i:nth-child(3) { bottom: 0; left: 0; border-right: 0; border-top: 0; }
.ocr-stage > i:nth-child(4) { bottom: 0; right: 0; border-left: 0; border-top: 0; }
.ocr-stage video { width: calc(100% - 28px); max-height: 300px; object-fit: cover; border-radius: 6px; background: #1c2541; }
.ocr-stage video:not(.is-on) { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ocr-paper { position: relative; width: min(100% - 36px, 230px); background: #fff; color: #1c2541; border-radius: 3px 3px 12px 12px; padding: 16px 14px 12px; text-align: left; box-shadow: 0 18px 28px -16px rgba(12,20,32,.55); overflow: hidden; }
.ai-mic .ocr-paper strong { font-family: "Plus Jakarta Sans", sans-serif; font-size: 13px; font-weight: 800; letter-spacing: .04em; line-height: 1.2; }
.ocr-paper header { display: flex; flex-direction: column; gap: 2px; border-bottom: 1px dashed #d5e2df; padding-bottom: 8px; margin-bottom: 8px; }
.ocr-paper header strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ocr-paper header span { font-size: 11px; color: #6b8482; }
.ocr-paper > div { display: flex; flex-direction: column; gap: 6px; }
.ocr-paper > div > span { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; padding: 4px 6px; border-radius: 4px; }
.ocr-paper em { font-style: normal; color: #6b8482; }
.ocr-paper b { font-weight: 700; }
.ocr-paper .is-hit { background: #e3f7f4; }
.ocr-paper img { display: block; width: 100%; max-height: 150px; object-fit: contain; margin: 0 0 8px; border-radius: 4px; background: #f4f9fa; }
.ocr-paper.is-scan::after { content: ""; position: absolute; left: 0; right: 0; height: 2px; background: #5bc0be; box-shadow: 0 0 12px #5bc0be; animation: ocrScan 1.3s ease-in-out infinite; }
@keyframes ocrScan { from { top: 6px; } to { top: calc(100% - 8px); } }
.ocr-note { position: relative; z-index: 1; font-size: 12.5px; color: #d5e4e2; }
.ai-side .od-fields label, .ocr-text { display: flex; flex-direction: column; gap: 7px; font-size: 14.5px; font-weight: 700; text-align: left; }
.ai-side .od-fields em { font-style: normal; font-size: 12px; font-weight: 700; color: #8a5a12; }
.ocr-text textarea { min-height: 140px; }
.ocr-skel { display: block; height: 16px; border-radius: 8px; background: linear-gradient(90deg, #e6eeec, #fff, #e6eeec); background-size: 200% 100%; animation: ocrShimmer 1.1s linear infinite; }
.ocr-skel:nth-of-type(1) { width: 42%; }
.ocr-skel:nth-of-type(2) { width: 68%; }
.ocr-skel:nth-of-type(3) { width: 36%; }
.ocr-skel:nth-of-type(4) { width: 74%; }
@keyframes ocrShimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.ai-side-h { align-items: flex-start; justify-content: space-between; }
.ai-danger { color: #b3261e; border-color: #f0d2d2; }

.fn-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.fn-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1.5px solid #5bc0be; background: #5bc0be; color: #1c2541; font-weight: 700; cursor: pointer; text-decoration: none; white-space: nowrap; }
.fn-btn.is-line { background: #fff; }
.fn-btn.is-ghost { background: transparent; }
.fn-btn:disabled { opacity: .55; cursor: default; }
.fn-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.fn-kpi { background: #fff; border: 1px solid #dbe7e3; border-radius: 20px; padding: 20px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 1px 2px rgba(11,18,59,.05), 0 8px 18px -14px rgba(11,18,59,.18); }
.fn-kpi .pv-kicker { color: #4f6a69; }
.fn-kpi b { font-family: "Plus Jakarta Sans", sans-serif; font-size: 32px; font-weight: 800; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.fn-kpi small { font-size: 13.5px; color: #46605f; }
.fn-kpi.is-bad { background: #fde2e0; border-color: #f6c9c5; }
.fn-kpi.is-bad .pv-kicker, .fn-kpi.is-bad b, .fn-kpi.is-bad small { color: #b3261e; }
.fn-split { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, .8fr); gap: 16px; align-items: start; }
.fn-side { display: flex; flex-direction: column; gap: 12px; }
.fn-card { background: #fff; border: 1px solid #dbe7e3; border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 12px; box-shadow: 0 1px 2px rgba(11,18,59,.05), 0 8px 18px -14px rgba(11,18,59,.18); }
.fn-card h2 { margin: 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.fn-sheet { background: #fff; border: 1px solid #dbe7e3; border-radius: 24px; overflow: hidden; box-shadow: 0 1px 2px rgba(11,18,59,.05), 0 8px 18px -14px rgba(11,18,59,.18); }
.fn-sheet-h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; border-bottom: 1px solid #e6eeec; }
.fn-sheet-h h2 { margin: 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.fn-cols, .fn-row { display: grid; gap: 12px; align-items: center; }
.fn-cols { padding: 14px 22px; background: #f7faf9; border-bottom: 1px solid #e6eeec; font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #4f6a69; }
.fn-row { padding: 16px 22px; border-bottom: 1px solid #eef3f2; background: #fff; font-size: 15px; }
.fn-row b { font-weight: 700; }
.fn-row small { color: #4f6a69; font-size: 13px; }
.fn-row .end, .fn-cols .end { text-align: right; }
.fn-foot { padding: 16px 22px; font-size: 14px; color: #46605f; }
.fn-tx { grid-template-columns: minmax(0,.7fr) minmax(0,1.6fr) minmax(0,1fr) minmax(0,.8fr) minmax(0,.7fr); }
.fn-inv { grid-template-columns: minmax(120px,.9fr) 108px minmax(110px,.7fr) max-content minmax(240px,1.5fr); }
.inv-sheet .fn-cols > span:last-child { text-align: center; }
.inv-sheet .fn-row { align-items: center; }
.inv-sheet .fn-row > .fn-pill { width: max-content; justify-self: start; }
.inv-sheet .fn-mini { justify-content: flex-end; }
.inv-sheet .fn-btn { min-height: 34px; padding: 0 12px; font-size: 13px; }
[data-toast-viewport], [class*="toast-viewport"], [class*="ToastViewport"] {
  max-width: min(380px, calc(100vw - 24px));
  right: 12px;
}
[data-toast-viewport] *, [class*="toast-viewport"] *, [class*="ToastViewport"] * {
  overflow-wrap: anywhere;
  white-space: normal;
}
.fn-debt { grid-template-columns: minmax(0,1.4fr) minmax(0,.6fr) minmax(0,.8fr) minmax(0,.8fr) minmax(0,.9fr) minmax(0,1fr); }
.fn-pay { grid-template-columns: minmax(0,1.4fr) minmax(0,.7fr) minmax(0,.8fr) minmax(0,.8fr) auto; }
.fn-led { grid-template-columns: minmax(0,.6fr) minmax(0,1.6fr) minmax(0,.8fr) minmax(0,.8fr) auto; }
.fn-doc { grid-template-columns: minmax(0,.9fr) minmax(0,.6fr) minmax(0,.8fr) minmax(0,1.2fr) minmax(0,.6fr) auto; }
.fn-pill { display: inline-flex; align-items: center; font-size: 12px; font-weight: 700; border-radius: 999px; padding: 5px 11px; white-space: nowrap; }
.fn-pill.is-ok { color: #1e7a4f; background: #d6efe0; }
.fn-pill.is-wait { color: #8f5900; background: #ffeed2; }
.fn-pill.is-bad { color: #b3261e; background: #fbe6e6; }
.fn-pill.is-ink { color: #3a506b; background: #e6edf5; }
.fn-acct { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; }
.fn-acct article, .fn-acct button.fn-add { background: #fff; border: 1px solid #dbe7e3; border-radius: 20px; padding: 20px; display: flex; flex-direction: column; gap: 10px; box-shadow: 0 1px 2px rgba(11,18,59,.05), 0 8px 18px -14px rgba(11,18,59,.18); text-align: left; }
.fn-acct article b { font-family: "Plus Jakarta Sans", sans-serif; font-size: 28px; font-weight: 800; letter-spacing: -.03em; }
.fn-acct article span { font-size: 16px; font-weight: 700; }
.fn-acct small { color: #46605f; font-size: 13.5px; }
.fn-add { border-style: dashed !important; border-color: #b8ccc7 !important; align-items: center; justify-content: center; min-height: 170px; cursor: pointer; font-weight: 700; color: #1c2541; box-shadow: none !important; }
.fn-bal { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 10px; border-bottom: 1px solid #eef3f2; }
.fn-bal span { display: flex; flex-direction: column; gap: 2px; }
.fn-bal b { font-family: "Plus Jakarta Sans", sans-serif; font-size: 16px; font-weight: 800; }
.fn-bar { display: flex; flex-direction: column; gap: 9px; padding: 16px 22px; border-bottom: 1px solid #eef3f2; }
.fn-bar > span { display: flex; justify-content: space-between; gap: 12px; }
.fn-track { display: block; height: 8px; border-radius: 999px; background: #eef4f3; overflow: hidden; }
.fn-track i { display: block; height: 100%; border-radius: 999px; background: #5bc0be; }
.fn-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; background: #fff; border: 1px solid #dbe7e3; border-radius: 20px; padding: 14px 16px; }
.fn-filters input, .fn-filters select, .fn-card input, .fn-card select, .fn-card textarea, .fn-form input, .fn-form select, .fn-form textarea {
  min-height: 46px; border: 1.5px solid #e6eeec; border-radius: 14px; background: #fff; color: #1c2541; padding: 0 14px; font: inherit;
}
.fn-form { display: flex; flex-direction: column; gap: 12px; }
.fn-form label, .fn-filters label { display: flex; flex-direction: column; gap: 7px; font-size: 14px; font-weight: 700; }
.fn-mods { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.fn-mod { background: #fff; border: 1px solid #dbe7e3; border-radius: 24px; padding: 22px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; text-decoration: none; color: #1c2541; box-shadow: 0 1px 2px rgba(11,18,59,.05), 0 8px 18px -14px rgba(11,18,59,.18); }
.fn-mod h3 { margin: 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 21px; font-weight: 800; }
.fn-mod p { margin: 0; font-size: 15px; line-height: 1.55; color: #46605f; }
.fn-steps { display: flex; flex-direction: column; gap: 12px; }
.fn-steps span { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; line-height: 1.5; }
.fn-steps i { width: 22px; height: 22px; border-radius: 50%; background: #e3f7f4; color: #3a506b; display: flex; align-items: center; justify-content: center; font-style: normal; font-size: 12.5px; font-weight: 800; flex: none; }
.fn-mini { display: flex; flex-wrap: wrap; gap: 6px; }
@media (max-width: 900px) {
  .fn-split { grid-template-columns: 1fr; }
  .fn-tx, .fn-inv, .fn-debt, .fn-pay, .fn-led, .fn-doc { grid-template-columns: 1fr; }
  .fn-cols { display: none; }
}