/* Solar LLM page — extends brity.css (.br) + upstage.css (.up) */
.sl-hero .br-hero-in { padding-top: 48px; }
.sl-card { margin: 0; border-radius: 14px; overflow: hidden; background: #0f1220; color: #fff; box-shadow: 0 30px 60px -30px rgba(15,18,32,.5); }
.sl-card-h { display: flex; justify-content: space-between; align-items: baseline; padding: 22px 26px 6px; }
.sl-card-h span { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; color: rgba(255,255,255,.5); }
.sl-card-h b { font-size: 15px; color: var(--accent-light); }
.sl-bar { padding: 18px 26px; border-bottom: 1px solid rgba(255,255,255,.08); }
.sl-bar .lb { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px; }
.sl-bar .lb b { font-size: 16px; }
.sl-bar .lb small { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; color: rgba(255,255,255,.5); }
.sl-bar .tr { display: flex; flex-direction: column; gap: 5px; }
.sl-bar i { display: flex; align-items: center; justify-content: flex-end; height: 22px; border-radius: 4px; min-width: 34px; animation: slGrow 1s cubic-bezier(.2,.8,.2,1) both; transform-origin: left; }
.sl-bar i span { font-style: normal; font-family: 'JetBrains Mono', monospace; font-size: 12px; font-weight: 500; padding-right: 8px; }
.sl-bar i.old { background: rgba(255,255,255,.12); color: rgba(255,255,255,.6); }
.sl-bar i.new { background: var(--accent); color: #fff; animation-delay: .2s; }
@keyframes slGrow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.sl-card figcaption { display: flex; align-items: baseline; gap: 12px; padding: 20px 26px; font-size: 34px; font-weight: 800; letter-spacing: -0.03em; }
.sl-card figcaption b { font-size: 11.5px; font-family: 'JetBrains Mono', monospace; font-weight: 500; color: var(--accent-light); text-transform: uppercase; letter-spacing: .06em; }
.sl-card figcaption span { font-size: 14px; font-weight: 500; color: rgba(255,255,255,.55); letter-spacing: 0; }

/* lineup */
.sl-time { display: grid; grid-template-columns: repeat(7, 1fr); border-top: 1px solid var(--line); margin-bottom: 40px; }
.sl-time > div { position: relative; padding: 22px 12px 0 0; display: flex; flex-direction: column; gap: 4px; }
.sl-time i { position: absolute; top: -5px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--line); }
.sl-time small { font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--muted); }
.sl-time b { font-size: 16px; color: var(--muted); }
.sl-time .on i { background: var(--accent); box-shadow: 0 0 0 4px color-mix(in oklch, var(--accent) 20%, transparent); }
.sl-time .on b { color: var(--fg); }
.sl-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.sl-duo > div { border-radius: var(--radius); padding: 36px; cursor: pointer; display: flex; flex-direction: column; transition: transform .2s; }
.sl-duo > div:hover { transform: translateY(-2px); }
.sl-duo .pro { background: #0f1220; color: #fff; }
.sl-duo .mini { background: var(--surface); }
.sl-duo small { font-size: 13px; font-weight: 700; color: var(--accent); }
.sl-duo .pro small { color: var(--accent-light); }
.sl-duo h3 { font-size: 40px; letter-spacing: -0.04em; margin: 8px 0 12px; }
.sl-duo p { font-size: 15px; opacity: .72; max-width: 440px; }
.sl-duo dl { display: grid; grid-template-columns: repeat(4, 1fr); margin: 28px 0 0; border-top: 1px solid var(--line); }
.sl-duo .pro dl { border-color: rgba(255,255,255,.14); }
.sl-duo dl > div { padding: 14px 10px 0 0; }
.sl-duo dt { font-family: 'JetBrains Mono', monospace; font-size: 11px; opacity: .55; }
.sl-duo dd { margin: 4px 0 0; font-weight: 700; font-size: 15px; }
.sl-duo em { font-style: normal; font-weight: 700; font-size: 14px; margin-top: 28px; color: var(--accent); }
.sl-duo .pro em { color: var(--accent-light); }

/* pro bench */
.sl-bench { display: grid; grid-template-columns: 340px 1fr; gap: 40px; align-items: stretch; }
.sl-bench-nav { display: flex; flex-direction: column; border-top: 1px solid var(--fg); }
.sl-bench-nav button { text-align: left; padding: 18px 0; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto; row-gap: 2px; color: var(--muted); }
.sl-bench-nav small { grid-column: 1 / -1; font-family: 'JetBrains Mono', monospace; font-size: 11.5px; }
.sl-bench-nav b { font-size: 17px; }
.sl-bench-nav span { font-family: 'JetBrains Mono', monospace; font-size: 14px; }
.sl-bench-nav button.on { color: var(--fg); }
.sl-bench-nav button.on small, .sl-bench-nav button.on strong { color: var(--accent); }
.sl-bench-body { background: var(--surface); border-radius: var(--radius); padding: 40px 44px; display: flex; flex-direction: column; justify-content: center; animation: aUp .4s both; }
.sl-bench-body .big { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; }
.sl-bench-body .big span { font-size: 56px; font-weight: 800; color: var(--muted); letter-spacing: -0.04em; opacity: .5; }
.sl-bench-body .big i { font-style: normal; font-size: 28px; color: var(--muted); }
.sl-bench-body .big b { font-size: 96px; letter-spacing: -0.05em; line-height: 1; color: var(--accent); }
.sl-bench-body .big em { font-style: normal; font-family: 'JetBrains Mono', monospace; font-size: 16px; padding: 6px 12px; border-radius: 999px; background: var(--fg); color: var(--bg); }
.sl-bench-body p { font-size: 19px; font-weight: 600; letter-spacing: -0.02em; margin-top: 20px; max-width: 560px; }
.sl-bench-body small { margin-top: 18px; font-size: 12px; color: var(--muted); }

.sl-two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 56px; }
.sl-two > div { border: 1px solid var(--line); border-radius: var(--radius); padding: 36px; display: flex; flex-direction: column; }
.sl-two h4 { font-size: 26px; letter-spacing: -0.03em; line-height: 1.35; margin: 18px 0 12px; }
.sl-two > div > p { font-size: 14.5px; color: var(--muted); }
.sl-work ol { list-style: none; margin-top: 24px; border-top: 1px solid var(--line); }
.sl-work li { display: grid; grid-template-columns: 34px 110px 1fr; gap: 8px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--line); }
.sl-work li em { font-style: normal; font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--accent); }
.sl-work li b { font-size: 16px; }
.sl-work li span { font-size: 14px; color: var(--muted); }
.sl-verdict { display: flex; flex-direction: column; gap: 8px; margin-top: 24px; }
.sl-verdict button { text-align: left; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 14px 16px; border-radius: 10px; background: var(--surface); transition: .2s; }
.sl-verdict code { font-family: 'JetBrains Mono', monospace; font-size: 12px; padding: 3px 8px; border-radius: 5px; background: var(--bg); border: 1px solid var(--line); }
.sl-verdict b { font-size: 15px; }
.sl-verdict span { flex-basis: 100%; font-size: 14px; color: var(--muted); animation: aUp .3s both; }
.sl-verdict button.on { background: var(--bg); box-shadow: 0 0 0 1px var(--fg); }
.sl-verdict .ok.on code { background: oklch(0.93 0.06 150); border-color: transparent; color: oklch(0.42 0.12 150); }
.sl-verdict .no.on code { background: oklch(0.93 0.05 25); border-color: transparent; color: oklch(0.48 0.15 25); }
.sl-verdict .mm.on code { background: oklch(0.94 0.06 85); border-color: transparent; color: oklch(0.48 0.1 70); }

