/* WARNO shared styles for tool, search and brief pages (loaded after shell.css) */
.phead { margin-bottom: 18px; } .phead p { font-size: 18px; color: var(--ink2); max-width: 42em; margin: 6px 0 0; }
.card2 { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 12px; box-shadow: var(--shadow); padding: 18px 20px; margin: 0 0 16px; max-width: 980px; }
.xform { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; align-items: end; max-width: 980px; margin: 0 0 14px; }
.xform label { display: flex; flex-direction: column; gap: 4px; font: 600 11px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--dim); }
.xform .wide { grid-column: span 2; } .xform .full { grid-column: 1 / -1; }
.xform input, .xform select, .xform textarea { font: 15px var(--cond); color: var(--ink); padding: 9px 10px; border: 1px solid var(--w-line, #cfd8e3); background: var(--w-surface, #fff); text-transform: none; letter-spacing: 0; width: 100%; }
.xform textarea { min-height: 90px; resize: vertical; }
.xform .btn { cursor: pointer; }
.xmeta { font-size: 14.5px; color: var(--ink2); margin: 4px 0 10px; min-height: 22px; }
.xlist { max-width: 980px; } .xlist.busy { opacity: .45; }
.xi { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 10px; padding: 14px 16px; margin: 0 0 10px; box-shadow: var(--shadow); }
.xi a.t { display: block; font: 600 16.5px/1.35 var(--cond); color: var(--friendly); text-decoration: none; margin-bottom: 6px; } .xi a.t:hover { text-decoration: underline; }
.xi .m { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13.5px; color: var(--ink2); } .xi .m b { color: var(--w-text, #0b1019); font-weight: 600; }
.xi p { font-size: 14.5px; color: var(--ink2); margin: 8px 0 0; }
.chip2 { display: inline-block; font: 600 11px var(--mono); letter-spacing: .05em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; background: var(--w-surface2, #f1f4f8); color: var(--ink2); }
.chip2.ok { background: var(--w-tint-ok, #e3f3ea); color: var(--w-ok-text, #1b6b4a); } .chip2.warn { background: var(--w-tint-warn, #fdf1d8); color: var(--w-gold-text, #8a5a00); } .chip2.bad { background: var(--w-tint-bad, #fbe4e2); color: var(--w-bad-text, #a3261e); } .chip2.blue { background: var(--w-tint-info, #eaf2fb); color: var(--w-link, #2f6fb0); }
.xempty { background: var(--w-surface, #fff); border: 1px dashed var(--w-line, #cfd8e3); border-radius: 10px; padding: 18px; color: var(--ink2); max-width: 980px; }
.lockcard { background: linear-gradient(135deg, #fbf8f1, #fff 60%); border: 1px solid #ecdfc1; border-radius: 12px; padding: 20px 22px; max-width: 980px; margin: 0 0 16px; }
.lockcard b { display: block; font: 700 18px var(--stencil); color: var(--w-text, #0b1019); margin-bottom: 4px; } .lockcard p { margin: 0 0 12px; color: var(--ink2); }
body.paid .lockcard { display: none !important; }
.grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; max-width: 980px; margin: 0 0 16px; }
.grid3 > div { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 10px; padding: 14px 16px; font-size: 14.5px; color: var(--ink2); } .grid3 b { display: block; color: var(--w-text, #0b1019); margin-bottom: 4px; font-size: 15px; }
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; max-width: 980px; margin: 0 0 14px; }
.kpis div { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 10px; padding: 12px 14px; } .kpis i { display: block; font: 600 11px var(--mono); font-style: normal; letter-spacing: .06em; text-transform: uppercase; color: var(--dim); } .kpis b { font: 700 22px var(--stencil); color: var(--w-text, #0b1019); }
.tbl2 { width: 100%; border-collapse: collapse; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 10px; overflow: hidden; font-size: 14px; max-width: 980px; }
.tbl2 th { text-align: left; font: 600 11px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--dim); background: var(--w-surface2, #f7f9fc); padding: 9px 12px; border-bottom: 1px solid var(--soft); }
.tbl2 td { padding: 9px 12px; border-bottom: 1px solid #f0f3f7; vertical-align: top; } .tbl2 tr:last-child td { border-bottom: 0; } .tbl2 td small { display: block; color: var(--dim); }
.cpyrow { display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap; max-width: 980px; }
.cpyrow code { flex: 1; min-width: 240px; font: 13.5px var(--code); background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 6px; padding: 9px 11px; }
.letter { white-space: pre-wrap; font: 13.5px/1.6 var(--code); background: var(--w-surface2, #f7f9fc); border: 1px solid var(--soft); border-radius: 8px; padding: 16px 18px; color: var(--w-text, #1f2733); max-width: 980px; }
.note3 { font-size: 13px !important; color: var(--dim) !important; max-width: 980px; }
/* Claude replay demo */
.demo { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 14px; box-shadow: 0 1px 3px rgba(16,24,40,.05), 0 12px 32px rgba(16,24,40,.06); overflow: hidden; max-width: 900px; }
.dbar { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--soft); background: var(--w-surface2, #faf9f7); font: 500 12.5px var(--cond); color: var(--w-muted, #6b778a); }
.dbar i { width: 10px; height: 10px; border-radius: 50%; background: var(--w-tint-warn, #e3e0da); display: inline-block; } .dbar b { margin-left: 8px; color: var(--w-text, #3d3929); font-weight: 600; }
.dbar .rp { margin-left: auto; border: 1px solid var(--soft); background: var(--w-surface, #fff); border-radius: 6px; font: 600 11.5px var(--cond); padding: 4px 10px; cursor: pointer; color: var(--w-text, #3d3929); }
.dbody { padding: 22px 24px 26px; min-height: 480px; background: var(--w-surface2, #fcfbf9); font: 15.5px/1.6 var(--cond); color: var(--w-text, #29261b); }
.umsg { margin-left: auto; max-width: 78%; background: var(--w-surface2, #f0eee6); border-radius: 14px; padding: 12px 16px; margin-bottom: 18px; white-space: pre-wrap; min-height: 24px; }
.umsg .car { display: inline-block; width: 2px; height: 1.1em; background: var(--w-strong, #29261b); vertical-align: -3px; animation: blink 1s steps(1) infinite; }
.tool { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--w-line, #e6e2d8); background: var(--w-surface, #fff); border-radius: 8px; padding: 6px 10px; font-size: 13px; color: var(--w-text2, #6b6555); margin: 0 0 14px; }
.tool .dot { width: 8px; height: 8px; border-radius: 50%; background: #c9a24a; animation: dpulse 1s infinite; } .tool.done .dot { background: #1f8f6a; animation: none; }
.amsg p { margin: 0 0 12px; font-size: 15.5px; } .amsg h4 { font: 700 15.5px var(--cond); margin: 16px 0 8px; color: var(--w-text, #29261b); }
.amsg table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 4px 0 14px; background: var(--w-surface, #fff); border: 1px solid var(--w-line, #ebe7de); border-radius: 8px; overflow: hidden; }
.amsg th { text-align: left; font-weight: 600; padding: 8px 10px; background: var(--w-surface2, #f5f3ee); border-bottom: 1px solid var(--w-line, #ebe7de); }
.amsg td { padding: 9px 10px; border-bottom: 1px solid var(--w-line, #f0ede6); vertical-align: top; } .amsg tr:last-child td { border-bottom: 0; } .amsg td small { display: block; color: var(--w-muted, #7a7466); font-size: 12.5px; }
.v { display: inline-block; font: 700 11px var(--mono); letter-spacing: .05em; border-radius: 5px; padding: 2px 7px; white-space: nowrap; }
.v.bid { background: var(--w-tint-ok, #e3f3ea); color: var(--w-ok-text, #1b6b4a); } .v.chk { background: var(--w-tint-warn, #fdf1d8); color: var(--w-gold-text, #8a5a00); } .v.pass { background: var(--w-tint-bad, #fbe4e2); color: var(--w-bad-text, #a3261e); }
.uchip { display: inline-flex; align-items: center; gap: 5px; margin-right: 4px; padding: 2px 9px 2px 7px; border-radius: 7px; background: var(--w-surface, #fff); border: 1px solid var(--w-line, #d9d3c4); color: var(--w-gold-text, #b3541e); font-weight: 600; font-size: 14.5px; text-decoration: none; vertical-align: 1px; } .uchip:hover { border-color: #b3541e; }
.dstats { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 14px; } .dstats span { background: var(--w-surface, #fff); border: 1px solid var(--w-line, #ebe7de); border-radius: 999px; padding: 5px 12px; font-size: 13.5px; color: var(--w-text2, #5d5747); } .dstats b { color: var(--w-text, #29261b); font-variant-numeric: tabular-nums; } .dstats .hot { background: var(--w-strong, #1f2b3d); border-color: var(--w-text, #1f2b3d); color: #cfd8e6; } .dstats .hot b { color: #fff; }
.amsg table.dsw td { vertical-align: middle; } .dsw td b { font-weight: 600; } .dsw .val, .dsw .due { white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600; } .dsw .due small, .dsw .val small { font-weight: 400; }
.dsw .mt { white-space: nowrap; font: 700 13px var(--mono); color: var(--w-ok-text, #1b6b4a); font-variant-numeric: tabular-nums; } .mbar { display: inline-block; width: 46px; height: 6px; border-radius: 3px; background: var(--w-surface2, #ece8df); margin-right: 7px; vertical-align: 1px; overflow: hidden; } .mbar i { display: block; height: 100%; background: #1f8f6a; border-radius: 3px; }
.dsched { display: flex; align-items: flex-start; gap: 9px; margin: 6px 0 12px; padding: 10px 13px; border-radius: 10px; background: var(--w-tint-ok, #e9f5ef); border: 1px solid #cbe7d9; color: var(--w-ok-text, #1b4d38); font-size: 14.5px; } .dsched svg { flex: none; margin-top: 3px; color: var(--w-ok-text, #1f8f6a); }
.dnext { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; } .dnext span { border: 1px solid var(--w-line, #d9d3c4); background: var(--w-surface, #fff); border-radius: 8px; padding: 6px 12px; font-size: 13.5px; font-weight: 600; color: var(--w-text, #3d3929); }
@media (max-width: 600px) { .amsg table.dsw thead { display: none; } .amsg table.dsw tr { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 2px 10px; padding: 11px 12px; border-bottom: 1px solid var(--w-line, #f0ede6); } .amsg table.dsw tr:last-child { border-bottom: 0; } .amsg table.dsw td { border: 0; padding: 0; } .amsg table.dsw td:first-child { grid-column: 1 / -1; margin-bottom: 4px; } .dsw td:nth-child(4) { display: none; } .dstats span { font-size: 12.5px; } }
.fade { opacity: 0; transform: translateY(4px); transition: opacity .35s, transform .35s; } .fade.in { opacity: 1; transform: none; }
@keyframes dpulse { 50% { opacity: .35; } }
/* Europe live map */
.eumap { position: relative; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 14px; box-shadow: var(--shadow); overflow: hidden; max-width: 980px; }
.eumap svg { display: block; width: 100%; height: auto; }
.eumap path { fill: #edf1f6; stroke: #fff; stroke-width: 1; transition: fill .15s; }
.eumap path.has { fill: #cfe0f2; cursor: pointer; } .eumap path.has.hot { fill: #9fc2e6; } .eumap path.has:hover, .eumap path.sel { fill: #2f6fb0; }
.eumap .pin { cursor: pointer; } .eumap .pin circle { fill: #b8861f; stroke: #fff; stroke-width: 2; } .eumap .pin text { font: 700 12px 'Inter Tight', "Instrument Sans", "InstrumentSans", system-ui, sans-serif; fill: #fff; text-anchor: middle; pointer-events: none; }
.eumap .pin .lbl { fill: #0b1019; font-weight: 600; font-size: 11.5px; paint-order: stroke; stroke: #fff; stroke-width: 3px; }
.eumap .legend2 { position: absolute; left: 14px; bottom: 12px; background: var(--w-surface, rgba(255,255,255,.92)); border: 1px solid var(--soft); border-radius: 8px; padding: 8px 10px; font-size: 12.5px; color: var(--ink2); }
.eumap .tip { position: absolute; pointer-events: none; background: var(--w-strong, #0b1019); color: var(--w-on-strong, #fff); font-size: 12.5px; padding: 6px 9px; border-radius: 6px; transform: translate(-50%, -120%); white-space: nowrap; display: none; }
.eusrc { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; max-width: 980px; } .eusrc span { font-size: 13px; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 999px; padding: 5px 11px; color: var(--ink2); } .eusrc b { color: var(--w-text, #0b1019); }
@media (max-width: 900px) { .xform { grid-template-columns: 1fr 1fr; } .grid3, .kpis { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .xform { grid-template-columns: 1fr; } .xform .wide { grid-column: auto; } .grid3 { grid-template-columns: 1fr; } .dbody { padding: 16px 14px 20px; } .umsg { max-width: 92%; } .amsg table { font-size: 13px; } .eumap .pin .lbl { display: none; } }
@media (prefers-reduced-motion: reduce) { .fade { transition: none; } }
.xform input[type=checkbox] { width: auto; margin: 0; }
#items > span { display: flex; align-items: center; gap: 8px; }
.xi a.t { border: 0 !important; padding: 0 !important; background: none !important; box-shadow: none !important; }
@media (max-width: 600px) { .eumap .pin circle { transform: scale(1.9); } .eumap .pin text { font-size: 21px; } .eumap .pin text:first-of-type { transform: translateY(4px); } }
/* world map (0.9) */ /* chart style 0.9.9: paper land, grey sea, WARNO gold for bids, ink pins */
.wmap { position: relative; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 14px; box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 12px 32px -18px rgba(16,24,40,.18); overflow: hidden; }
.wmap .wmbar { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 12px; border-bottom: 1px solid var(--soft); background: var(--w-surface, #fafbfd); }
.wmap .wmbar button { font: 600 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; border: 1px solid var(--soft); background: var(--w-surface, #fff); color: var(--ink2); border-radius: 999px; padding: 6px 12px; cursor: pointer; transition: border-color .15s, color .15s; }
.wmap .wmbar button:hover { border-color: #b8861f; color: var(--w-text, #0b1019); } .wmap .wmbar button.on { background: var(--w-strong, #0b1019); border-color: var(--w-text, #0b1019); color: var(--w-on-strong, #fff); }
.wmap .wmwrap { position: relative; background: var(--w-surface2, #f7f8fa); }
.wmap svg { display: block; width: 100%; height: auto; aspect-ratio: 1000 / 520; max-width: 100%; }
.wmap path { fill: #fdfcf9; stroke: #c7cfd9; stroke-width: .55; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: fill .15s; }
.wmap path.sph { fill: url(#wmOcean); stroke: #c3ccd7; stroke-width: 1; }
.wmap path.grat { fill: none; stroke: rgba(11,16,25,.055); stroke-width: .6; pointer-events: none; }
.wmap path.has { cursor: pointer; } .wmap path.h1 { fill: #f4e9cc; } .wmap path.h2 { fill: #e3c681; } .wmap path.h3 { fill: #c9973a; }
.wmap path.has:hover, .wmap path.has.armed, .wmap path.sel { fill: #0b1019; }
.wmap path.st { fill: none; stroke: none; pointer-events: none; }
.wmap[data-region="us"] path.st { pointer-events: auto; cursor: pointer; stroke: #fff; stroke-width: .9; }
.wmap[data-region="us"] path.s0 { fill: #f3f0e8; } .wmap[data-region="us"] path.s1 { fill: #f4e9cc; } .wmap[data-region="us"] path.s2 { fill: #e8d09a; } .wmap[data-region="us"] path.s3 { fill: #d6aa55; } .wmap[data-region="us"] path.s4 { fill: #b8861f; }
.wmap[data-region="us"] path.has:not(.st):not(:hover) { fill: #fdfcf9; }
.wmap[data-region="us"] path.st:hover, .wmap[data-region="us"] path.st.armed { fill: #0b1019; }
.wmap .stl { font-family: "Instrument Sans", "InstrumentSans", sans-serif; font-weight: 700; fill: #0b1019; text-anchor: middle; pointer-events: none; paint-order: stroke; stroke: rgba(255,255,255,.92); stroke-width: .3em; stroke-linejoin: round; }
.wmap .pin { cursor: pointer; filter: drop-shadow(0 2px 3px rgba(11,16,25,.28)); } .wmap .pin circle { fill: #0b1019; stroke: #b8861f; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.wmap .pin:hover circle, .wmap .pin.armed circle { fill: #b8861f; stroke: #fff; }
.wmap .pin text { font-family: "Instrument Sans", "InstrumentSans", sans-serif; font-weight: 600; fill: #fff; text-anchor: middle; pointer-events: none; }
.wmap .pin.usp circle { fill: #b8861f; stroke: #fff; stroke-width: 2; } .wmap .pin.usp text { fill: #0b1019; } .wmap .pin.usp:hover circle, .wmap .pin.usp.armed circle { fill: #0b1019; } .wmap .pin.usp:hover text, .wmap .pin.usp.armed text { fill: #fff; }
.wmap .legend2 { position: absolute; left: 12px; bottom: 12px; background: var(--w-surface, rgba(255,255,255,.94)); border: 1px solid var(--soft); border-radius: 8px; padding: 6px 10px; font-size: 12.5px; color: var(--ink2); }
.wmap .legend2 b { color: var(--w-text, #0b1019); font-variant-numeric: tabular-nums; }
.wmap .tip { position: absolute; pointer-events: none; background: var(--w-strong, #0b1019); color: var(--w-on-strong, #fff); font-size: 12.5px; padding: 6px 9px; border-radius: 6px; box-shadow: 0 6px 18px rgba(11,16,25,.2); transform: translate(-50%, -125%); white-space: nowrap; display: none; z-index: 2; }
.wmap .xempty { color: var(--ink2); background: transparent; padding: 60px 16px; text-align: center; }
@media (max-width: 640px) { .wmap { border-radius: 12px; } .wmap svg { aspect-ratio: 1000 / 580; } .wmap .wmbar { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 10px; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); } .wmap .wmbar::-webkit-scrollbar { display: none; } .wmap .wmbar button { flex: none; padding: 7px 12px; } .wmap .legend2 { position: static; border: 0; border-top: 1px solid var(--soft); border-radius: 0; background: var(--w-surface, #fafbfd); padding: 9px 12px; } .wmap .tip { white-space: normal; max-width: 70vw; text-align: center; } }
.cgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; margin: 18px 0; }
.cgrid button { text-align: left; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 12px; padding: 12px 14px; cursor: pointer; font: inherit; color: var(--ink); }
.cgrid button b { display: block; font: 700 22px "Instrument Sans", "InstrumentSans", sans-serif; } .cgrid button span { font-size: 13px; color: var(--ink2); }
.cgrid button.on { border-color: var(--w-text, #0b1019); box-shadow: inset 0 0 0 1px #0b1019; } .cgrid button:hover { border-color: #2f6fb0; }
.soon { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--w-gold-text, #8a6414); background: var(--w-tint-warn, #fbf3e2); border-radius: 5px; padding: 2px 6px; margin-left: 6px; }
.xtable { width: 100%; max-width: 980px; border-collapse: collapse; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 10px; overflow: hidden; font-size: 14.5px; margin: 6px 0 14px; }
.xtable th, .xtable td { text-align: left; padding: 9px 12px; border-bottom: 1px solid var(--soft); vertical-align: top; } .xtable th { background: var(--w-surface, #fafbfd); font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink2); } .xtable tr:last-child td { border-bottom: 0; }
.steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; max-width: 980px; margin: 6px 0 14px; }
.steps > div { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-top: 3px solid #b8861f; border-radius: 10px; padding: 12px 14px; } .steps p { margin: 4px 0 0; font-size: 14px; color: var(--ink2); }
@media (max-width: 900px) { .steps { grid-template-columns: 1fr 1fr; } } @media (max-width: 600px) { .steps { grid-template-columns: 1fr; } }
.lockmore { position: relative; margin-top: 10px; max-width: 980px; } .lmfake { filter: blur(5px); opacity: .55; pointer-events: none; user-select: none; }
.lmcard { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(460px, 92%); background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 14px; box-shadow: 0 12px 40px rgba(11,16,25,.14); padding: 20px 22px; text-align: center; }
.lmcard b { display: block; font: 700 19px 'Inter Tight', "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--w-text, #0b1019); } .lmcard p { margin: 6px 0 14px; color: var(--ink2); font-size: 14.5px; }
.wmap .pin.usp circle { fill: #0b1019; }
.wmap .pin.usp text { fill: #fff; } /* site-ui004: the hub pins (U.S., Europe ...) are dark since the rule above; their number was still dark = invisible */
/* learn paywall (0.9) */
.doc ol > li::before { content: none !important; display: none !important; } .doc ol { padding-left: 22px; } .doc ol > li { padding-left: 4px; list-style: decimal; }
.learnlock { position: relative; margin: 18px 0 8px; max-width: 980px; }
.learnlock .llfade { height: 150px; overflow: hidden; filter: blur(4px); opacity: .5; pointer-events: none; user-select: none; -webkit-mask-image: linear-gradient(#000, transparent); mask-image: linear-gradient(#000, transparent); }
.learnlock .llfade p { margin: 0 0 10px; }
.learnlock .llcard { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 14px; box-shadow: 0 12px 40px rgba(11,16,25,.12); padding: 22px 24px; margin-top: -60px; position: relative; }
.learnlock .llcard b { display: block; font: 700 20px 'Inter Tight', "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--w-text, #0b1019); } .learnlock .llcard p { margin: 6px 0 8px; color: var(--ink2); }
.learnlock .llcard ul { margin: 0 0 16px; padding-left: 18px; columns: 2; column-gap: 28px; font-size: 14.5px; color: var(--w-text, #1f2733); } .learnlock .llcard li { break-inside: avoid; margin: 0 0 4px; }
@media (max-width: 600px) { .learnlock .llcard ul { columns: 1; } }
.xi { overflow: hidden; } .xi a.t, .xi .t { white-space: normal !important; overflow-wrap: anywhere; word-break: normal; } .xi p { overflow-wrap: anywhere; }
.doc h4 { font: 700 18px 'Inter Tight', "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--w-text, #0b1019); margin: 24px 0 8px; letter-spacing: -.01em; }
/* setup page (0.9.1) */
.urlbox { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; max-width: 980px; background: var(--w-strong, #0b1019); color: var(--w-on-strong, #fff); border-radius: 14px; padding: 16px 20px; margin: 0 0 18px; }
.urlbox span { display: block; font: 600 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--w-muted, #b8c2d0); } .urlbox code { font: 600 19px var(--code); color: #fff; background: none; border: 0; padding: 0; }
.urlbox .btn.go { background: #b8861f; border-color: #b8861f; color: #fff; }
.stabs { display: flex; flex-wrap: wrap; gap: 6px; max-width: 980px; margin: 0 0 16px; border-bottom: 1px solid var(--soft); }
.stabs button { font: 600 14px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; background: none; border: 0; border-bottom: 2px solid transparent; padding: 10px 12px; color: var(--ink2); cursor: pointer; margin-bottom: -1px; }
.stabs button.on { color: var(--w-text, #0b1019); border-bottom-color: #b8861f; }
.spane { display: none; max-width: 980px; } .spane.on { display: block; }
.sstep { display: grid; grid-template-columns: 44px minmax(0, 1fr) minmax(0, 1.1fr); gap: 18px; align-items: center; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 14px; padding: 18px; margin: 0 0 12px; box-shadow: var(--shadow); }
.snum { width: 36px; height: 36px; border-radius: 50%; background: var(--w-strong, #0b1019); color: var(--w-on-strong, #fff); font: 700 16px 'Inter Tight', "Instrument Sans", "InstrumentSans", system-ui, sans-serif; display: flex; align-items: center; justify-content: center; }
.stext h4 { margin: 0 0 6px !important; } .stext p { margin: 0; font-size: 15px; color: var(--ink2); }
.mock { border: 1px solid var(--w-line, #e6e2d8); border-radius: 10px; overflow: hidden; background: var(--w-surface2, #fcfbf9); font: 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--w-text, #29261b); }
.mbar { display: flex; align-items: center; gap: 6px; padding: 7px 10px; background: var(--w-surface2, #f5f3ee); border-bottom: 1px solid var(--w-line, #ebe7de); } .mbar i { width: 8px; height: 8px; border-radius: 50%; background: #dcd7cc; } .mbar span { margin-left: 6px; font-weight: 600; font-size: 12px; color: var(--w-text2, #6b6555); }
.mbody { padding: 12px 14px; min-height: 150px; position: relative; } .mside { display: flex; gap: 12px; padding: 0; }
.mnav { width: 34%; background: var(--w-surface2, #f5f3ee); padding: 10px; display: flex; flex-direction: column; gap: 4px; } .mnav em, .mnav b { font-style: normal; font-weight: 500; padding: 5px 8px; border-radius: 6px; font-size: 12.5px; }
.mmain { flex: 1; padding: 10px 12px 12px 0; } .mh { font-weight: 700; margin-bottom: 8px; }
.mrow { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--w-line, #ebe7de); border-radius: 7px; background: var(--w-surface, #fff); margin-bottom: 6px; font-size: 12.5px; }
.mico { width: 14px; height: 14px; border-radius: 4px; background: #d9d4c7; flex: none; } .mico.w { background: var(--w-strong, #0b1019); }
.mtag { margin-left: auto; font-size: 11px; color: var(--w-ok-text, #1b6b4a); background: var(--w-tint-ok, #e3f3ea); border-radius: 999px; padding: 1px 7px; }
.mplus { display: inline-flex; width: 26px; height: 26px; border-radius: 7px; border: 1px solid var(--w-line, #ebe7de); align-items: center; justify-content: center; font-weight: 700; background: var(--w-surface, #fff); }
.hl { outline: 2px solid #b8861f; outline-offset: 1px; background: var(--w-tint-warn, #fbf3e2) !important; }
.mlab { display: block; font-size: 11px; font-weight: 600; color: var(--w-text2, #6b6555); margin: 4px 0 3px; } .minput { border: 1px solid var(--w-line, #ddd8cc); border-radius: 7px; background: var(--w-surface, #fff); padding: 6px 9px; margin-bottom: 6px; font-family: var(--code); font-size: 12px; }
.mlink { font-size: 11.5px; color: var(--w-text2, #6b6555); text-decoration: underline; margin: 2px 0 8px; } .mbtns { display: flex; justify-content: flex-end; gap: 6px; }
.mbtn { display: inline-block; border: 1px solid var(--w-line, #ddd8cc); border-radius: 7px; padding: 5px 12px; font-weight: 600; font-size: 12px; background: var(--w-surface, #fff); text-align: center; } .mbtn.dark { background: var(--w-strong, #0b1019); color: var(--w-on-strong, #fff); border-color: var(--w-text, #0b1019); } .mbtn.wide { display: block; margin: 6px auto; width: 78%; }
.mcenter { text-align: center; } .mcenter .minput { width: 78%; margin: 0 auto; text-align: left; } .mlogo { font: 700 18px 'Inter Tight', "Instrument Sans", "InstrumentSans", system-ui, sans-serif; letter-spacing: .02em; } .mlogo span { color: var(--w-gold-text, #b8861f); } .msub { font-size: 12px; color: var(--w-text2, #6b6555); margin: 2px 0 6px; } .mor { font-size: 11px; color: var(--w-muted, #9a9383); margin: 2px 0 4px; }
.mmenu { width: 72%; border: 1px solid var(--w-line, #ebe7de); border-radius: 9px; background: var(--w-surface, #fff); padding: 6px; box-shadow: 0 8px 20px rgba(0,0,0,.06); } .mmenu .mrow { border: 0; margin: 0; } .hlrow { background: var(--w-tint-warn, #fbf3e2); border-radius: 6px; }
.mtog { margin-left: auto; width: 26px; height: 14px; border-radius: 999px; background: #ddd8cc; position: relative; } .mtog::after { content: ''; position: absolute; left: 2px; top: 2px; width: 10px; height: 10px; border-radius: 50%; background: var(--w-surface, #fff); } .mtog.on { background: #1f8f6a; } .mtog.on::after { left: 14px; }
.mchat { margin-top: 10px; border: 1px solid var(--w-line, #ddd8cc); border-radius: 10px; background: var(--w-surface, #fff); padding: 8px 10px; color: var(--w-muted, #9a9383); font-size: 12.5px; } .mplus2 { display: inline-block; font-weight: 700; color: var(--w-text, #29261b); margin-right: 8px; outline: 2px solid #b8861f; border-radius: 5px; padding: 0 5px; }
.mumsg { margin-left: auto; width: 82%; background: var(--w-surface2, #f0eee6); border-radius: 10px; padding: 7px 10px; font-size: 12.5px; } .mtool { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--w-text2, #6b6555); border: 1px solid var(--w-line, #e6e2d8); border-radius: 6px; padding: 3px 8px; margin: 8px 0; background: var(--w-surface, #fff); } .mtool span { width: 7px; height: 7px; border-radius: 50%; background: #1f8f6a; }
.mans b { display: block; font-size: 12.5px; margin-bottom: 6px; } .mans i { display: block; height: 7px; border-radius: 4px; background: var(--w-tint-warn, #e8e4da); margin: 0 0 6px; } .mans i.s { width: 60%; }
.term { position: relative; background: var(--w-strong, #0b1019); border-radius: 12px; overflow: hidden; max-width: 980px; margin: 8px 0 12px; } .tbar { display: flex; gap: 6px; padding: 9px 12px; background: var(--w-strong, #151c28); } .tbar i { width: 9px; height: 9px; border-radius: 50%; background: #2c3647; }
.term pre { margin: 0; padding: 16px 18px 52px; color: #e6e9ef; font: 13.5px/1.7 var(--code); white-space: pre-wrap; overflow-wrap: anywhere; } .tp { color: var(--w-gold-text, #b8861f); } .tc { color: var(--w-muted, #8fa1b8); } .term .btn { position: absolute; right: 12px; bottom: 12px; background: var(--w-surface, #fff); }
.pgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 980px; }
.pgrid > div { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; } .pgrid code { font: 13.5px/1.5 var(--code); background: var(--w-surface2, #f7f9fc); border: 1px solid var(--soft); border-radius: 6px; padding: 8px 10px; flex: 1; } .pgrid .btn { align-self: flex-start; }
@media (max-width: 900px) { .sstep { grid-template-columns: 36px minmax(0, 1fr); } .sstep .mock { grid-column: 1 / -1; } .pgrid { grid-template-columns: 1fr; } }
.xih { display: flex; gap: 12px; align-items: flex-start; justify-content: space-between; } .xih .t { flex: 1; min-width: 0; }
/* company research (0.9.2) */
.coform { display: flex; gap: 10px; max-width: 980px; } .coform input { flex: 1; font: 16px var(--cond); padding: 12px 14px; border: 1px solid var(--w-line, #cfd8e3); background: var(--w-surface, #fff); min-width: 0; }
.colist { display: grid; gap: 8px; max-width: 980px; } .coitem { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 10px; padding: 12px 16px; text-decoration: none; color: var(--ink); }
.coitem:hover { border-color: #2f6fb0; } .coitem b { font-size: 16px; color: var(--friendly); } .coitem small { grid-column: 1; font-size: 12.5px; color: var(--dim); } .coitem span { grid-column: 1; font-size: 13.5px; color: var(--ink2); } .coitem em { grid-column: 2; grid-row: 1 / span 3; align-self: center; font-style: normal; display: flex; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }
.coitem em i { font: 700 10.5px var(--mono); font-style: normal; background: var(--w-tint-ok, #e3f3ea); color: var(--w-ok-text, #1b6b4a); border-radius: 999px; padding: 3px 8px; }
.coback { margin: 0 0 10px; } .coback a { color: var(--friendly); text-decoration: none; font-size: 14px; }
.cohead { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; max-width: 980px; margin-bottom: 14px; } .coid { display: flex; gap: 16px; align-items: flex-start; }
.colog { width: 64px; height: 64px; border-radius: 14px; background: var(--w-strong, #0b1019); color: #e0b457; display: flex; align-items: center; justify-content: center; font: 700 22px 'Inter Tight', "Instrument Sans", "InstrumentSans", system-ui, sans-serif; flex: none; background-size: cover; background-position: center; }
.cohead h2 { margin: 0 !important; } .codba { margin: 2px 0 0; color: var(--dim); font-size: 14px; } .coids { margin: 6px 0 8px; font-size: 14px; color: var(--ink2); } .coids a { color: var(--friendly); } .cochips { display: flex; gap: 6px; flex-wrap: wrap; }
.cotabs { position: sticky; top: calc(56px + env(safe-area-inset-top, 0px)); z-index: 5; display: flex; gap: 2px; overflow-x: auto; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 10px; padding: 4px; max-width: 980px; margin: 0 0 16px; }
.cotabs a { flex: none; font: 600 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--ink2); text-decoration: none; padding: 8px 12px; border-radius: 7px; } .cotabs a:hover { background: var(--w-surface2, #f1f4f8); color: var(--w-text, #0b1019); }
.cosec { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 14px; padding: 18px 20px; margin: 0 0 14px; max-width: 980px; scroll-margin-top: 120px; } .cosec h3 { margin-top: 0 !important; }
.cotwo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 28px; margin-top: 8px; } .cotwo h4 { margin: 12px 0 8px !important; font-size: 14px !important; }
.cobars { display: grid; gap: 7px; } .cobar { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 10px; align-items: center; font-size: 13.5px; } .cobar .l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }
.cobar .t { height: 8px; background: var(--w-surface2, #edf1f6); border-radius: 4px; overflow: hidden; } .cobar .t i { display: block; height: 100%; background: #2f6fb0; border-radius: 4px; } .cobar .v { font-variant-numeric: tabular-nums; color: var(--ink); white-space: nowrap; } .cobar .v small { color: var(--dim); }
.cochart svg { width: 100%; height: auto; display: block; } .cochart .gl { stroke: #e8edf3; } .cochart .ax { font: 11px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; fill: #6b778a; } .cochart .c1 { fill: #2f6fb0; } .cochart .c2 { fill: #9fc2e6; } .cochart .c3 { fill: #b8861f; }
.colg { display: flex; gap: 16px; font-size: 13px; color: var(--ink2); margin-top: 6px; } .colg i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; } .colg .c1 { background: #2f6fb0; } .colg .c2 { background: #9fc2e6; } .colg .c3 { background: #b8861f; }
.conaics { display: flex; flex-wrap: wrap; gap: 6px; } .conaics a { font: 600 12.5px var(--mono); border: 1px solid var(--soft); border-radius: 6px; padding: 4px 8px; text-decoration: none; color: var(--ink); } .conaics a small { color: var(--w-ok-text, #1b6b4a); font-weight: 600; } .conaics a.pri { border-color: var(--w-text, #0b1019); }
.cotbl { overflow-x: auto; } .cotbl td small { display: block; font-size: 12px; color: var(--dim); margin-top: 2px; } .cotbl td a { color: var(--friendly); text-decoration: none; font-weight: 600; } .cosec h4 { margin: 14px 0 8px !important; }
@media (max-width: 700px) { .cotwo { grid-template-columns: 1fr; } .cohead { flex-direction: column; } .coform { flex-direction: column; } }
#coreg td:first-child { width: 220px; white-space: nowrap; color: var(--dim); } #coreg td { padding: 7px 10px; }
.cotbl td:first-child { min-width: 240px; } .cotbl td { vertical-align: top; } .cotbl td:nth-child(n+3) { white-space: nowrap; }
@media (max-width: 700px) { .cobar { grid-template-columns: minmax(0, 1fr) auto; row-gap: 3px; } .cobar .l { grid-column: 1 / -1; } .cobar .t { grid-column: 1; } }
.awhead { max-width: 980px; margin-bottom: 14px; } .awkind { margin: 0 0 4px; font: 600 12px var(--mono); letter-spacing: .06em; text-transform: uppercase; color: var(--dim); } .awhead h2 { margin: 0 0 8px !important; font-size: clamp(22px, 3vw, 32px) !important; }
.awkpi { max-width: 980px; margin-bottom: 12px; } .awtime { max-width: 980px; margin: 0 0 16px; } .awbar { height: 8px; background: var(--w-surface2, #e6ebf2); border-radius: 4px; overflow: hidden; } .awbar i { display: block; height: 100%; background: #2f6fb0; }
.awtl { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: var(--dim); margin-top: 6px; }
#awwho td:first-child, #awhow td:first-child { width: 200px; white-space: nowrap; color: var(--dim); } #awwho td small, #awhow td small { color: var(--dim); } #awwho a, #awhow a, #awvehb a { color: var(--friendly); }
.awhead h2 { max-width: none !important; } #compp p { max-width: 760px; } #compp .chip2 { margin: 1px 0; }
.sinc { font: 600 12.5px var(--mono); border: 1px solid var(--soft); border-radius: 6px; padding: 4px 8px; color: var(--ink); } .clrl { margin: 6px 0 10px; padding-left: 18px; font-size: 14px; } .clrl a { color: var(--friendly); font-weight: 600; }
.pgbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 8px 0 4px; font-size: 13px; color: var(--dim); } .pgbar select { font: 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 4px 6px; border: 1px solid var(--w-line, #cfd8e3); background: var(--w-surface, #fff); margin-left: 4px; }
.pgbar .pgi { margin-left: auto; font-variant-numeric: tabular-nums; } .pgbar button, .pgmore { font: 600 12.5px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; border: 1px solid var(--w-line, #cfd8e3); background: var(--w-surface, #fff); padding: 5px 10px; cursor: pointer; color: var(--ink); } .pgbar button:disabled { opacity: .4; cursor: default; }
.pgmore { border-radius: 6px; } tr[hidden] { display: none; }
.pgbar .pgs { display: inline-flex; align-items: center; gap: 4px; } .pgbar .pgnums { display: inline-flex; gap: 4px; } .pgbar .pgnums button, .pgbar .pgp, .pgbar .pgn { min-width: 32px; height: 30px; padding: 0 8px; text-align: center; }
.pgbar .pgnums button.on { background: var(--w-strong, #0b1019); border-color: var(--w-text, #0b1019); color: var(--w-on-strong, #fff); } .pgbar .pgdots { padding: 0 4px; color: var(--dim); }
/* contract search v2 (0.9.3) */
.xs { max-width: 1320px; } .xshead h2 { margin: 0 0 4px !important; } .xshead p { margin: 0 0 16px; color: var(--dim); }
.xsbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: stretch; margin-bottom: 12px; } .xsq { flex: 1 1 420px; display: flex; align-items: center; gap: 8px; background: var(--w-surface, #fff); border: 1px solid var(--w-line, #cfd8e3); padding: 0 12px; color: var(--w-muted, #6b778a); min-width: 0; }
.xsq:focus-within { border-color: var(--w-text, #0b1019); } .xsq input { flex: 1; border: 0; outline: 0; font: 16px var(--cond); padding: 12px 0; background: transparent; min-width: 0; } .xsbtns { display: flex; gap: 8px; flex-wrap: wrap; } .xsbtns .btn { white-space: nowrap; } .xsreset { color: var(--w-bad-text, #a3261e) !important; }
.xsf { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 12px; padding: 4px 14px; margin-bottom: 14px; }
.xfr { display: grid; grid-template-columns: 110px 84px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--w-line, #eef1f5); } .xfr:last-child { border-bottom: 0; }
.xfl { font: 600 13.5px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--ink); } .xmode { font: 700 11px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; letter-spacing: .04em; text-transform: uppercase; border: 1px solid #b9cde4; background: var(--w-tint-info, #eef5fc); color: var(--w-link, #1d5fa0); padding: 5px 8px; cursor: pointer; border-radius: 5px; } .xmode.out { background: var(--w-tint-bad, #fdeeee); color: var(--w-bad-text, #a3261e); border-color: #e7b9b5; } .xmode0 { border: 0; background: none; padding: 0; }
.xfin { position: relative; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; border: 1px solid #dfe5ee; border-radius: 6px; padding: 5px 7px; background: var(--w-surface, #fff); min-height: 40px; } .xfin:focus-within { border-color: #6f93bb; } .xfin input { flex: 1 1 200px; border: 0; outline: 0; font: 14px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 4px 2px; min-width: 120px; background: transparent; }
.xfr[data-f="state"] { grid-template-columns: 110px 84px minmax(0, 1fr) 190px; } .xfr select, .xsel select { font: 14px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 8px; border: 1px solid #dfe5ee; border-radius: 6px; background: var(--w-surface, #fff); }
.xchips { display: contents; } .xchip { display: inline-flex; align-items: center; gap: 5px; background: rgba(16,185,129,.12); color: #047857; border: 1px solid rgba(16,185,129,.35); font: 500 12px/1 "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 0 6px 0 9px; height: 24px; border-radius: 6px; max-width: 100%; box-sizing: border-box; } .xchip.out { background: rgba(239,68,68,.12); color: #b91c1c; border-color: rgba(239,68,68,.35); } .xchip button { border: 0; background: transparent; color: currentColor; opacity: .7; width: 16px; height: 16px; border-radius: 3px; cursor: pointer; font: 500 14px/1 "Instrument Sans", "InstrumentSans", system-ui, sans-serif; display: inline-flex; align-items: center; justify-content: center; padding: 0; } .xchip button:hover { opacity: 1; background: rgba(0,0,0,.08); }
.xsug { position: absolute; left: -1px; right: -1px; top: calc(100% + 4px); z-index: 30; background: var(--w-surface, #fff); border: 1px solid var(--w-line, #cfd8e3); border-radius: 8px; box-shadow: 0 10px 30px rgba(11,16,25,.14); max-height: 360px; overflow: auto; padding: 4px; }
.xsug button { display: grid; grid-template-columns: 70px minmax(0, 1fr) auto; gap: 10px; align-items: baseline; width: 100%; text-align: left; border: 0; background: none; padding: 8px 10px; border-radius: 6px; cursor: pointer; font: 14px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--ink); } .xsug button:hover, .xsug button.on { background: var(--w-tint-info, #eef5fc); }
.xsug b { font: 700 13px var(--mono); } .xsug em { font-style: normal; font-size: 12px; color: var(--dim); white-space: nowrap; } .xsug mark { background: var(--w-tint-warn, #fff1c2); color: inherit; padding: 0; }
.xopts { display: flex; flex-wrap: wrap; gap: 6px; grid-column: 3 / -1; } .xopts button { font: 600 12.5px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; border: 1px solid #dfe5ee; background: var(--w-surface, #fff); color: var(--ink2); padding: 6px 10px; border-radius: 4px; cursor: pointer; } .xopts button.on { background: #1f8f5f; border-color: #1f8f5f; color: #fff; } .xopts button.on.out { background: #a3261e; border-color: #a3261e; }
.xsel { grid-column: 3 / -1; display: flex; gap: 14px; flex-wrap: wrap; } .xsel label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--dim); }
.xstools { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin: 6px 0 8px; font-size: 14px; } .xsright { display: flex; gap: 10px; align-items: center; } .xsort { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--dim); } .xsort select { font: 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 6px; border: 1px solid #dfe5ee; border-radius: 6px; }
.xcolw { position: relative; } .xcolm { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; background: var(--w-surface, #fff); border: 1px solid var(--w-line, #cfd8e3); border-radius: 8px; box-shadow: 0 10px 30px rgba(11,16,25,.12); padding: 8px 12px; display: grid; gap: 6px; min-width: 160px; font-size: 13.5px; } .xcolm label { display: flex; gap: 8px; align-items: center; cursor: pointer; }
.xtw { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 12px; overflow-x: auto; } .xtab { width: 100%; border-collapse: collapse; font-size: 13.5px; } .xtab.busy { opacity: .55; transition: opacity .15s; }
.xtab th { text-align: left; font: 700 12px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--ink); padding: 10px 12px; border-bottom: 2px solid var(--w-line, #e3e8ef); white-space: nowrap; background: var(--w-surface, #fafbfd); } .xtab td { padding: 10px 12px; vertical-align: top; }
.xr td { border-top: 1px solid var(--w-line, #e8ecf2); } .xr + .xd td { padding-top: 0; } .xd td { font-size: 13px; color: var(--ink2); padding-bottom: 12px; } .xd b { color: var(--ink); }
.xtt { min-width: 280px; } .xtt a { color: var(--w-link, #1d5fa0); font-weight: 600; text-decoration: none; font-size: 14px; } .xtt a:hover { text-decoration: underline; } .xtt small, .xtab td small { display: block; color: var(--dim); font-size: 11.5px; margin-top: 2px; } .xd a { color: var(--w-link, #1d5fa0); }
.c-agency { min-width: 180px; } .xag { color: var(--w-link, #1d5fa0); } .c-posted, .c-due, .c-sa, .c-type { white-space: nowrap; } .xdot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-left: 4px; vertical-align: 1px; background: #c3cad4; } .xdot.ok { background: #1f8f5f; } .xdot.soon { background: #d9901e; } .xdot.past { background: #b0453d; }
.c-tools { white-space: nowrap; } .c-tools .sv { display: inline-flex; vertical-align: middle; } .xtl { font: 600 11.5px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--dim); text-decoration: none; margin-left: 6px; border: 1px solid #dfe5ee; padding: 4px 6px; border-radius: 4px; }
.xmsg { padding: 26px 16px !important; text-align: center; color: var(--ink2); } .xmsg .btn { margin-left: 8px; }
.xpager { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 16px 0; } #xpgs { display: flex; gap: 4px; flex-wrap: wrap; justify-content: center; }
.pgnum { min-width: 36px; height: 36px; padding: 0 10px; border: 1px solid var(--w-line, #cfd8e3); background: var(--w-surface, #fff); font: 600 13.5px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--ink); cursor: pointer; } .pgnum.on { background: var(--w-strong, #0b1019); border-color: var(--w-text, #0b1019); color: var(--w-on-strong, #fff); } #xpgs .pgdots { align-self: center; padding: 0 4px; color: var(--w-muted, #6b778a); }
.xmodal { position: fixed; inset: 0; z-index: 100; background: rgba(11,16,25,.55); display: flex; align-items: flex-start; justify-content: center; padding: 10vh 16px 16px; } .xmbox { position: relative; background: var(--w-surface, #fff); border-radius: 12px; width: min(460px, 100%); padding: 20px 22px; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.xmbox h3 { margin: 0 0 14px !important; } .xmbox label { display: grid; gap: 6px; font: 600 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; margin-bottom: 12px; } .xmbox input, .xmbox select { font: 15px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 10px; border: 1px solid var(--w-line, #cfd8e3); border-radius: 6px; } .xmx { position: absolute; right: 12px; top: 8px; border: 0; background: none; font-size: 24px; cursor: pointer; color: var(--dim); } .xmbtns { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
@media (max-width: 820px) { .xfr, .xfr[data-f="state"] { grid-template-columns: 1fr auto; } .xfr .xfin, .xfr .xopts, .xfr .xsel, .xfr > select { grid-column: 1 / -1; } .xmode0 { display: none; } .c-agency small { display: none; } }
.xmodal[hidden], .xcolm[hidden], .xsug[hidden], .xpager[hidden] { display: none !important; }
.xtab { margin: 0 !important; } .xtab thead tr:first-child th { border-top: 0; }
/* dashboard (0.9.3) */
.dbhead { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; } .dbhead h2 { margin: 0 !important; } .dbhead p { margin: 6px 0 0; color: var(--dim); } .dbact { display: flex; gap: 8px; }
.dbk { margin-bottom: 16px; } .dbgrid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; align-items: start; } .dbcol { display: grid; gap: 16px; min-width: 0; }
.dbc { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 14px; padding: 16px 18px; min-width: 0; scroll-margin-top: 80px; } .dbch { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 8px; } .dbch h3 { margin: 0 !important; font-size: 16px !important; } .dbch a.xmeta { color: var(--friendly); }
.dbl { list-style: none; margin: 0; padding: 0; } .dbl li { display: flex; gap: 12px; padding: 10px 0; border-top: 1px solid var(--w-line, #eef1f5); align-items: flex-start; } .dbl li:first-child { border-top: 0; } .dbl li::before { content: none !important; }
.dbl li > div { min-width: 0; flex: 1; } .dbl a { color: var(--w-link, #1d5fa0); font-weight: 600; text-decoration: none; font-size: 14px; } .dbl a:hover { text-decoration: underline; } .dbl small { display: block; color: var(--dim); font-size: 12.5px; margin-top: 2px; } .dbl em { display: block; font-style: normal; color: var(--w-ok-text, #1b6b4a); font-size: 12px; margin-top: 2px; }
.dbd { flex: none; width: 64px; text-align: center; border: 1px solid #dfe5ee; border-radius: 8px; padding: 5px 4px; } .dbd b { display: block; font-size: 13px; } .dbd small { margin: 0 !important; } .dbd.warm { border-color: #e7c07a; background: var(--w-tint-warn, #fff8ea); } .dbd.hot { border-color: #e7b9b5; background: var(--w-tint-bad, #fdeeee); }
.dbtag { flex: none; min-width: 52px; text-align: center; font: 700 11px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; text-transform: uppercase; letter-spacing: .04em; color: var(--dim); background: var(--w-surface2, #f1f4f8); border-radius: 5px; padding: 5px 6px; } .dbtag.new { background: #1f8f5f; color: #fff; }
.dbsc { flex: none; width: 38px; height: 38px; border-radius: 50%; background: var(--w-strong, #0b1019); color: #e0b457; display: flex; align-items: center; justify-content: center; font: 700 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; }
.dbnew { flex: none; width: 52px; text-align: center; font: 700 17px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--dim); } .dbnew small { font: 600 10px "Instrument Sans", "InstrumentSans", system-ui, sans-serif !important; text-transform: uppercase; margin: 0 !important; } .dbnew.on { color: var(--w-ok-text, #1f8f5f); }
.dbss select { font: 12px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 2px 4px; border: 1px solid #dfe5ee; border-radius: 4px; } .dblink { border: 0; background: none; color: var(--w-bad-text, #a3261e); font: 12px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; cursor: pointer; padding: 0; }
.dbempty { color: var(--dim); font-size: 14px; margin: 4px 0; } .dbempty a { color: var(--friendly); }
.calnav button { border: 1px solid #dfe5ee; background: var(--w-surface, #fff); width: 30px; height: 28px; border-radius: 6px; cursor: pointer; font-size: 16px; }
.calg { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; } /* minmax(0, 1fr): a 1fr column grew to its content (91 px x 7 in a 460 px column at 1280, sideways scroll; Site Designer 4 Oct) */ .calw { text-align: center; font: 700 11px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--dim); padding: 2px 0; }
.cald { min-width: 0; position: relative; border: 1px solid var(--w-line, #eef1f5); background: var(--w-surface, #fff); border-radius: 6px; aspect-ratio: 1.25; font: 600 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--ink); cursor: pointer; padding: 0; } .cald.past { color: var(--w-muted, #b3bcc8); } .cald.today { border-color: var(--w-text, #0b1019); }
.cald.has { background: var(--w-tint-warn, #fff8ea); border-color: #e7c07a; } .cald i { position: absolute; right: 3px; top: 2px; font: 700 10px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; font-style: normal; background: #b8861f; color: #fff; border-radius: 8px; padding: 0 4px; }
.dbcald { margin-top: 10px; font-size: 14px; } .dbalr { display: grid; gap: 8px; margin-bottom: 6px; } .dbalr label { display: flex; gap: 8px; align-items: center; font-size: 14px; } .dbalr select { font: 14px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 6px; border: 1px solid #dfe5ee; border-radius: 6px; }
.side .sdash { font-weight: 700; margin-bottom: 4px; }
@media (max-width: 980px) { .dbgrid { grid-template-columns: 1fr; } }
.dbhead h2 { font-size: clamp(26px, 3.2vw, 38px) !important; } .dbc .xmeta { font-size: 13px; line-height: 1.5; } .dbc p { font-size: 14px; }
/* 0.9.4: dashboard tiles as links, logo, compact matches; search list banner and profile toggle; company filters */
.kpis a.dbkl { display: block; background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 10px; padding: 12px 14px; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s; }
.kpis a.dbkl:hover { border-color: #1d5fa0; box-shadow: 0 4px 14px rgba(11,16,25,.08); } .kpis a.dbkl small { display: block; font-size: 12px; color: var(--w-link, #1d5fa0); margin-top: 2px; }
#dbhi { display: flex; align-items: center; gap: 14px; } .dblogo { width: 52px; height: 52px; object-fit: contain; border-radius: 10px; border: 1px solid var(--soft); background: var(--w-surface, #fff); padding: 4px; flex: none; }
.dbmt { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 13.5px; margin: 0 !important; } .dbmt td { padding: 6px 4px; border-top: 1px solid var(--w-line, #eef1f5); vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .dbmt tr:first-child td { border-top: 0; }
.dbmt td:first-child { width: 46px; } .dbmt .dbmtt a { color: var(--w-link, #1d5fa0); font-weight: 600; font-size: 13.5px; text-decoration: none; } .dbmtt a:hover { text-decoration: underline; } .dbmta { width: 26%; color: var(--dim); font-size: 12.5px; } .dbmtd { width: 58px; text-align: right; color: var(--ink2); font-size: 12.5px; }
.dbsc2 { display: inline-block; min-width: 28px; text-align: center; font: 700 11.5px "Instrument Sans", "InstrumentSans", sans-serif; color: #e0b457; background: var(--w-strong, #0b1019); border-radius: 10px; padding: 3px 5px; } .dbav { margin: 6px 0 0; }
@media (max-width: 600px) { .dbmta { display: none; } }
.xlist { background: var(--w-tint-info, #eef5fc); border: 1px solid #b9cde4; border-radius: 8px; padding: 9px 12px; margin: 0 0 10px; font-size: 14px; } .xlist[hidden] { display: none; } .xlist .dblink { color: var(--w-link, #1d5fa0); font-size: 13.5px; margin-left: 8px; }
.xfit { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink2); cursor: pointer; } .xfit[hidden] { display: none; } .xfit input { margin: 0; }
.cof2 { margin-top: 12px; } #cores.busy { opacity: .55; } .coitem strong { color: var(--w-ok-text, #1b6b4a); font-weight: 700; }
/* 0.9.4: recruiter demo (10 s loop) */
.rxd { position: relative; max-width: 760px; height: 330px; margin: 6px 0 6px; background: var(--w-surface, #fff); border: 1px solid var(--w-line, #d9e0ea); border-radius: 12px; overflow: hidden; box-shadow: 0 10px 30px rgba(11,16,25,.08); font-family: "Instrument Sans", "InstrumentSans", sans-serif; }
.rxbar { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; background: var(--w-surface2, #f3f5f8); border-bottom: 1px solid var(--w-line, #e3e8ee); } .rxbar span { width: 10px; height: 10px; border-radius: 50%; background: var(--w-surface2, #d3d9e2); } .rxbar b { margin-left: 10px; font-size: 12.5px; color: var(--w-text2, #3a4452); } .rxbar em { margin-left: auto; font-style: normal; font-size: 11px; color: var(--w-muted, #8a94a3); }
.rxs { position: absolute; inset: 34px 0 0 0; padding: 18px 20px; transition: opacity .45s, transform .45s; } .rxs2 { opacity: 0; transform: translateX(30px); pointer-events: none; background: var(--w-surface, #fff); }
.rxd.s-google .rxs1 { opacity: 0; transform: translateX(-30px); } .rxd.s-google .rxs2 { opacity: 1; transform: none; }
.rxu { margin-left: auto; max-width: 78%; background: var(--w-surface2, #eef2f7); border-radius: 14px 14px 4px 14px; padding: 10px 14px; font-size: 14px; color: var(--w-text, #0b1019); min-height: 20px; } .rxcur { display: inline-block; width: 2px; height: 15px; background: var(--w-strong, #0b1019); vertical-align: -2px; margin-left: 1px; animation: rxbl 1s steps(1) infinite; } .rxd.s-ans .rxcur { display: none; }
@keyframes rxbl { 50% { opacity: 0; } }
.rxa { margin-top: 14px; max-width: 92%; font-size: 14px; color: var(--w-text, #1d2430); opacity: 0; transform: translateY(8px); transition: opacity .4s, transform .4s; } .rxd.s-ans .rxa { opacity: 1; transform: none; } .rxa p { margin: 0 0 8px; }
.rxa code { display: block; font: 12.5px/1.5 ui-monospace, Menlo, monospace; background: var(--w-strong, #0b1019); color: #e0b457; padding: 10px 12px; border-radius: 8px; white-space: normal; word-break: break-word; }
.rxbtn { display: inline-block; margin-top: 10px; font: 700 12px "Instrument Sans", "InstrumentSans", sans-serif; background: #1a73e8; color: #fff; padding: 7px 12px; border-radius: 6px; transition: transform .15s, box-shadow .15s; } .rxd.s-click .rxbtn { transform: scale(.94); box-shadow: 0 0 0 4px rgba(26,115,232,.25); }
.rxq { font: 13px/1.4 Arial, sans-serif; color: var(--w-text, #202124); border: 1px solid var(--w-line, #dfe1e5); border-radius: 22px; padding: 9px 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: 0 1px 4px rgba(32,33,36,.12); }
.rxn { font: 12px Arial, sans-serif; color: var(--w-muted, #70757a); margin: 8px 4px 6px; }
.rxr { list-style: none; margin: 0; padding: 0 4px; display: grid; gap: 7px; } .rxr li { font-family: Arial, sans-serif; opacity: 0; transform: translateY(6px); } .rxr li::before { content: none !important; }
.rxd.s-google .rxr li { animation: rxin .35s ease forwards; animation-delay: var(--d); } .rxd.s-static .rxr li { animation: none; opacity: 1; transform: none; }
@keyframes rxin { to { opacity: 1; transform: none; } }
.rxr small { display: block; font-size: 11.5px; color: var(--w-text2, #4d5156); } .rxr b { display: block; font-size: 14.5px; font-weight: 400; color: var(--w-link, #1a0dab); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .rxr span { display: block; font-size: 12px; color: var(--w-text2, #4d5156); }
.rxnote { margin: 0 0 16px; }
@media (max-width: 600px) { .rxd { height: 360px; } .rxu { max-width: 92%; } }
.rxd ol.rxr, .rxd ol.rxr li { list-style: none !important; margin: 0 !important; padding: 0 !important; max-width: none !important; } .rxd ol.rxr { padding: 0 4px !important; } .rxd ol.rxr li::marker { content: none; }
.rxd .rxa p { font-size: 14px !important; margin: 0 0 8px !important; } .rxd .rxn { font-size: 12px !important; margin: 8px 4px 6px !important; } .rxd .rxr b { font-size: 14.5px !important; } .rxd .rxr span, .rxd .rxr small { font-size: 12px !important; }
.c-est { white-space: nowrap; } .xest { font-variant-numeric: tabular-nums; color: var(--ink); cursor: help; border-bottom: 1px dotted var(--w-line2, #b3bcc8); }
.dbmte { width: 64px; text-align: right; font-size: 12.5px; color: var(--ink); font-variant-numeric: tabular-nums; cursor: help; }

/* 0.9.5 search: status row + company match */
.xcoin { position: relative; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; border: 1px solid #dfe5ee; border-radius: 6px; padding: 5px 7px; background: var(--w-surface, #fff); min-height: 40px; grid-column: 3 / -1; } .xcoin:focus-within { border-color: #6f93bb; } .xcoin input { flex: 1 1 220px; border: 0; outline: 0; font: 14px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 4px 2px; min-width: 120px; background: transparent; }
.xcoin .xchips { display: contents; } .xchip.me { background: var(--w-strong, #0b1019); } .xcohint { font-size: 12.5px; color: var(--dim); } .xcohint a { color: inherit; text-decoration: underline; }
#ostatus button.on { background: var(--w-strong, #0b1019); border-color: var(--w-text, #0b1019); color: var(--w-on-strong, #fff); }
th.c-match, td.c-match { width: 58px; text-align: center; } .xmwait { color: var(--dim); font-size: 12px; }
@media (max-width: 820px) { .xfr .xcoin { grid-column: 1 / -1; } }
#cosug button { grid-template-columns: 112px minmax(0, 1fr) auto; } #cosug b { overflow: hidden; text-overflow: ellipsis; }

/* 0.9.6: links between bids, offices and companies */
.xoff { color: inherit; text-decoration: none; border-bottom: 1px dotted var(--w-line2, #9aa6b6); } .xoff:hover { color: var(--w-link, #1d5fa0); border-bottom-color: #1d5fa0; }
#minmw[hidden] { display: none; }
.lk-card .lkrow { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 6px 14px; padding: 8px 0; border-top: 1px solid var(--w-line, #eef1f5); font-size: 14px; } .lk-card .lkrow:first-of-type { border-top: 0; } .lk-card .lkrow > b { font-weight: 600; color: var(--ink2, #3a4452); font-size: 13px; }
.lk-card ul { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 4px; } .lk-card li { font-size: 13.5px; } .lk-card li small { color: var(--w-muted, #6b778a); margin-left: 6px; }
.lk-card a { color: var(--w-link, #1d5fa0); } .lk-meth { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .02em; padding: 2px 6px; border-radius: 4px; background: var(--w-surface2, #eef2f7); color: var(--w-text2, #3a4452); margin-left: 6px; vertical-align: 1px; }
@media (max-width: 600px) { .lk-card .lkrow { grid-template-columns: 1fr; } }
.ofkpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 14px 0 6px; } .ofkpi div { background: var(--w-surface, #fff); border: 1px solid var(--soft, #e3e8ee); border-radius: 10px; padding: 12px 14px; } .ofkpi i { display: block; font-style: normal; font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--w-muted, #6b778a); } .ofkpi b { display: block; font-size: 22px; margin-top: 4px; font-variant-numeric: tabular-nums; }
.oflist { width: 100%; border-collapse: collapse; font-size: 13.5px; } .oflist th { text-align: left; font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--w-muted, #6b778a); padding: 6px 8px; border-bottom: 1px solid var(--w-line, #e3e8ee); } .oflist td { padding: 7px 8px; border-bottom: 1px solid var(--w-line, #eef1f5); vertical-align: top; } .oflist td.n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; } .oflist a { color: var(--w-link, #1d5fa0); } .oflist small { display: block; color: var(--w-muted, #6b778a); }
.ofwrap { overflow-x: auto; } .ofsec { margin: 26px 0 0; } .ofsec h3 { margin: 0 0 8px; }
.ofres { display: grid; gap: 8px; margin-top: 12px; } .ofres a { display: block; background: var(--w-surface, #fff); border: 1px solid var(--w-line, #e3e8ee); border-radius: 10px; padding: 12px 14px; text-decoration: none; color: inherit; } .ofres a:hover { border-color: #1d5fa0; } .ofres b { color: var(--w-link, #1d5fa0); } .ofres span { display: block; font-size: 13px; color: var(--w-muted, #6b778a); margin-top: 2px; }

/* 0.9.7: consistency fixes from the site review */
@media (max-width: 700px) { .doc .xtable { display: block; overflow-x: auto; max-width: 100%; } }
.xfbtn { display: none; }
@media (max-width: 820px) { .xfbtn { display: inline-flex; width: 100%; justify-content: center; margin: 0 0 10px; } #filters.xcolm2:not(.xopen) { display: none; } }
.xform { background: var(--w-surface, #fff); border: 1px solid var(--soft, #e3e8ee); border-radius: 12px; padding: 14px 16px; max-width: none; gap: 12px 14px; }
.xform label { font: 600 12.5px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; letter-spacing: 0; text-transform: none; color: var(--ink, #0b1019); }
.xform input, .xform select, .xform textarea { font: 14px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; border: 1px solid #dfe5ee; border-radius: 6px; min-height: 40px; }
.xform input:focus, .xform select:focus, .xform textarea:focus { outline: 0; border-color: #6f93bb; }
.xform .btn { border-radius: 6px; min-height: 40px; }

/* 0.9.8: Proposal Studio checklists, People Finder tabs, playbook templates */
.cktabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 10px; }
.cktabs button { font: 600 13px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 7px 14px; border: 1px solid #dfe5ee; border-radius: 999px; background: var(--w-surface, #fff); color: var(--w-text2, #3a4452); cursor: pointer; }
.cktabs button.on { background: var(--w-strong, #0b1019); border-color: var(--w-text, #0b1019); color: var(--w-on-strong, #fff); }
.ckbar { height: 6px; background: var(--w-surface2, #eef1f5); border-radius: 3px; overflow: hidden; max-width: 760px; } .ckbar i { display: block; height: 100%; width: 0; background: #1d7a46; transition: width .25s; }
.cklist { max-width: 760px; margin-top: 10px; } .ckitem { display: flex; gap: 10px; align-items: flex-start; padding: 9px 12px; border: 1px solid var(--w-line, #e3e8ee); border-radius: 8px; background: var(--w-surface, #fff); margin: 0 0 6px; font-size: 14px; line-height: 1.45; cursor: pointer; }
.ckitem input { margin-top: 3px; accent-color: #1d7a46; } .ckitem input:checked + span { color: var(--w-muted, #6b778a); text-decoration: line-through; }
.tplbox { white-space: pre-wrap; font: 13px/1.5 var(--mono, monospace); background: var(--w-surface2, #f6f8fb); border: 1px solid var(--w-line, #e3e8ee); border-radius: 8px; padding: 12px 14px; margin: 8px 0; max-width: 760px; overflow-x: auto; }
.pfm { margin-top: 0; } .side em.pro { letter-spacing: .02em; }
.xsortb { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; }
.xsortb i { font-style: normal; font-size: 10px; color: var(--w-muted, #9aa6b8); } .xsortb.on i { color: var(--w-text, #0b1019); } .xsortb:hover { text-decoration: underline; } .xsortb:focus-visible { outline: 2px solid #6f93bb; outline-offset: 2px; }

/* type-ahead dropdown (company, office) 0.9.10 */
.cosug { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 40; background: var(--w-surface, #fff); border: 1px solid var(--w-line, #cfd8e3); border-radius: 10px; box-shadow: 0 12px 32px rgba(11,16,25,.16); padding: 4px; max-height: 420px; overflow: auto; }
.cosug a { display: flex; gap: 10px; align-items: center; padding: 9px 10px; border-radius: 8px; text-decoration: none; color: var(--w-text, #0b1019); border: 0; }
.cosug a:hover, .cosug a.on { background: var(--w-surface2, #f1f4f8); }
.cosug a div { flex: 1; min-width: 0; } .cosug a b { display: block; font: 600 14px var(--cond); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cosug a b mark { background: var(--w-tint-warn, #fff1c2); color: inherit; padding: 0; }
.cosug a small { display: block; font-size: 12.5px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cosug a em { font-style: normal; font: 600 10px var(--mono); letter-spacing: .04em; color: var(--w-ok-text, #1f6b50); background: var(--w-tint-ok, #e3f4ec); border-radius: 4px; padding: 2px 5px; flex: none; }
.cosug .more { display: block; text-align: center; font-size: 12.5px; color: var(--ink2); padding: 7px; }

/* 0.9.10: boards on Company Research and Contracting Offices */
.boards { margin: 22px 0 10px; display: grid; gap: 16px; max-width: 980px; grid-template-columns: 1fr; }
@media (min-width: 960px) { .boards { grid-template-columns: 1fr 1fr; align-items: start; } .boards .bdcap, .boards .bdas, .boards .bdwide { grid-column: 1 / -1; } }
.bdcard { background: var(--w-surface, #fff); border: 1px solid var(--soft); border-radius: 12px; padding: 16px 18px 12px; }
.bdcard.bdcap { border-top: 3px solid #b8861f; }
.bdh h3 { margin: 0 0 2px; font-size: 17px; } .bdh p { margin: 0 0 10px; font-size: 13px; color: var(--ink2); line-height: 1.45; }
.bdtabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 10px; }
.bdtabs button { font: 600 12px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 6px 11px; border-radius: 16px; border: 1px solid #dfe5ee; background: var(--w-surface, #fff); color: var(--w-text2, #3d4757); cursor: pointer; }
.bdtabs button.on { background: var(--w-strong, #0b1019); color: var(--w-on-strong, #fff); border-color: var(--w-text, #0b1019); }
.bdlist { display: grid; }
.bdrow { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 4px; border-top: 1px solid var(--w-line, #eef1f5); text-decoration: none; color: inherit; }
.bdrow:first-child { border-top: 0; } .bdrow:hover b { text-decoration: underline; }
.bdrow.bdaw { grid-template-columns: minmax(0, 1fr) auto; }
.bdn { font: 600 11px var(--mono); color: var(--w-muted, #9aa3b0); text-align: right; }
.bdt { min-width: 0; } .bdt b { display: block; font-size: 14px; font-weight: 600; color: var(--w-text, #0b1019); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bdt small { display: block; font-size: 12px; color: var(--dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bdv { font: 600 13px var(--mono); color: var(--w-text, #0b1019); text-align: right; white-space: nowrap; } .bdv small { display: block; font: 11px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--dim); }
.bdempty, .bdfoot { font-size: 12.5px; color: var(--dim); margin: 6px 0 2px; } .bdfoot a { color: var(--w-gold-text, #8f6510); } .bdas { margin: -6px 0 0; }
.bdteaser { font-size: 14px; color: var(--ink2); line-height: 1.5; margin: 0 0 4px; } .bdteaser .btn { margin: 8px 8px 0 0; }
.bdtag { display: inline-block; font: 600 10px var(--mono); letter-spacing: .06em; color: var(--w-gold-text, #8f6510); border: 1px solid rgba(184,134,31,.45); border-radius: 4px; padding: 1px 6px; vertical-align: middle; }
.bdstates { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 6px; }
.bdstates a { display: grid; grid-template-columns: 30px 1fr; grid-template-rows: auto auto; column-gap: 6px; align-items: center; padding: 7px 9px; border: 1px solid var(--w-line, #eef1f5); border-radius: 8px; text-decoration: none; color: inherit; background: var(--w-surface, #fafbfd); }
.bdstates a:hover { border-color: var(--w-line, #cfd8e3); } .bdstates b { grid-row: 1 / 3; font: 700 14px var(--mono); color: var(--w-text, #0b1019); } .bdstates span { font-size: 11.5px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .bdstates i { font-style: normal; font: 600 12px var(--mono); color: var(--w-text, #0b1019); }
@media (max-width: 800px) { .bdcard { padding: 14px 14px 10px; } .bdstates { grid-template-columns: repeat(3, 1fr); } .bdstates span { display: none; } .bdstates a { grid-template-columns: 1fr; grid-template-rows: auto; justify-items: center; text-align: center; } .bdstates b { grid-row: auto; } }

/* site-ui004 Release B: the three instant lists (Daily Sweep, Recompete Radar, Graduation Watch) */
.brgo { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 6px 0 16px; }
.brgo .btn { padding: 10px 18px; }
.brmeta { font-size: 13px; color: var(--w-muted, #5f6b7c); }
.brlist td.brn, .brlist th.brn { width: 34px; text-align: right; color: var(--w-muted, #5f6b7c); }
.brlist td.brt a { font-weight: 600; }
.brsub { font-size: 12px; color: var(--w-muted, #5f6b7c); margin-top: 2px; }
.brwhy { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.brwhy span { font-size: 11px; line-height: 16px; padding: 0 6px; border-radius: 9px; background: var(--w-surface2, #f1f4f8); color: var(--w-text2, #3b4656); border: 1px solid var(--w-line, #e3e8ee); }
.brk { display: inline-block; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--w-gold-text, #8a5f12); }
.brlist td.brv, .brlist td.brc, .brlist td.brd { white-space: nowrap; font-variant-numeric: tabular-nums; }
.brmsg .btn { margin-left: 10px; }
@media (max-width: 480px) { .due { white-space: normal; } } /* the coming-due list wraps on phones (nowrap overflowed at 390: Site Designer 4 Oct) */
/* D1 piece 4: agency seal next to the agency name in the board lists */
.agc { display: inline-flex; align-items: center; gap: 8px; }
.org-logo { box-sizing: border-box; flex: none; border-radius: 6px; border: 1px solid var(--line2, #dde3ea); background: #fff; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; font: 700 10px/1 Arial, sans-serif; color: #5b6573; }
.org-logo.sm { width: 24px; height: 24px; border-radius: 4px; }
.org-logo img { width: 100%; height: 100%; object-fit: contain; padding: 2px; display: block; }
.org-logo.fb { background: #f4f6f8; }