:root{
  --ink:#0b0e15; --ink2:#0e131d; --panel:#141b27; --panel2:#101725;
  --line:#222c3a; --line2:#2c3a4d;
  --fog:#8b97ab; --fog2:#5f6b7d; --paper:#eef2f8;
  --lodeline:#16d39a; --lodeline-dim:#0e8f6a;
  --amber:#f6b73c; --crit:#ff5d5d; --ctrl:#7c5cff;
  --maxw:1120px;
  --f-display:"Space Grotesk","Noto Sans JP","Noto Sans KR",-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --f-body:"IBM Plex Sans","Noto Sans JP","Noto Sans KR",-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
:root:lang(ko){
  --f-display:"Space Grotesk","Noto Sans KR",-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --f-body:"IBM Plex Sans","Noto Sans KR",-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:
    radial-gradient(1100px 560px at 82% -8%, #16203a 0%, rgba(11,14,21,0) 58%),
    radial-gradient(900px 500px at 8% 4%, #10271f 0%, rgba(11,14,21,0) 55%),
    var(--ink);
  color:var(--paper); -webkit-font-smoothing:antialiased;
  font-family:var(--f-body);
  font-size:16px; line-height:1.6;
}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:28px}
.mono{font-family:var(--f-mono)}

/* ---------- nav ---------- */
nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(10px);
    background:linear-gradient(var(--ink),rgba(11,14,21,.72));
    border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:14px;height:62px;white-space:nowrap}
.brand{display:flex;align-items:center;gap:10px;min-height:44px;font-family:var(--f-display);
       font-weight:700;font-size:19px;letter-spacing:-.01em}
.mark{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
      background:radial-gradient(120% 120% at 30% 20%,#1f2c46,#0c1320);
      border:1px solid var(--line2);color:var(--lodeline);font-size:18px;
      box-shadow:0 0 0 1px rgba(22,211,154,.08),0 6px 18px rgba(0,0,0,.5)}
.nav .sp{flex:1}
.nav a.lnk{color:var(--fog);font-size:14.5px;font-weight:500;display:inline-flex;align-items:center;min-height:44px}
.nav a.lnk:hover{color:var(--paper)}
.langsw{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--line2);flex:none;
        border-radius:8px;padding:2px;font-size:12.5px;font-weight:600;white-space:nowrap}
.langsw a{color:var(--fog2);padding:4px 9px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;min-height:36px}
.langsw .code{display:none}
.langsw a:hover{color:var(--paper)}
.langsw a.on{color:var(--ink);background:var(--lodeline)}
.ghbtn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line2);flex:none;
       padding:8px 14px;border-radius:9px;font-weight:600;font-size:14px;color:var(--paper);
       background:#121a28;min-height:44px;white-space:nowrap}
.ghbtn svg{width:18px;height:18px;fill:currentColor;flex:none}
.ghbtn:hover{border-color:var(--lodeline);color:var(--lodeline)}
.ghbtn .star{color:var(--amber)}

/* ---------- hero ---------- */
.hero{display:grid;overflow-x:clip;grid-template-columns:1.02fr .98fr;gap:54px;align-items:center;
      padding-block:74px 40px}
.hero>*{min-width:0}
.eyebrow{font-family:var(--f-mono);font-size:12.5px;letter-spacing:.14em;
         text-transform:uppercase;color:var(--lodeline);font-weight:600;margin-bottom:20px;
         display:flex;align-items:center;gap:10px}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--lodeline);
              box-shadow:0 0 0 4px rgba(22,211,154,.16)}
h1{font-family:var(--f-display);font-weight:700;letter-spacing:-.02em;
   font-size:clamp(34px,5vw,58px);line-height:1.04;margin:0 0 20px}
h1 .stamp{position:relative;white-space:nowrap;color:var(--crit)}
h1 .stamp::after{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:2px;
   background:var(--crit);opacity:.0;transform:scaleX(0);transform-origin:left;
   animation:strike 1.1s .9s ease forwards}
@keyframes strike{to{opacity:.55;transform:scaleX(1)}}
.lede{color:var(--fog);font-size:18px;max-width:32em;margin:0 0 28px;overflow-wrap:break-word}
.lede b{color:var(--paper);font-weight:600}

.cmd{display:flex;align-items:center;gap:12px;background:var(--panel2);
     border:1px solid var(--line2);border-radius:11px;padding:8px 8px 8px 14px;max-width:520px;min-width:0}
.cmd .pr{flex:none}
.cmd .pr{color:var(--lodeline)}
.cmd code{font-family:var(--f-mono);font-size:13.5px;color:#cdd8e8;white-space:nowrap;
          overflow-x:auto;flex:1;min-width:0;padding-block:8px;scrollbar-width:thin}