.sl-price { margin-top: 16px; display: grid; grid-template-columns: 1.6fr repeat(3, 1fr) auto; align-items: center; gap: 0; background: #0f1220; color: #fff; border-radius: var(--radius); padding: 32px 36px; }
.sl-price .h { padding-right: 32px; }
.sl-price .h small { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; color: var(--accent-light); }
.sl-price .h b { display: block; font-size: 20px; margin: 6px 0 8px; letter-spacing: -0.02em; }
.sl-price .h p { font-size: 13.5px; color: rgba(255,255,255,.6); }
.sl-price .v { border-left: 1px solid rgba(255,255,255,.12); padding: 6px 24px; display: flex; flex-direction: column; gap: 4px; }
.sl-price .v span { font-size: 12.5px; color: rgba(255,255,255,.55); }
.sl-price .v b { font-size: 34px; letter-spacing: -0.03em; }
.sl-price .u { font-family: 'JetBrains Mono', monospace; font-size: 12px; color: rgba(255,255,255,.5); align-self: end; padding-bottom: 8px; }
.sl-price.mini { background: var(--surface); color: var(--fg); margin-top: 16px; }
.sl-price.mini .h small { color: var(--accent); }
.sl-price.mini .h p, .sl-price.mini .v span, .sl-price.mini .u { color: var(--muted); }
.sl-price.mini .v { border-color: var(--line); }

/* mini */
.sl-mini { display: grid; grid-template-columns: 1.2fr 1fr; gap: 16px; }
.sl-aa { border: 1px solid var(--line); border-radius: var(--radius); padding: 32px; }
.sl-aa .hd { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 14px; margin-bottom: 6px; border-bottom: 1px solid var(--fg); }
.sl-aa .hd b { font-size: 15px; }
.sl-aa .hd small { font-size: 12px; color: var(--muted); }
.sl-aa .r { display: grid; grid-template-columns: 170px 1fr 92px; gap: 14px; align-items: center; padding: 10px 0; }
.sl-aa .n { font-size: 14px; font-weight: 600; color: var(--muted); }
.sl-aa .b { display: flex; align-items: center; gap: 10px; }
.sl-aa .b i { height: 14px; border-radius: 3px; background: var(--line); animation: slGrow .9s cubic-bezier(.2,.8,.2,1) both; transform-origin: left; }
.sl-aa .b em { font-style: normal; font-family: 'JetBrains Mono', monospace; font-size: 13px; color: var(--muted); }
.sl-aa .p { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; color: var(--muted); text-align: right; }
.sl-aa .r.me { margin: 0 -14px; padding: 12px 14px; border-radius: 8px; background: color-mix(in oklch, var(--accent) 8%, var(--bg)); }
.sl-aa .r.me .n { color: var(--fg); font-weight: 800; }
.sl-aa .r.me .b i { background: var(--accent); }
.sl-aa .r.me .b em, .sl-aa .r.me .p { color: var(--accent); font-weight: 700; }
.sl-aa > p { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.sl-mini-side { display: flex; flex-direction: column; gap: 16px; }
.sl-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); }
.sl-kpis > div { background: var(--bg); padding: 22px 22px; display: flex; flex-direction: column; gap: 6px; }
.sl-kpis b { font-size: 32px; letter-spacing: -0.03em; color: var(--accent); }
.sl-kpis span { font-size: 13.5px; font-weight: 700; display: flex; flex-direction: column; }
.sl-kpis small { font-size: 12.5px; font-weight: 500; color: var(--muted); }
.sl-cost { flex: 1; background: #0f1220; color: #fff; border-radius: var(--radius); padding: 26px 28px; display: flex; flex-direction: column; gap: 12px; }
.sl-cost > small { font-size: 12.5px; color: rgba(255,255,255,.6); margin-bottom: 4px; }
.sl-cost .r { display: grid; grid-template-columns: 100px 1fr 54px; gap: 12px; align-items: center; font-size: 13.5px; }
.sl-cost .r div { height: 12px; }
.sl-cost .r i { display: block; height: 100%; border-radius: 3px; background: rgba(255,255,255,.18); }
.sl-cost .r.me i { background: var(--accent-light); }
.sl-cost .r b { font-family: 'JetBrains Mono', monospace; font-size: 14px; text-align: right; }
.sl-cost .r.me b { color: var(--accent-light); }
.sl-cost p { margin-top: auto; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.12); font-size: 13px; color: rgba(255,255,255,.62); }
.sl-cost p strong { display: block; font-size: 30px; color: #fff; letter-spacing: -0.03em; margin-bottom: 4px; }

.sl-use { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
.sl-use > div { background: var(--surface); border-radius: var(--radius); padding: 28px; }
.sl-use small { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; color: var(--accent); }
.sl-use h4 { font-size: 19px; letter-spacing: -0.02em; margin: 10px 0 10px; }
.sl-use p { font-size: 14px; color: var(--muted); }

.sl-dev { display: grid; grid-template-columns: 1fr 1.25fr; gap: 40px; align-items: center; margin-top: 56px; }
.sl-dev h4 { font-size: 24px; letter-spacing: -0.03em; line-height: 1.4; }
.sl-dev ul { list-style: none; margin-top: 20px; }
.sl-dev li { position: relative; padding: 11px 0 11px 20px; font-size: 14.5px; border-top: 1px solid var(--line); }
.sl-dev li::before { content: ''; position: absolute; left: 0; top: 21px; width: 8px; height: 2px; background: var(--accent); }
.sl-code { margin: 0; background: #0f1220; color: #d7dbe8; border-radius: var(--radius); padding: 26px 28px; font-family: 'JetBrains Mono', monospace; font-size: 13px; line-height: 1.7; overflow-x: auto; white-space: pre; }
.sl-code .k { color: var(--accent-light); }
.sl-code .s { color: oklch(0.82 0.1 150); }

/* compare */
.sl-pick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 40px; }
.sl-pick > div { border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 28px; }
.sl-pick > div.on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.sl-pick small { font-size: 12.5px; font-weight: 700; color: var(--accent); }
.sl-pick h4 { font-size: 24px; letter-spacing: -0.03em; margin: 6px 0 8px; }
.sl-pick p { font-size: 14px; color: var(--muted); }
.sl-cmp { display: grid; grid-template-columns: 240px 1fr; gap: 32px; align-items: start; }
.sl-cmp-nav { display: flex; flex-direction: column; border-top: 1px solid var(--fg); }
.sl-cmp-nav button { text-align: left; display: flex; justify-content: space-between; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--line); font-weight: 700; font-size: 16px; color: var(--muted); }
.sl-cmp-nav small { font-family: 'JetBrains Mono', monospace; font-size: 12px; font-weight: 500; }
.sl-cmp-nav button.on { color: var(--fg); }
.sl-cmp-nav button.on small { color: var(--accent); }
.sl-cmp-t { animation: aUp .4s both; border-top: 1px solid var(--fg); }
.sl-cmp-t > div { display: grid; grid-template-columns: 1.3fr 1fr 1fr 70px; gap: 18px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); }
.sl-cmp-t .hd span { font-size: 13px; font-weight: 700; color: var(--muted); }
.sl-cmp-t .hd .p4 { color: var(--accent); }
.sl-cmp-t b { font-size: 14.5px; }
.sl-cmp-t .v { display: flex; align-items: center; gap: 10px; font-family: 'JetBrains Mono', monospace; font-size: 13px; color: var(--muted); }
.sl-cmp-t .v i { height: 8px; border-radius: 2px; background: var(--line); max-width: 70%; flex: none; }
.sl-cmp-t .v.p4 { color: var(--fg); font-weight: 600; }
.sl-cmp-t .v.p4 i { background: var(--accent); }
.sl-cmp-t .gap { font-family: 'JetBrains Mono', monospace; font-size: 13px; font-weight: 600; color: var(--accent); text-align: right; }
.sl-cmp-t .gap.neg { color: var(--muted); }
.sl-cmp-t > small { display: block; margin-top: 12px; font-size: 12px; color: var(--muted); }

