openfree commited on
Commit
937d9ca
·
verified ·
1 Parent(s): 739edfb

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +7 -7
index.html CHANGED
@@ -101,7 +101,7 @@ footer{border-top:1px solid var(--border);padding:20px 24px;text-align:center;co
101
  </div></div>
102
  <div style="display:grid;grid-template-columns:1fr 1fr;gap:6px">
103
  <div style="padding:10px;border-radius:8px;background:var(--card2);text-align:center;border:1px solid var(--border)"><div style="font-size:20px;font-weight:900;color:var(--mint)">4</div><div style="font-size:9px;color:#64748b">방어 계층</div></div>
104
- <div style="padding:10px;border-radius:8px;background:var(--card2);text-align:center;border:1px solid var(--border)"><div style="font-size:20px;font-weight:900;color:var(--mint)">30</div><div style="font-size:9px;color:#64748b">공격 대응</div></div>
105
  </div>
106
  <div style="margin-top:12px;text-align:center"><span style="padding:4px 12px;border-radius:8px;background:rgba(127,255,219,.06);color:var(--mint);font-size:10px;font-weight:700">✅ 운용 중</span></div>
107
  </div>
@@ -232,7 +232,7 @@ footer{border-top:1px solid var(--border);padding:20px 24px;text-align:center;co
232
  </div>
233
  </div>
234
  <div style="display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px">
235
- <div style="padding:12px;border-radius:10px;background:var(--card2);text-align:center;border:1px solid var(--border)"><div style="font-size:24px;font-weight:900;color:var(--mint)">30</div><div style="font-size:10px;color:#94a3b8">공격 시나리오 대응</div></div>
236
  <div style="padding:12px;border-radius:10px;background:var(--card2);text-align:center;border:1px solid var(--border)"><div style="font-size:24px;font-weight:900;color:var(--mint)">0px</div><div style="font-size:10px;color:#94a3b8">가시성 제로</div></div>
237
  </div>
238
  <div style="padding:12px 14px;border-radius:10px;background:rgba(192,132,252,.04);border:1px solid rgba(192,132,252,.1)">
@@ -356,7 +356,7 @@ footer{border-top:1px solid var(--border);padding:20px 24px;text-align:center;co
356
  <!-- ═══════════════ THREATS ═══════════════ -->
357
  <section id="atk">
358
  <div style="padding:40px 0">
359
- <div style="text-align:center;margin-bottom:40px" class="fi"><div style="font-size:13px;color:var(--red);font-weight:700;letter-spacing:3px;margin-bottom:8px">STEALTHMARK THREATMATRIX™</div><h2 style="font-size:32px;font-weight:900;letter-spacing:-1px">30종 위협 <span style="color:var(--mint)">대응 현황</span></h2><p style="color:#94a3b8;font-size:14px;margin-top:8px">6개 위협 그룹 × 30종 시나리오 — 계층별 생존 현황</p></div>
360
  <div class="ag" id="agg"></div>
361
  <div class="cd fi" style="margin-top:32px">
362
  <h3 style="font-size:16px;font-weight:800;text-align:center;margin-bottom:20px;color:#fff">StealthMark <span style="color:var(--mint)">CrossGuard™</span> 이중 방패</h3>
@@ -403,7 +403,7 @@ footer{border-top:1px solid var(--border);padding:20px 24px;text-align:center;co
403
 
404
  <script>
405
  const D=[
406
- {r:1,b:"🥇",n:"StealthMark",c:"🇰🇷",t:"상용",d:"4중 특허 방어 + DualAxis™ + Radar™",s:[100,100,100,95,100,95],T:98,cl:"var(--mint)",h:["ThreatMatrix™ 30종 대응","CrossGuard™ 이중 방패","DualAxis™ 흔적 판정"]},
407
  {r:2,b:"🥈",n:"임베딩 기반 학술",c:"🇰🇷",t:"학술",d:"의미 벡터 유사도 기반",s:[70,50,60,30,40,45],T:49,cl:"#94a3b8",h:["패러프레이징 부분 대응","실시간 어려움","GPU 필수"]},
408
  {r:3,b:"🥉",n:"SynthID-Text",c:"🇺🇸",t:"상용",d:"Google — LLM 전용",s:[65,25,10,80,0,30],T:35,cl:"#94a3b8",h:["LLM 출력만 가능","한국어 미지원"]},
409
  {r:4,b:"4",n:"통계 기반 WM",c:"🇺🇸",t:"학술",d:"토큰 확률 분포 조작",s:[55,25,20,70,0,25],T:33,cl:"#64748b",h:["패러프레이징 취약","모델 접근 필요"]},
@@ -434,7 +434,7 @@ const COMP=[
434
  {f:"🖼️ 이미지 워터마크",sm:"✅ DCT 주파수 영역",a:"❌",b:"⚠️ 픽셀만"},
435
  {f:"🎬 영상 보호",sm:"✅ DTW + DCT 전파",a:"❌",b:"❌"},
436
  {f:"한국어 최적화",sm:"✅ 형태소 분석 기반",a:"❌",b:"❌"},
437
- {f:"위협 대응 범위",sm:"✅ 30종 100%",a:"⚠️ 5~10종",b:"⚠️ 취약"},
438
  {f:"이중축 판정",sm:"✅ DualAxis™",a:"❌",b:"❌"},
439
  {f:"법적 증거 패키지",sm:"✅ Seal™ 자동",a:"❌",b:"⚠️ 수동"},
440
  {f:"멀티모달 통합",sm:"✅ 텍스트+이미지+영상",a:"❌ 텍스트만",b:"❌ 이미지만",h:true}
@@ -444,7 +444,7 @@ if(ctb)ctb.innerHTML=COMP.map(c=>{const hl=c.h?'background:rgba(255,170,102,.03)
444
 
445
  document.querySelectorAll('.tb').forEach(b=>{b.onclick=()=>{document.querySelectorAll('.tb').forEach(x=>x.classList.remove('a'));b.classList.add('a');document.querySelectorAll('section').forEach(s=>s.classList.remove('a'));document.getElementById(b.dataset.t).classList.add('a')}});
446
 
447
- const MET=[{v:30,s:"종",l:"텍스트 위협",u:"ThreatMatrix™ 100%",cl:"var(--mint)"},{v:4,s:"중",l:"텍스트 계층",u:"CrossGuard™ 이중방패",cl:"var(--purple)"},{v:5,s:"모드",l:"이미지 분석",u:"Hash+SSIM+색상+특징점",cl:"var(--pink)"},{v:7,s:"모드",l:"Radar™",u:"삽입 전 즉시 보호",cl:"var(--orange)"},{v:3,s:"축",l:"멀티모달",u:"텍스트+이미지+영상",cl:"var(--blue)"},{v:0,s:"px",l:"가시성",u:"완전 투명",cl:"var(--red)",fix:"0"}];
448
  document.getElementById('metrics').innerHTML=MET.map((m,i)=>`<div class="mc fi d${i+1}" style="border:1px solid color-mix(in srgb,${m.cl} 15%,transparent)"><div style="font-size:36px;font-weight:900;color:${m.cl}">${m.fix||'<span class="ctr" data-e="'+m.v+'">0</span>'}${m.s}</div><div style="font-size:13px;font-weight:700;color:#fff;margin-bottom:2px">${m.l}</div><div style="font-size:10px;color:#64748b">${m.u}</div></div>`).join('');
449
  const obs=new IntersectionObserver(es=>{es.forEach(e=>{if(e.isIntersecting)e.target.querySelectorAll('.ctr').forEach(el=>{if(el.dataset.done)return;el.dataset.done='1';const end=+el.dataset.e,st=performance.now();(function f(n){const p=Math.min((n-st)/1500,1);el.textContent=Math.round((1-Math.pow(1-p,3))*end);if(p<1)requestAnimationFrame(f)})(st)})})},{threshold:.3});
450
  document.querySelectorAll('.mc').forEach(e=>obs.observe(e));
@@ -463,4 +463,4 @@ document.getElementById('agg').innerHTML=AG.map((g,i)=>`<div class="ac fi" style
463
  document.getElementById('psteps').innerHTML='<div class="pl"></div>'+PS.map((s,i)=>`<div class="ps fi" style="animation-delay:${i*.1}s"><div class="pn" style="background:color-mix(in srgb,${s.cl} 8%,transparent);border:2px solid color-mix(in srgb,${s.cl} 30%,transparent)">${s.i}</div><div class="cd" style="flex:1;padding:14px 20px;border-color:color-mix(in srgb,${s.cl} 15%,transparent)"><div style="display:flex;align-items:center;gap:8px;margin-bottom:6px"><span style="color:${s.cl};font-weight:800;font-size:14px">${s.t}</span><span style="font-size:10px;padding:2px 8px;border-radius:6px;background:color-mix(in srgb,${s.cl} 8%,transparent);color:${s.cl};font-weight:700">Step ${i+1}</span></div><div style="color:#e2e8f0;font-size:13px;margin-bottom:4px">${s.d}</div><div style="color:#64748b;font-size:11px">${s.dt}</div></div></div>`).join('');
464
  </script>
465
  </body>
466
- </html>
 
101
  </div></div>
102
  <div style="display:grid;grid-template-columns:1fr 1fr;gap:6px">
103
  <div style="padding:10px;border-radius:8px;background:var(--card2);text-align:center;border:1px solid var(--border)"><div style="font-size:20px;font-weight:900;color:var(--mint)">4</div><div style="font-size:9px;color:#64748b">방어 계층</div></div>
104
+ <div style="padding:10px;border-radius:8px;background:var(--card2);text-align:center;border:1px solid var(--border)"><div style="font-size:20px;font-weight:900;color:var(--mint)">34</div><div style="font-size:9px;color:#64748b">공격 대응</div></div>
105
  </div>
106
  <div style="margin-top:12px;text-align:center"><span style="padding:4px 12px;border-radius:8px;background:rgba(127,255,219,.06);color:var(--mint);font-size:10px;font-weight:700">✅ 운용 중</span></div>
107
  </div>
 
232
  </div>
233
  </div>
234
  <div style="display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px">
235
+ <div style="padding:12px;border-radius:10px;background:var(--card2);text-align:center;border:1px solid var(--border)"><div style="font-size:24px;font-weight:900;color:var(--mint)">34</div><div style="font-size:10px;color:#94a3b8">공격 시나리오 대응</div></div>
236
  <div style="padding:12px;border-radius:10px;background:var(--card2);text-align:center;border:1px solid var(--border)"><div style="font-size:24px;font-weight:900;color:var(--mint)">0px</div><div style="font-size:10px;color:#94a3b8">가시성 제로</div></div>
237
  </div>
238
  <div style="padding:12px 14px;border-radius:10px;background:rgba(192,132,252,.04);border:1px solid rgba(192,132,252,.1)">
 
356
  <!-- ═══════════════ THREATS ═══════════════ -->
357
  <section id="atk">
358
  <div style="padding:40px 0">
359
+ <div style="text-align:center;margin-bottom:40px" class="fi"><div style="font-size:13px;color:var(--red);font-weight:700;letter-spacing:3px;margin-bottom:8px">STEALTHMARK THREATMATRIX™</div><h2 style="font-size:32px;font-weight:900;letter-spacing:-1px">34종 위협 <span style="color:var(--mint)">대응 현황</span></h2><p style="color:#94a3b8;font-size:14px;margin-top:8px">7개 위협 그룹 × 34종 시나리오 — 계층별 생존 현황</p></div>
360
  <div class="ag" id="agg"></div>
361
  <div class="cd fi" style="margin-top:32px">
362
  <h3 style="font-size:16px;font-weight:800;text-align:center;margin-bottom:20px;color:#fff">StealthMark <span style="color:var(--mint)">CrossGuard™</span> 이중 방패</h3>
 
403
 
404
  <script>
405
  const D=[
406
+ {r:1,b:"🥇",n:"StealthMark",c:"🇰🇷",t:"상용",d:"4중 특허 방어 + DualAxis™ + Radar™",s:[100,100,100,95,100,95],T:98,cl:"var(--mint)",h:["ThreatMatrix™ 34종 대응","CrossGuard™ 이중 방패","DualAxis™ 흔적 판정"]},
407
  {r:2,b:"🥈",n:"임베딩 기반 학술",c:"🇰🇷",t:"학술",d:"의미 벡터 유사도 기반",s:[70,50,60,30,40,45],T:49,cl:"#94a3b8",h:["패러프레이징 부분 대응","실시간 어려움","GPU 필수"]},
408
  {r:3,b:"🥉",n:"SynthID-Text",c:"🇺🇸",t:"상용",d:"Google — LLM 전용",s:[65,25,10,80,0,30],T:35,cl:"#94a3b8",h:["LLM 출력만 가능","한국어 미지원"]},
409
  {r:4,b:"4",n:"통계 기반 WM",c:"🇺🇸",t:"학술",d:"토큰 확률 분포 조작",s:[55,25,20,70,0,25],T:33,cl:"#64748b",h:["패러프레이징 취약","모델 접근 필요"]},
 
434
  {f:"🖼️ 이미지 워터마크",sm:"✅ DCT 주파수 영역",a:"❌",b:"⚠️ 픽셀만"},
435
  {f:"🎬 영상 보호",sm:"✅ DTW + DCT 전파",a:"❌",b:"❌"},
436
  {f:"한국어 최적화",sm:"✅ 형태소 분석 기반",a:"❌",b:"❌"},
437
+ {f:"위협 대응 범위",sm:"✅ 34종 100%",a:"⚠️ 5~10종",b:"⚠️ 취약"},
438
  {f:"이중축 판정",sm:"✅ DualAxis™",a:"❌",b:"❌"},
439
  {f:"법적 증거 패키지",sm:"✅ Seal™ 자동",a:"❌",b:"⚠️ 수동"},
440
  {f:"멀티모달 통합",sm:"✅ 텍스트+이미지+영상",a:"❌ 텍스트만",b:"❌ 이미지만",h:true}
 
444
 
445
  document.querySelectorAll('.tb').forEach(b=>{b.onclick=()=>{document.querySelectorAll('.tb').forEach(x=>x.classList.remove('a'));b.classList.add('a');document.querySelectorAll('section').forEach(s=>s.classList.remove('a'));document.getElementById(b.dataset.t).classList.add('a')}});
446
 
447
+ const MET=[{v:34,s:"종",l:"텍스트 위협",u:"ThreatMatrix™ 100%",cl:"var(--mint)"},{v:4,s:"중",l:"텍스트 계층",u:"CrossGuard™ 이중방패",cl:"var(--purple)"},{v:5,s:"모드",l:"이미지 분석",u:"Hash+SSIM+색상+특징점",cl:"var(--pink)"},{v:7,s:"모드",l:"Radar™",u:"삽입 전 즉시 보호",cl:"var(--orange)"},{v:3,s:"축",l:"멀티모달",u:"텍스트+이미지+영상",cl:"var(--blue)"},{v:0,s:"px",l:"가시성",u:"완전 투명",cl:"var(--red)",fix:"0"}];
448
  document.getElementById('metrics').innerHTML=MET.map((m,i)=>`<div class="mc fi d${i+1}" style="border:1px solid color-mix(in srgb,${m.cl} 15%,transparent)"><div style="font-size:36px;font-weight:900;color:${m.cl}">${m.fix||'<span class="ctr" data-e="'+m.v+'">0</span>'}${m.s}</div><div style="font-size:13px;font-weight:700;color:#fff;margin-bottom:2px">${m.l}</div><div style="font-size:10px;color:#64748b">${m.u}</div></div>`).join('');
449
  const obs=new IntersectionObserver(es=>{es.forEach(e=>{if(e.isIntersecting)e.target.querySelectorAll('.ctr').forEach(el=>{if(el.dataset.done)return;el.dataset.done='1';const end=+el.dataset.e,st=performance.now();(function f(n){const p=Math.min((n-st)/1500,1);el.textContent=Math.round((1-Math.pow(1-p,3))*end);if(p<1)requestAnimationFrame(f)})(st)})})},{threshold:.3});
450
  document.querySelectorAll('.mc').forEach(e=>obs.observe(e));
 
463
  document.getElementById('psteps').innerHTML='<div class="pl"></div>'+PS.map((s,i)=>`<div class="ps fi" style="animation-delay:${i*.1}s"><div class="pn" style="background:color-mix(in srgb,${s.cl} 8%,transparent);border:2px solid color-mix(in srgb,${s.cl} 30%,transparent)">${s.i}</div><div class="cd" style="flex:1;padding:14px 20px;border-color:color-mix(in srgb,${s.cl} 15%,transparent)"><div style="display:flex;align-items:center;gap:8px;margin-bottom:6px"><span style="color:${s.cl};font-weight:800;font-size:14px">${s.t}</span><span style="font-size:10px;padding:2px 8px;border-radius:6px;background:color-mix(in srgb,${s.cl} 8%,transparent);color:${s.cl};font-weight:700">Step ${i+1}</span></div><div style="color:#e2e8f0;font-size:13px;margin-bottom:4px">${s.d}</div><div style="color:#64748b;font-size:11px">${s.dt}</div></div></div>`).join('');
464
  </script>
465
  </body>
466
+ </html>