/* assets/legal.css — Trade Rank 法的ページ共通テンプレ (利用規約 / プライバシー / 特商法 / リスク・免責) */
:root{
  --navy:#0B1730; --line:#1E2A44;
  --white:#EAF2FF; --wsub:#A8B3CC; --wmute:#6A7796;
  --cyan:#00E0FF;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--white);font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP","Inter",system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.95}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* ===== 共通ヘッダー（TOP / about と同一・ティッカーなし） ===== */
.header{position:sticky;top:0;z-index:50;background:rgba(10,15,31,0.82);backdrop-filter:saturate(140%) blur(10px);-webkit-backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line)}
.header-inner{max-width:520px;margin:0 auto;padding:4px 12px 4px 10px;display:flex;align-items:center;justify-content:space-between;height:60px}
.logo{display:flex;align-items:center;height:100%;will-change:filter;animation:logoNeon 2.4s ease-in-out infinite alternate}
.logo img{height:38px;width:auto;object-fit:contain;filter:drop-shadow(0 0 2px rgba(255,255,255,0.95)) drop-shadow(0 0 6px rgba(0,224,255,0.9)) drop-shadow(0 0 14px rgba(0,224,255,0.7)) drop-shadow(0 0 24px rgba(43,108,255,0.5))}
@keyframes logoNeon{0%{filter:brightness(1) saturate(1)}100%{filter:brightness(1.15) saturate(1.2)}}
#hdrAuthSlot{display:flex;align-items:center;justify-content:flex-end;height:36px}
.hdr-profile{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:rgba(0,224,255,.12);border:1px solid rgba(0,224,255,.45);color:#00E0FF;font-size:13px;font-weight:800;text-decoration:none;overflow:hidden;text-transform:uppercase;transition:.15s}
.hdr-profile:hover{background:rgba(0,224,255,.2)}
.hdr-profile img{width:36px;height:36px;border-radius:50%;object-fit:cover;display:block}
.hdr-profile .hdr-initial{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:800;font-size:14px;color:#EAF2FF}
.hdr-profile.no-icon{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);color:#6A7796}
.hdr-login{display:flex;align-items:center;justify-content:center;height:32px;padding:0 14px;border-radius:8px;background:#00E0FF;color:#002a33;font-size:12px;font-weight:700;text-decoration:none;line-height:1;transition:.15s}
.hdr-login:hover{filter:brightness(1.08)}
.subnav{position:sticky;top:60px;z-index:49;background:rgba(8,12,26,0.92);backdrop-filter:saturate(140%) blur(10px);-webkit-backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line)}
.nav-tabs{max-width:520px;margin:0 auto;display:flex;align-items:stretch;padding:0 8px;position:relative}
/* Phase 4D-uiunify: 3タブ(TOP/ランキング/Trade Rankとは)をflex:1で広く均等展開、ハンバーガーは自然幅で右端へ */
.nav-tabs > a{flex:1 1 0}
.nav-tabs a, .nav-tabs .menu-btn-inline{position:relative;padding:11px 6px;font-family:"Noto Sans JP","Inter",system-ui,-apple-system,sans-serif;font-size:12.5px;font-weight:700;color:#A8B3CC;white-space:nowrap;letter-spacing:.01em;transition:color .15s ease;display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;text-decoration:none}
.nav-tabs a:hover, .nav-tabs .menu-btn-inline:hover{color:#EAF2FF}
.nav-tabs .menu-btn-inline{padding:11px 14px;flex:0 0 auto}
.nav-tabs .menu-btn-inline svg{width:18px;height:18px;display:block}
.nav-menu-dd{position:absolute;top:100%;right:8px;z-index:60;margin-top:4px;min-width:180px;background:rgba(8,12,26,0.96);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.55);padding:6px;display:flex;flex-direction:column;backdrop-filter:saturate(160%) blur(10px);-webkit-backdrop-filter:saturate(160%) blur(10px)}
.nav-menu-dd[hidden]{display:none}
.nav-menu-dd > *{display:block;padding:10px 12px;font-size:13px;font-weight:600;color:#EAF2FF;text-decoration:none;background:transparent;border:0;text-align:center;cursor:pointer;border-radius:6px;transition:.15s;font-family:inherit;width:100%}
.nav-menu-dd > [data-menu-role="loggedin"]{color:#fff}
.nav-menu-dd > *:hover{background:rgba(0,224,255,.10);color:#00E0FF}
.nav-menu-dd .danger:hover{background:rgba(255,91,123,.12);color:#FF8FA3}
.nav-menu-dd > *[hidden]{display:none}

/* ===== 法的ページ本文 ===== */
.wrap{max-width:760px;margin:0 auto;padding:0 20px}
.legal-hero{text-align:center;padding:42px 0 6px;background:radial-gradient(700px 320px at 50% -10%,rgba(63,123,255,.18),transparent 60%)}
.legal-hero .eyebrow{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#00E0FF;margin:0 0 10px}
.legal-hero h1{font-size:28px;line-height:1.4;font-weight:900;margin:0}
.legal-hero .updated{margin-top:12px;font-size:12px;color:#6A7796}
.legal-body{padding:18px 0 10px}
.legal-body .lead{font-size:15px;color:#A8B3CC;margin:0 0 8px}
.legal-body section{padding:18px 0;border-top:1px solid rgba(255,255,255,.08)}
.legal-body section:first-of-type{border-top:none}
.legal-body h2{font-size:18px;font-weight:800;color:#fff;margin:0 0 12px}
.legal-body h3{font-size:15px;font-weight:800;color:#EAF2FF;margin:18px 0 8px}
.legal-body p{font-size:14.5px;color:#A8B3CC;margin:0 0 12px}
.legal-body p:last-child{margin-bottom:0}
.legal-body a, .legal-table a{color:#00E0FF;text-decoration:underline;text-underline-offset:2px}
.legal-body a:hover, .legal-table a:hover{filter:brightness(1.12)}
.legal-body ul,.legal-body ol{margin:0 0 12px;padding-left:1.3em}
.legal-body li{font-size:14.5px;color:#A8B3CC;margin:6px 0}
.legal-table{width:100%;border-collapse:collapse;margin:4px 0 8px}
.legal-table th,.legal-table td{text-align:left;vertical-align:top;font-size:14px;padding:12px 10px;border-bottom:1px solid rgba(255,255,255,.1)}
.legal-table th{width:36%;color:#EAF2FF;font-weight:700}
.legal-table td{color:#A8B3CC}
.note{background:linear-gradient(180deg,#10203c,#0c1730);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:16px 18px;margin:6px 0 0;font-size:13.5px;color:#A8B3CC}

/* ===== フッター ===== */
.legal-foot{border-top:1px solid rgba(255,255,255,.07);margin-top:18px;padding:26px 20px 46px;text-align:center}
.legal-foot .flinks{display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:center;margin-bottom:14px}
.legal-foot .flinks a{font-size:12.5px;color:#A8B3CC}
.legal-foot .flinks a:hover{color:#EAF2FF}
.legal-foot .flinks a.cur{color:#00E0FF;font-weight:700}
.legal-foot .copy{font-size:11.5px;color:#6A7796}
@media (min-width:640px){.legal-hero h1{font-size:32px}}