/* traction */
.sl-daum { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); background: #0f1220; color: #fff; border-radius: var(--radius); overflow: hidden; }
.sl-daum > div { padding: 36px 32px; }
.sl-daum .h .ba-pill { color: var(--accent-light); }
.sl-daum h3 { font-size: 26px; letter-spacing: -0.03em; line-height: 1.35; margin: 16px 0 12px; }
.sl-daum .h p { font-size: 14px; color: rgba(255,255,255,.6); }
.sl-daum .n { border-left: 1px solid rgba(255,255,255,.1); display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; }
.sl-daum .n b { font-size: 44px; letter-spacing: -0.04em; color: var(--accent-light); line-height: 1; }
.sl-daum .n b small { font-size: 15px; color: rgba(255,255,255,.5); margin-left: 4px; letter-spacing: 0; }
.sl-daum .n span { font-size: 13.5px; color: rgba(255,255,255,.65); }
.sl-eco { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 16px; }
.sl-eco > div { border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; }
.sl-eco small { font-family: 'JetBrains Mono', monospace; font-size: 11.5px; color: var(--muted); }
.sl-eco b { display: block; font-size: 44px; letter-spacing: -0.04em; color: var(--accent); margin: 10px 0 12px; line-height: 1; }
.sl-eco b em { font-style: normal; font-size: 15px; color: var(--muted); margin-left: 4px; letter-spacing: 0; }
.sl-eco p { font-size: 14px; color: var(--muted); }