.copy{border:1px solid var(--line2);background:#0d1420;color:var(--fog);border-radius:7px;flex:none;
      padding:6px 12px;min-width:64px;min-height:44px;font-size:12.5px;font-weight:600;cursor:pointer;font-family:var(--f-body)}
.copy:hover{color:var(--lodeline);border-color:var(--lodeline)}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:18px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:12px 20px;border-radius:11px;
     font-weight:600;font-size:15px;cursor:pointer}
.btn-pri{background:var(--lodeline);color:#04120c;border:1px solid var(--lodeline)}
.btn-pri:hover{filter:brightness(1.07)}
.btn-sec{background:#121a28;color:var(--paper);border:1px solid var(--line2)}
.btn-sec:hover{border-color:var(--lodeline);color:var(--lodeline)}
.meta{margin-top:20px;color:var(--fog2);font-size:13px;font-family:var(--f-mono);overflow-wrap:anywhere}
.meta b{color:var(--fog)}
.trust{margin:12px 0 0;max-width:520px;color:var(--fog2);font-size:13.5px;line-height:1.55}
.trust a{color:var(--fog);text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}
.trust a:hover{color:var(--lodeline)}
.news{display:inline-flex;align-items:center;gap:10px;margin-top:18px;min-height:44px;padding:6px 12px 6px 6px;
      border:1px solid var(--line2);border-radius:9px;color:var(--fog);font-size:13.5px;max-width:100%}
.news:hover{border-color:var(--lodeline);color:var(--paper)}
.news .tag{flex:none;font-family:var(--f-mono);font-size:11.5px;font-weight:600;color:#04120c;background:var(--lodeline);border-radius:6px;padding:2px 7px}

/* ---------- hero terminal + seal ---------- */
.stage{position:relative}
.term{background:linear-gradient(var(--panel),var(--panel2));border:1px solid var(--line2);
      border-radius:15px;box-shadow:0 30px 70px rgba(0,0,0,.55);overflow:hidden}
.term .bar{display:flex;align-items:center;gap:8px;padding:12px 15px;border-bottom:1px solid var(--line)}
.term .bar i{width:11px;height:11px;border-radius:50%;background:#2c3a4d;display:inline-block}
.term .bar i:nth-child(1){background:#ff5f57}.term .bar i:nth-child(2){background:#febc2e}
.term .bar i:nth-child(3){background:#28c840}
.term .bar .t{margin-left:8px;color:var(--fog2);font-family:var(--f-mono);font-size:12px}
.term .body{padding:18px 18px 20px;font-family:var(--f-mono);font-size:13px;line-height:1.85}
.term .row{display:flex;gap:10px;color:#c6d2e2}
.term .row .p{color:var(--lodeline)}
.term .cmt{color:var(--fog2)}
.overall{margin-top:6px;color:var(--paper);font-weight:600;font-size:12.5px}
.overall b{color:var(--crit)}
.overall .dim{color:var(--fog2);font-weight:400}
.tbl{margin-top:10px;border-top:1px dashed var(--line2);padding-top:12px}
.tr{display:grid;grid-template-columns:1fr auto auto auto;gap:11px;align-items:center;padding:3px 0}
.tr .nm{color:#dbe5f2}
.tr .scope{color:var(--fog2);font-size:11px}
.tr .sc{text-align:right;color:var(--fog);min-width:26px}
.tr.th{color:var(--fog2);font-size:10.5px;letter-spacing:.06em;padding-bottom:2px}
.tr .tf{grid-column:1/-1;color:var(--fog2);font-size:11.5px;line-height:1.5;margin:-2px 0 4px;overflow-wrap:anywhere}
.term .cmdtxt{color:#dbe5f2}
.term .nc{margin-top:8px;font-size:11.5px;line-height:1.6}
.howto{margin-top:10px;color:var(--paper);font-weight:600;font-size:12.5px}
.hint{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;color:var(--fog);font-size:11.5px;line-height:1.6;padding:2px 0}
.hint .k{color:var(--lodeline)}
.band{font-weight:600;font-size:10.5px;letter-spacing:.05em;padding:2px 8px;border-radius:6px;text-align:center;min-width:66px}
.b-crit{color:var(--crit);background:rgba(255,93,93,.12);border:1px solid rgba(255,93,93,.32)}
.b-high{color:var(--amber);background:rgba(246,183,60,.12);border:1px solid rgba(246,183,60,.3)}
.b-med{color:#e9d58a;background:rgba(233,213,138,.08);border:1px solid rgba(233,213,138,.26)}
.b-low{color:var(--lodeline);background:rgba(22,211,154,.1);border:1px solid rgba(22,211,154,.28)}

.seal{position:absolute;right:-26px;top:-30px;width:120px;height:120px;border-radius:50%;
      display:grid;place-items:center;text-align:center;
      background:radial-gradient(120% 120% at 30% 22%,#211019,#150a10);
      border:1.5px solid rgba(255,93,93,.5);
      box-shadow:0 0 0 6px rgba(255,93,93,.06),0 18px 40px rgba(0,0,0,.6);
      transform:rotate(-11deg) scale(1);animation:stampin 1s .55s cubic-bezier(.2,1.3,.3,1) backwards}
@keyframes stampin{from{opacity:0;transform:rotate(8deg) scale(1.9)}}
.seal .ring{position:absolute;inset:8px;border-radius:50%;border:1.5px dashed rgba(255,93,93,.45);
            animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.seal .g{color:var(--crit);font-size:26px;line-height:1;font-family:var(--f-display)}
.seal .lbl{color:var(--crit);font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;
           font-weight:600;margin-top:3px}
.seal .num{color:#ffd9d9;font-family:var(--f-display);font-weight:700;font-size:15px}

/* ---------- section frame ---------- */
section{padding-block:56px}
.sec-head{display:flex;align-items:baseline;gap:16px;margin-bottom:30px}
.sec-head>div{min-width:0}
.sec-tag{font-family:var(--f-mono);font-size:12px;letter-spacing:.16em;color:var(--fog2);
         text-transform:uppercase;border:1px solid var(--line);border-radius:6px;padding:4px 9px;white-space:nowrap}
h2{font-family:var(--f-display);font-weight:600;font-size:clamp(24px,3vw,32px);
   letter-spacing:-.01em;margin:0}
.sub2{color:var(--fog);max-width:46em;margin:8px 0 0}

/* reads grid */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:var(--panel2);border:1px solid var(--line);border-radius:13px;padding:18px}
.card .h{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--paper);margin:0 0 7px;font-size:16px;font-family:var(--f-body);line-height:1.4}
.card.wide{grid-column:1/-1}
.card .f{overflow-wrap:anywhere}
.card .h .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:none;
             background:#0e1726;border:1px solid var(--line2);color:var(--lodeline);font-family:var(--f-mono);font-size:14px}
.card p{color:var(--fog);font-size:14px;margin:0}
.card .f{margin-top:11px;font-family:var(--f-mono);font-size:11.5px;color:var(--fog2)}
.card .f span{color:var(--amber)}

/* measure / philosophy band */
.creed{border:1px solid var(--line2);border-radius:16px;padding:40px 38px;
       background:linear-gradient(100deg,#0f1a18,#0e1320);display:grid;
       grid-template-columns:auto 1fr;gap:30px;align-items:center}
.creed .big{font-family:var(--f-display);font-weight:700;font-size:clamp(26px,3.4vw,40px);
            letter-spacing:-.02em;line-height:1.05;white-space:nowrap}
.creed .big .m{color:var(--lodeline)} .creed .big .b{color:var(--fog2)}
.creed p{color:var(--fog);margin:0;max-width:34em}
.creed .edr{font-family:var(--f-mono);font-size:12.5px;color:var(--fog2);margin-top:10px}
.creed .edr b{color:var(--paper);font-weight:600}
.optin{margin-top:16px;border:1px dashed var(--line2);border-radius:16px;padding:26px 30px}
.optin h3{font-family:var(--f-display);font-weight:600;font-size:20px;margin:0 0 8px}
.optin p{color:var(--fog);margin:0;max-width:52em;overflow-wrap:break-word}
.optin .mono{color:var(--paper);font-size:.9em;white-space:nowrap}
.sub-h{font-family:var(--f-display);font-weight:600;font-size:20px;margin:44px 0 0}

/* lodeline-mcp */
.ask{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:start;border-top:1px solid var(--line);padding-top:40px}
.ask h2{margin-top:14px}
.tools{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tools li{background:var(--panel2);border:1px solid var(--line);border-radius:11px;padding:12px 14px;color:var(--fog);font-size:14px;display:grid;gap:2px}
.tools li .mono{color:var(--lodeline);font-size:13.5px;overflow-wrap:anywhere}
.tools li.pc{background:transparent;border-style:dashed}
.tools li.pc .mono{color:var(--paper)}

/* diagrams */
.diagram{margin-top:26px;width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:13px;background:var(--ink2)}
.diagram svg{display:block;width:100%;height:auto}
.diagram-note{display:none;margin:8px 0 0;color:var(--fog2);font-size:12.5px;font-family:var(--f-mono)}
@media (max-width:760px){.diagram-note{display:block}}

/* Q&A */
.qa{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.q{border-top:1px solid var(--line2);padding-top:16px}
.q h3{font-family:var(--f-display);font-weight:600;font-size:18px;margin:0 0 6px}
.q p{color:var(--fog);font-size:15px;margin:0;overflow-wrap:break-word}

/* wedge / fleet */
.wedge{display:grid;grid-template-columns:1.1fr .9fr;gap:46px;align-items:center}
.wedge h2 .m{color:var(--lodeline)}
.seals{display:flex;gap:12px;margin:22px 0 4px;flex-wrap:wrap}
.mini{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;text-align:center;
      background:radial-gradient(120% 120% at 30% 22%,#13202c,#0c141d);position:relative}
.mini .r{position:absolute;inset:5px;border-radius:50%;border:1px dashed var(--line2)}
.mini .v{font-family:var(--f-display);font-weight:700;font-size:14px}
.mini .hn{font-family:var(--f-mono);font-size:8px;color:var(--fog2);margin-top:1px;letter-spacing:.04em}
.mini.crit{border:1px solid rgba(255,93,93,.4)}.mini.crit .v{color:var(--crit)}
.mini.high{border:1px solid rgba(246,183,60,.4)}.mini.high .v{color:var(--amber)}
.mini.low{border:1px solid rgba(22,211,154,.32)}.mini.low .v{color:var(--lodeline)}
.vid{border:1px solid var(--line2);border-radius:15px;overflow:hidden;background:#0a0f17;
     box-shadow:0 24px 60px rgba(0,0,0,.5)}
.vid{margin:0}
.vid video{display:block;width:100%;height:auto;background:#0a0f17}
.vid figcaption{padding:10px 14px;color:var(--fog2);font-size:12.5px;border-top:1px solid var(--line)}
.links{display:flex;flex-wrap:wrap;gap:0 22px}
.wlink{display:inline-flex;align-items:center;gap:8px;margin-top:18px;color:var(--lodeline);min-height:44px;
       font-weight:600;font-size:14.5px;border-bottom:1px solid transparent}
.wlink:hover{border-color:var(--lodeline)}

/* final CTA */
.final{text-align:center;padding-block:70px 30px}
.final h2{font-size:clamp(28px,4vw,42px)}
.final .cta{justify-content:center;margin-top:26px}

/* footer */
footer{border-top:1px solid var(--line);padding-block:34px 60px;color:var(--fog2);font-size:13.5px}
.foot{display:flex;align-items:center;gap:6px 22px;flex-wrap:wrap}
.foot a{display:inline-flex;align-items:center;min-height:44px}
.foot .sp{flex:1}
.foot a{color:var(--fog)} .foot a:hover{color:var(--lodeline)}
.ph{color:var(--ctrl);font-family:var(--f-mono);font-size:11px}

:lang(ko) p,:lang(ko) h1,:lang(ko) h2,:lang(ko) h3,:lang(ko) li{word-break:keep-all;overflow-wrap:anywhere}
:lang(ja) p,:lang(ja) h1,:lang(ja) h2,:lang(ja) h3,:lang(ja) li{word-break:auto-phrase;line-break:strict;overflow-wrap:anywhere}
:lang(ja) h1{word-break:keep-all}
:lang(ja) .eyebrow,:lang(ko) .eyebrow,:lang(ja) .sec-tag,:lang(ko) .sec-tag{letter-spacing:.04em}

@media (max-width:880px){
  .hero{grid-template-columns:1fr;gap:38px;padding-block:48px 20px}
  .wedge>*,.creed>*{min-width:0}
  .creed{grid-template-columns:1fr;gap:18px}
  .creed .big{white-space:normal}
  .wedge{grid-template-columns:1fr;gap:30px}
  .grid{grid-template-columns:1fr}
  .ask,.qa{grid-template-columns:1fr}
  .optin{padding:22px 20px}
  .seal{right:10px;top:-18px;width:98px;height:98px}
  .nav a.lnk{display:none}
}
@media (max-width:640px){
  .wrap{padding-inline:20px}
  .sec-head{flex-direction:column;gap:10px}
  .creed{padding:28px 22px}
  .lede{font-size:16.5px}
  section{padding-block:44px}
}
@media (max-width:520px){
  .wrap{padding-inline:16px}
  .nav{gap:8px}
  .brand{font-size:17px}
  .langsw .full{display:none}
  .langsw .code{display:inline}
  .langsw a{padding:4px 8px;min-width:40px;min-height:44px}
  .ghbtn{padding:0;width:44px;justify-content:center}
  .ghbtn .ghtxt{display:none}
  .seal{right:6px;top:-14px;width:84px;height:84px}
  .seal .g{font-size:20px}
  .term .body{padding:14px 12px 16px;font-size:12px}
  .cta .btn{flex:1 1 100%;justify-content:center}
  .hint{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important}
  h1 .stamp::after{opacity:.55;transform:scaleX(1)}
}