.ui{--navy: #0e203b; --navy-2: #1a2d4d; --yellow: #FACC15; --white: #ffffff; --paper: #FAFAF7; --g50: #F8FAFC; --g100: #F1F5F9; --g200: #E2E8F0; --g300: #CBD5E1; --g400: #94A3B8; --g500: #64748B; --g600: #475569; --g700: #334155; --r: 8px; --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; --mono: 'SF Mono', 'Menlo', ui-monospace, monospace;}
.ui *{box-sizing: border-box;}
.ui{margin: 0; padding: 0; font-family: var(--font); color: var(--navy); background: transparent;}
.ui .page{max-width: 1400px; margin: 0 auto; padding: 56px 32px 96px;}
.ui .top-head{display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: end; margin-bottom: 56px; padding-bottom: 32px; border-bottom: 1px solid var(--g200);}
.ui .top-eyebrow{font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--g600); margin-bottom: 14px;}
.ui .top-h1{font-size: 44px; font-weight: 700; letter-spacing: -0.03em; line-height: 1.0; margin: 0 0 14px;}
.ui .top-sub{font-size: 15px; color: var(--g700); line-height: 1.55; margin: 0; max-width: 640px;}
.ui .top-toc{font-size: 12px; color: var(--g600); line-height: 1.85;}
.ui .top-toc b{color: var(--navy); display: inline-block; min-width: 38px; font-weight: 700;}
.ui .top-gates{margin-top: 14px; display: flex; flex-direction: column; gap: 6px; font-size: 11px; color: var(--g600); line-height: 1.5;}
.ui .top-gates b{color: var(--navy); font-weight: 700;}
.ui .epic{margin-bottom: 80px;}
.ui .epic-head{margin-bottom: 32px;}
.ui .epic-num{font-size: 12px; font-weight: 700; letter-spacing: 0.18em; color: var(--g500);}
.ui .epic-title{font-size: 30px; font-weight: 700; letter-spacing: -0.025em; line-height: 1.1; margin: 6px 0 8px;}
.ui .epic-sub{font-size: 14px; color: var(--g600); line-height: 1.55; margin: 0; max-width: 760px;}
.ui .screen-frame{display: flex; flex-direction: column; gap: 14px; align-items: flex-start;}
.ui .screen-label{font-family: var(--mono); font-size: 11px; color: var(--g500); letter-spacing: 0.04em;}
.ui .screen-label b{color: var(--navy); font-weight: 700; margin-right: 6px;}
.ui .screen-label em{color: var(--navy); background: var(--yellow); font-style: normal; padding: 1px 6px; border-radius: 3px; margin-left: 8px; font-size: 10px; letter-spacing: 0.06em;}
.ui .mobile-row{display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 32px; margin-bottom: 56px;}
.ui .mobile-row.row2{grid-template-columns: repeat(2, 1fr); justify-items: start;}
.ui .desktop-row{display: flex; flex-direction: column; gap: 14px; margin-bottom: 48px;}
.ui .phone{width: 391px; height: 776px; background: var(--navy); border-radius: 38px; padding: 8px; box-shadow: 0 8px 24px rgba(14,32,59,0.18), 0 1px 3px rgba(0,0,0,0.08); flex-shrink: 0;}
.ui .phone-screen{width: 100%; height: 100%; background: #fff; border-radius: 30px; overflow: hidden; display: flex; flex-direction: column; position: relative;}
.ui .status-strip{height: 24px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; font-size: 11px; font-weight: 600; color: var(--navy); flex-shrink: 0;}
.ui .status-batt{width: 14px; height: 8px; border: 1px solid var(--navy); border-radius: 2px; position: relative;}
.ui .status-batt::after{content:''; position: absolute; inset: 1px; background: var(--navy); width: 8px;}
.ui .m-screen{flex: 1; display: flex; flex-direction: column; overflow: hidden; position: relative;}
.ui .m-header{height: 56px; display: flex; align-items: center; padding: 0 8px; background: #fff; border-bottom: 1px solid var(--g200); flex-shrink: 0;}
.ui .m-header-btn{width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; color: var(--navy); border: 0; background: transparent; font-size: 20px;}
.ui .m-header-title{flex: 1; text-align: center; font-size: 17px; font-weight: 700; color: var(--navy);}
.ui .m-header-spacer{width: 44px;}
.ui .m-body{padding: 16px 24px; display: flex; flex-direction: column; gap: 12px; flex: 1; overflow: hidden;}
.ui .m-body.tight{padding: 12px 24px; gap: 10px;}
.ui .m-body.scroll{overflow-y: auto; scrollbar-width: none; min-height: 0;}
.ui .m-body.scroll > *{flex-shrink: 0;}
.ui .m-body.scroll::-webkit-scrollbar{display: none;}
.ui .m-sticky-bar{background: #fff; padding: 16px; box-shadow: 0 -4px 12px rgba(0,0,0,0.08); flex-shrink: 0;}
.ui .m-sticky-bar.dock{padding: 10px 14px 14px; border-top: 1px solid var(--g200); display: flex; align-items: center; gap: 12px;}
.ui .bottom-nav{height: 64px; background: #fff; border-top: 1px solid var(--g200); display: flex; flex-shrink: 0;}
.ui .bn-tab{flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 12px; color: var(--g400); font-weight: 500; position: relative;}
.ui .bn-tab svg{width: 26px; height: 26px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;}
.ui .bn-tab.active{color: var(--navy); font-weight: 600;}
.ui .bn-tab.active::before{content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 32px; height: 2px; background: var(--navy);}
.ui .bn-tab.check-in svg{width: 34px; height: 34px; stroke: none; fill: none;}
.ui .bn-tab.check-in .ring-bg{fill: var(--navy);}
.ui .bn-tab.check-in .ring{fill: none; stroke: var(--yellow); stroke-width: 5;}
.ui .bn-tab.check-in .bar{stroke: #fff; stroke-width: 4.5; stroke-linecap: round; fill: none;}
.ui .dt-frame{width: 1280px; min-height: 800px; background: var(--g50); border-radius: 12px; overflow: hidden; box-shadow: 0 12px 32px rgba(14,32,59,0.15); display: flex; font-family: var(--font); color: var(--navy);}
.ui .dt-frame.no-sidebar{display: block;}
.ui .dt-sidebar{width: 224px; background: #fff; border-right: 1px solid var(--g200); display: flex; flex-direction: column; flex-shrink: 0;}
.ui .dt-brand{padding: 20px 20px 16px; display: flex; align-items: center; gap: 10px;}
.ui .dt-org{padding: 0 20px 12px; font-size: 11px; color: var(--g500); font-weight: 600; letter-spacing: 0.04em;}
.ui .dt-nav{padding: 8px 12px; display: flex; flex-direction: column; gap: 2px;}
.ui .dt-nav-item{display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 8px; font-size: 13px; font-weight: 500; color: var(--navy); text-align: left; cursor: pointer; background: transparent; border: 0;}
.ui .dt-nav-item.active{background: var(--g100); font-weight: 600;}
.ui .dt-nav-item .icon{color: var(--g500); flex-shrink: 0; font-size: 14px; width: 16px; text-align: center;}
.ui .dt-nav-item.active .icon{color: var(--navy);}
.ui .dt-nav-item .grow{flex: 1;}
.ui .dt-nav-badge{background: var(--navy); color: #fff; font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px;}
.ui .dt-spacer{flex: 1;}
.ui .dt-user{padding: 12px 16px; border-top: 1px solid var(--g200); display: flex; align-items: center; gap: 8px;}
.ui .dt-avatar{width: 32px; height: 32px; border-radius: 16px; background: var(--g100); color: var(--navy); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700;}
.ui .dt-user-name{font-size: 12px; font-weight: 600;}
.ui .dt-user-role{font-size: 11px; color: var(--g500);}
.ui .dt-main{flex: 1; display: flex; flex-direction: column; overflow: hidden;}
.ui .dt-topbar{height: 60px; background: #fff; border-bottom: 1px solid var(--g200); display: flex; align-items: center; padding: 0 24px; gap: 12px; flex-shrink: 0;}
.ui .dt-topbar-title{font-size: 18px; font-weight: 700;}
.ui .dt-topbar-meta{font-family: var(--mono); font-size: 12px; color: var(--g500);}
.ui .dt-topbar-grow{flex: 1;}
.ui .dt-search{display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 12px; background: var(--g50); border: 1px solid var(--g200); border-radius: 8px; width: 240px; font-size: 13px; color: var(--g400);}
.ui .dt-body{flex: 1; padding: 24px; overflow: auto;}
.ui .h1{font-size: 24px; font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; margin: 0; color: var(--navy);}
.ui .h2{font-size: 22px; font-weight: 700; line-height: 1.25; margin: 0; color: var(--navy);}
.ui .h3{font-size: 18px; font-weight: 700; line-height: 1.3; margin: 0; color: var(--navy);}
.ui .h4{font-size: 16px; font-weight: 700; line-height: 1.3; margin: 0; color: var(--navy);}
.ui .body{font-size: 14px; line-height: 1.5; color: var(--navy); margin: 0;}
.ui .sub{font-size: 13px; color: var(--g600); margin: 0; line-height: 1.5;}
.ui .caption{font-size: 12px; color: var(--g600); line-height: 1.5; margin: 0;}
.ui .mono{font-family: var(--mono); font-size: 11px; color: var(--g400);}
.ui .mono.lg{font-size: 12px;}
.ui .label-up{font-size: 12px; font-weight: 600; color: var(--g500); text-transform: uppercase; letter-spacing: 0.05em;}
.ui .label-up.sm{font-size: 11px;}
.ui .label-up.y{color: var(--navy);}
.ui .btn{display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 48px; padding: 0 24px; border-radius: 8px; font-family: var(--font); font-size: 14px; font-weight: 600; border: 0; cursor: pointer; transition: all .15s ease; white-space: nowrap;}
.ui .btn-primary{background: var(--yellow); color: var(--navy); box-shadow: 0 2px 8px rgba(0,0,0,0.08);}
.ui .btn-secondary{background: #fff; color: var(--navy); border: 2px solid var(--navy);}
.ui .btn-tertiary{background: #fff; color: var(--navy); border: 1px solid var(--g300);}
.ui .btn-ghost{background: transparent; color: var(--navy);}
.ui .btn-danger{background: var(--navy); color: #fff;}
.ui .btn-disabled{background: var(--g200); color: var(--g500); cursor: not-allowed;}
.ui .btn-full{width: 100%;}
.ui .btn-lg{height: 56px; font-size: 16px;}
.ui .btn-xl{height: 64px; font-size: 17px;}
.ui .btn-sm{height: 36px; padding: 0 14px; font-size: 13px;}
.ui .btn-dashed{background: #fff; color: var(--navy); border: 2px dashed var(--g300);}
.ui .card{background: #fff; border: 1px solid var(--g200); border-radius: var(--r); padding: 16px;}
.ui .card.gray{background: var(--g50);}
.ui .card.gray-100{background: var(--g100);}
.ui .card.accent-y{border-left: 4px solid var(--yellow);}
.ui .card.accent-n{border-left: 4px solid var(--navy);}
.ui .card.tight{padding: 14px;}
.ui .input{height: 44px; padding: 0 14px; background: #fff; border: 1px solid var(--g300); border-radius: 8px; font-family: var(--font); font-size: 14px; color: var(--navy); display: flex; align-items: center;}
.ui .input.muted{color: var(--g400);}
.ui .input.area{height: auto; min-height: 88px; padding: 12px 14px; line-height: 1.5; align-items: flex-start;}
.ui .input-row{display: flex; flex-direction: column; gap: 6px;}
.ui .input-label{font-size: 12px; font-weight: 600; color: var(--navy);}
.ui .input-help{font-size: 11px; color: var(--g500);}
.ui .badge{display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 600; padding: 3px 8px; border-radius: 4px; letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap;}
.ui .b-daily{background: var(--g100); color: var(--g600);}
.ui .b-initial{background: var(--yellow); color: var(--navy);}
.ui .b-submitted{background: var(--g50); color: var(--navy); border: 1px solid var(--g200);}
.ui .b-pending{background: var(--yellow); color: var(--navy);}
.ui .b-approved{background: var(--navy); color: #fff;}
.ui .b-concern{background: var(--navy); color: #fff;}
.ui .b-review{background: var(--g200); color: var(--navy);}
.ui .b-missing{background: #fff; color: var(--g600); border: 1px dashed var(--g300);}
.ui .b-followup{background: #fff; color: var(--navy); border: 1px solid var(--navy);}
.ui .b-progress{background: var(--g100); color: var(--g700);}
.ui .b-sentback{background: var(--g50); color: var(--navy); border: 1px solid var(--navy);}
.ui .b-type{background: var(--g50); color: var(--g700); border: 1px solid var(--g200); font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 4px; text-transform: none; letter-spacing: 0;}
.ui .chip{font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 4px; background: #fff; color: var(--navy); border: 1px solid var(--g200); white-space: nowrap;}
.ui .chip.gray{background: var(--g50);}
.ui .chip.flag{display: inline-flex; align-items: center; gap: 4px;}
.ui .chip.flag::before{content: '⚑'; color: var(--navy);}
.ui .tipbox{background: var(--g50); border: 1px solid var(--g200); border-radius: 8px; padding: 12px; display: flex; gap: 8px; align-items: flex-start; font-size: 12px; color: var(--g600); line-height: 1.5;}
.ui .tipbox .info-icon{color: var(--g500); flex-shrink: 0; margin-top: 1px; font-weight: 700;}
.ui .progress-band{padding: 12px 24px; background: var(--g50);}
.ui .progress-row{display: flex; justify-content: space-between; margin-bottom: 6px;}
.ui .progress-bar{height: 6px; background: var(--g200); border-radius: 4px; overflow: hidden;}
.ui .progress-fill{height: 100%; background: var(--yellow);}
.ui .answer-row{display: flex; gap: 10px;}
.ui .ans{flex: 1; height: 56px; border-radius: 8px; font-size: 16px; font-weight: 700; background: #fff; color: var(--navy); border: 2px solid var(--g300); display: flex; align-items: center; justify-content: center;}
.ui .ans.yes-on{background: var(--yellow); color: var(--navy); border: 0;}
.ui .ans.no-on{background: var(--navy); color: #fff; border: 0;}
.ui .ans.na-on{background: var(--g200); color: var(--navy); border: 0;}
.ui .rt-lead{background: var(--g100); border-radius: 8px; border-left: 4px solid var(--yellow); padding: 16px 14px; display: flex; align-items: center; gap: 12px;}
.ui .rt-lead .text{flex: 1;}
.ui .rt-lead h4{font-size: 18px; font-weight: 700; margin: 0; color: var(--navy);}
.ui .rt-lead p{font-size: 12px; color: var(--g600); margin: 4px 0 0; line-height: 1.45;}
.ui .rt-lead .anchor-pill{font-size: 9px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; background: var(--yellow); color: var(--navy); padding: 2px 6px; border-radius: 3px; display: inline-block; margin-top: 6px;}
.ui .rt-row{padding: 12px 4px; border-bottom: 1px solid var(--g200); font-size: 14px; color: var(--navy); display: flex; align-items: center; justify-content: space-between;}
.ui .rt-row:last-child{border-bottom: 0;}
.ui .rt-row .chev{color: var(--g300);}
.ui .empty{display: flex; flex-direction: column; align-items: center; text-align: center; padding: 28px 16px; gap: 8px;}
.ui .empty .ico{width: 48px; height: 48px; border-radius: 50%; background: var(--g100); color: var(--g400); display: flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 4px;}
.ui .empty h4{font-size: 16px; font-weight: 700; color: var(--navy); margin: 0;}
.ui .empty p{font-size: 13px; color: var(--g600); margin: 0; max-width: 260px; line-height: 1.5;}
.ui .om{display: inline-flex; align-items: center; gap: 8px; font-size: 17px; font-weight: 700; color: var(--navy);}
.ui .om-mark{width: 28px; height: 28px; flex-shrink: 0;}
.ui .mic-btn{width: 64px; height: 64px; border-radius: 50%; background: transparent; border: 0; padding: 0; flex-shrink: 0; box-shadow: 0 2px 8px rgba(14,32,59,0.25);}
.ui .mic-btn.lg{width: 184px; height: 184px; box-shadow: 0 6px 24px rgba(14,32,59,0.3);}
.ui .mic-btn.recording.lg{width: 220px; height: 220px; box-shadow: 0 6px 24px rgba(14,32,59,0.3), 0 0 0 18px rgba(14,32,59,0.12), 0 0 0 36px rgba(250,204,21,0.18);}
.ui .mic-btn-fill{width: 100%; height: 100%; border-radius: 50%; background: var(--navy); color: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden;}
.ui .mic-btn-fill svg{display: block;}
.ui .mic-btn-fill svg.mark{width: 62%; height: 62%;}
@keyframes barWave1{ 0%,100% { transform: scaleY(1); } 50% { transform: scaleY(1.5); } }
@keyframes barWave2{ 0%,100% { transform: scaleY(1); } 50% { transform: scaleY(0.65); } }
@keyframes barWave3{ 0%,100% { transform: scaleY(1); } 50% { transform: scaleY(1.35); } }
@keyframes barWave4{ 0%,100% { transform: scaleY(1); } 50% { transform: scaleY(0.85); } }
.ui .mic-listening .b1{transform-origin: center; transform-box: fill-box; animation: barWave1 0.6s ease-in-out infinite;}
.ui .mic-listening .b2{transform-origin: center; transform-box: fill-box; animation: barWave2 0.7s ease-in-out infinite;}
.ui .mic-listening .b3{transform-origin: center; transform-box: fill-box; animation: barWave3 0.55s ease-in-out infinite;}
.ui .mic-listening .b4{transform-origin: center; transform-box: fill-box; animation: barWave4 0.8s ease-in-out infinite;}
.ui .listening-label{display: inline-flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; color: var(--navy);}
.ui .listening-label::before{content: ''; width: 10px; height: 10px; border-radius: 5px; background: var(--yellow); box-shadow: 0 0 0 4px rgba(250,204,21,0.3); animation: pulseDot 1s ease-in-out infinite;}
@keyframes pulseDot{ 0%,100% { opacity: 1; } 50% { opacity: 0.45; } }
.ui .qa-row{display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--g200);}
.ui .qa-row:last-child{border-bottom: 0;}
.ui .qa-q{font-size: 13px; color: var(--navy); line-height: 1.4; flex: 1;}
.ui .qa-q b{font-weight: 700;}
.ui .qa-a{font-size: 13px; font-weight: 700; color: var(--navy); flex-shrink: 0;}
.ui .qa-a.muted{color: var(--g600);}
.ui .qa-row.stack{flex-direction: column; gap: 4px; align-items: flex-start; padding: 12px 0;}
.ui .qa-row.stack .qa-q{font-size: 12px; color: var(--g600);}
.ui .qa-row.stack .qa-a{font-size: 14px; font-weight: 600; color: var(--navy);}
.ui .qa-row.stack .qa-a.muted{color: var(--navy); font-style: italic; font-weight: 500;}
.ui .stat-row{display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px;}
.ui .stat-card{background: #fff; border: 1px solid var(--g200); border-radius: 8px; padding: 16px;}
.ui .stat-value{font-size: 32px; font-weight: 700; letter-spacing: -0.02em; line-height: 1; margin-top: 4px;}
.ui .stat-sub{font-size: 12px; color: var(--g500); margin-top: 4px;}
.ui .tbl{background: #fff; border: 1px solid var(--g200); border-radius: 8px;}
.ui .tbl-head{display: flex; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--g200);}
.ui .tbl-title{font-size: 14px; font-weight: 700; flex: 1;}
.ui .pills{display: flex; gap: 6px; flex-wrap: wrap;}
.ui .pill{height: 28px; padding: 0 10px; font-size: 12px; font-weight: 600; background: var(--g50); color: var(--g600); border: 1px solid var(--g200); border-radius: 6px; display: inline-flex; align-items: center; white-space: nowrap;}
.ui .pill.active{background: var(--navy); color: #fff; border: 0;}
.ui .tbl-cols,.ui .tbl-row{display: grid; grid-template-columns: 1.3fr 1.5fr 1.2fr 1fr 1.1fr 0.4fr; align-items: center; padding: 12px 16px;}
.ui .tbl-cols{background: var(--g50); border-bottom: 1px solid var(--g200); font-size: 11px; font-weight: 600; color: var(--g500); text-transform: uppercase; letter-spacing: 0.05em;}
.ui .tbl-row{border-bottom: 1px solid var(--g200); font-size: 13px;}
.ui .tbl-row:last-child{border-bottom: 0;}
.ui .tbl-row .who{font-weight: 600;}
.ui .tbl-row .sub{font-size: 11px; color: var(--g500); margin-top: 2px;}
.ui .tbl-row.highlight{background: #FFFCEB;}
.ui .tbl-cols.cf,.ui .tbl-row.cf{grid-template-columns: 1.4fr 2.2fr 1fr 1fr 0.8fr;}
.ui .ob-shell{display: grid; grid-template-columns: 280px 1fr; height: 100%;}
.ui .ob-side{background: var(--g50); border-right: 1px solid var(--g200); padding: 32px 28px; display: flex; flex-direction: column; gap: 4px;}
.ui .ob-brand{margin-bottom: 28px;}
.ui .ob-step{display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 8px; font-size: 13px; color: var(--g500);}
.ui .ob-step.active{background: #fff; color: var(--navy); font-weight: 700; box-shadow: 0 1px 3px rgba(14,32,59,0.06);}
.ui .ob-step.done{color: var(--navy);}
.ui .ob-stepnum{width: 26px; height: 26px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0; background: var(--g200); color: var(--g600);}
.ui .ob-step.active .ob-stepnum{background: var(--yellow); color: var(--navy);}
.ui .ob-step.done .ob-stepnum{background: var(--navy); color: #fff;}
.ui .ob-main{display: flex; flex-direction: column;}
.ui .ob-content{flex: 1; padding: 48px 56px; overflow: auto; max-width: 720px;}
.ui .ob-footer{padding: 16px 56px; background: #fff; border-top: 1px solid var(--g200); display: flex; align-items: center; gap: 12px;}
.ui .auth-stage{width: 1280px; min-height: 720px; background: var(--paper); display: flex; align-items: center; justify-content: center; padding: 64px 24px;}
.ui .auth-card{width: 400px; background: #fff; border: 1px solid var(--g200); border-radius: 12px; padding: 40px 32px; display: flex; flex-direction: column; align-items: stretch; gap: 16px; box-shadow: 0 4px 12px rgba(14,32,59,0.06);}
.ui .auth-mark{display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 8px;}
.ui .transcript{background: var(--g100); border-left: 4px solid var(--yellow); border-radius: 8px; padding: 14px;}
.ui .transcript .q-text{font-size: 15px; color: var(--navy); line-height: 1.5; margin-top: 6px; font-style: italic;}
.ui .concern-banner{background: var(--g50); border: 1px solid var(--g200); border-radius: 8px; padding: 14px; display: flex; gap: 10px; align-items: flex-start;}
.ui .concern-banner h4{font-size: 13px; font-weight: 700; margin: 0 0 4px; color: var(--navy);}
.ui .concern-banner p{font-size: 12px; color: var(--g600); line-height: 1.45; margin: 0;}
.ui .concern-banner .flag-glyph{color: var(--navy); flex-shrink: 0; font-size: 14px; font-weight: 700;}
.ui .ai-fallback{background: var(--g50); border: 1px solid var(--g200); border-radius: 8px; padding: 18px; display: flex; flex-direction: column; gap: 8px;}
.ui .ai-fallback h4{font-size: 14px; font-weight: 700; margin: 0; color: var(--navy);}
.ui .ai-fallback p{font-size: 13px; color: var(--g600); line-height: 1.5; margin: 0;}
.ui .ai-fallback .info-icon{color: var(--g500); font-weight: 700;}
.ui .top-banner{background: var(--g50); padding: 8px 24px; font-size: 12px; color: var(--g700); border-bottom: 1px solid var(--g200);}
.ui .top-banner b{color: var(--navy); font-weight: 700;}
.ui .top-banner.action{display: flex; justify-content: space-between; align-items: center;}
.ui .top-banner.action a{color: var(--navy); font-weight: 600; text-decoration: underline;}
.ui .toggle{width: 40px; height: 24px; background: var(--yellow); border-radius: 12px; position: relative; flex-shrink: 0;}
.ui .toggle::after{content: ''; position: absolute; top: 2px; right: 2px; width: 20px; height: 20px; background: #fff; border-radius: 50%;}
.ui .toggle.off{background: var(--g300);}
.ui .toggle.off::after{right: auto; left: 2px;}
.ui .doc-footer{padding: 48px 0 0; border-top: 1px solid var(--g200); font-size: 12px; color: var(--g500); text-align: center;}