/* deploy */
.sl-ch { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.sl-ch > div { background: var(--bg); padding: 26px 28px; }
.sl-ch > div.on { background: color-mix(in oklch, var(--accent) 8%, var(--bg)); }
.sl-ch h5 { font-size: 17px; letter-spacing: -0.02em; }
.sl-ch > div.on h5 { color: var(--accent); }
.sl-ch p { font-size: 14px; color: var(--muted); margin-top: 6px; }
.sl-int { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 20px; }
.sl-int span { font-size: 13px; font-weight: 700; color: var(--muted); margin-right: 8px; }
.sl-int em { font-style: normal; font-size: 13.5px; font-weight: 600; padding: 8px 14px; border-radius: 999px; background: var(--surface); }
.sl-spec { margin-top: 56px; display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; align-items: start; }
.sl-spec h3 { font-size: 28px; letter-spacing: -0.03em; }
.sl-spec .hd p { font-size: 14.5px; color: var(--muted); margin-top: 12px; }
.sl-spec .t { border-top: 1px solid var(--fg); }
.sl-spec .r { display: grid; grid-template-columns: 120px 1fr 1fr; border-bottom: 1px solid var(--line); }
.sl-spec .r > * { padding: 13px 14px; font-size: 14.5px; }
.sl-spec .r > *:first-child { padding-left: 0; }
.sl-spec .r span { font-family: 'JetBrains Mono', monospace; font-size: 13.5px; }
.sl-spec .r.h span { font-family: inherit; font-weight: 800; font-size: 15px; }
.sl-spec .r.h span:nth-child(2) { color: var(--accent); }

@container site (max-width: 900px) {
  .sl-time { grid-template-columns: repeat(7, 120px); overflow-x: auto; scrollbar-width: none; }
  .sl-duo, .sl-bench, .sl-two, .sl-mini, .sl-use, .sl-dev, .sl-pick, .sl-cmp, .sl-eco, .sl-ch, .sl-spec { grid-template-columns: minmax(0, 1fr); }
  .sl-duo > div, .sl-two > div { padding: 24px; }
  .sl-duo h3 { font-size: 30px; }
  .sl-duo dl { grid-template-columns: 1fr 1fr; }
  .sl-bench { gap: 16px; }
  .sl-bench-body { padding: 24px; }
  .sl-bench-body .big b { font-size: 64px; }
  .sl-bench-body .big span { font-size: 40px; }
  .sl-bench-body p { font-size: 16px; }
  .sl-two h4 { font-size: 21px; }
  .sl-work li { grid-template-columns: 28px 1fr; }
  .sl-work li span { grid-column: 2; }
  .sl-price { grid-template-columns: repeat(3, 1fr); padding: 24px; row-gap: 18px; }
  .sl-price .h { grid-column: 1 / -1; padding-right: 0; }
  .sl-price .v { padding: 4px 12px; }
  .sl-price .v:nth-of-type(2) { border-left: 0; padding-left: 0; }
  .sl-price .v b { font-size: 22px; }
  .sl-price .u { grid-column: 1 / -1; }
  .sl-aa { padding: 20px; }
  .sl-aa .r { grid-template-columns: 1fr 1fr; gap: 6px 10px; }
  .sl-aa .p { display: none; }
  .sl-aa .r.me { margin: 0 -10px; padding: 10px; }
  .sl-dev { gap: 20px; margin-top: 40px; }
  .sl-code { font-size: 11.5px; padding: 18px; }
  .sl-cmp { gap: 16px; }
  .sl-cmp-nav { flex-direction: row; overflow-x: auto; scrollbar-width: none; gap: 16px; border-top: 0; border-bottom: 1px solid var(--line); }
  .sl-cmp-nav button { flex: none; border-bottom: 0; font-size: 14px; gap: 6px; }
  .sl-cmp-t > div { grid-template-columns: 1.2fr 1fr 1fr 48px; gap: 8px; }
  .sl-cmp-t .v i { display: none; }
  .sl-cmp-t b { font-size: 12.5px; }
  .sl-daum { grid-template-columns: 1fr; }
  .sl-daum > div { padding: 22px; }
  .sl-daum .n { border-left: 0; border-top: 1px solid rgba(255,255,255,.1); }
  .sl-daum .n b { font-size: 34px; }
  .sl-daum h3 { font-size: 21px; }
  .sl-spec { gap: 20px; margin-top: 40px; }
  .sl-spec .r { grid-template-columns: 80px 1fr 1fr; }
  .sl-spec .r > * { padding: 11px 8px; font-size: 12.5px; }
  .sl-spec .r span { font-size: 11.5px; }
}