/* 初始隐藏规则在各页面 head 内联，SSI 页面首帧不展示业务内容。 */
html:not([data-access="allowed"]) body > :not(#access-gate) { display:none!important; }
#access-gate[hidden], #access-gate [hidden] { display:none!important; }
#access-gate {
    /* 白底黑字保持独立浅色主题，检测状态采用语义色。 */
    color-scheme:light;
    --shop-bg:#ffffff;
    --shop-surface:#fafafa;
    --shop-text:#202020;
    --shop-muted:#737373;
    --shop-line:#e6e6e6;
    --shop-accent:#404040;
    --shop-success:#15803d;
    --access-error:#b91c1c;
    --access-checking:#1d4ed8;
    --shop-ink:#202020;
    min-height:100vh; min-height:100dvh; display:grid; place-items:center;
    box-sizing:border-box; padding:48px 32px;
    color:var(--shop-text); background:var(--shop-bg);
}
.access-card { width:min(100%,1140px); box-sizing:border-box; padding:0; text-align:left; }
.access-header { display:flex; align-items:center; justify-content:space-between; padding-bottom:26px; border-bottom:1px solid var(--shop-line); }
.access-brand { font-size:23px; font-weight:700; letter-spacing:-.04em; }
.access-brand span { display:block; margin-top:6px; font-size:12px; letter-spacing:.12em; font-weight:400; color:var(--shop-muted); }
.access-header-label { font-size:12px; color:var(--shop-muted); letter-spacing:.12em; }
.access-layout { display:grid; grid-template-columns:1.08fr 1fr; gap:72px; align-items:start; padding:64px 0 32px; }
.access-intro { min-width:0; text-align:center; align-self:center; }
.access-symbol { display:block; width:36px; height:36px; box-sizing:border-box; margin:0 0 28px; border:3px solid var(--shop-line); border-top-color:var(--shop-accent); border-radius:50%; animation:access-spin 1s linear infinite; }
#access-gate:not([data-state="checking"]) .access-symbol { animation:none; border:0; color:var(--shop-accent); font-size:42px; line-height:36px; }
#access-gate:not([data-state="checking"]) .access-symbol::after { content:"↗"; }
#access-gate[data-state="error"] .access-symbol::after { content:"!"; }
#access-gate .access-intro > .access-symbol { margin-left:auto; margin-right:auto; }
#access-gate[data-state="blocked"] .access-symbol { width:56px; height:64px; margin-bottom:28px; background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 80'%3E%3Cg stroke='%23d98740' stroke-width='8' stroke-linecap='round' fill='none' transform='rotate(20 32 40)'%3E%3Cpath d='M20 8v64M44 8v64M20 18h24M20 34h24M20 50h24M20 66h24'/%3E%3C/g%3E%3C/svg%3E"); }
#access-gate[data-state="blocked"] .access-symbol::after { content:none; }
#access-gate[data-state="blocked"] #access-title { font-size:clamp(25px,2.3vw,32px); }
#access-title { font-size:clamp(28px,3.2vw,38px); line-height:1.35; font-weight:650; letter-spacing:-.045em; margin:0 0 18px; }
#access-detail { max-width:440px; color:var(--shop-muted); font-size:15px; line-height:1.9; margin:0 auto; white-space:pre-line; }
.access-panel { margin-top:4px; padding:28px 30px 22px; border:1px solid var(--shop-line); border-radius:12px; background:var(--shop-surface); }
.access-panel-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; font-size:16px; font-weight:600; }
.access-panel-heading span:last-child { font-size:11px; color:var(--shop-muted); font-weight:400; }
.access-check { display:flex; align-items:center; gap:14px; min-height:68px; border-bottom:1px solid var(--shop-line); font-size:14px; }
.access-check strong { margin-left:auto; padding:4px 9px; border-radius:4px; font-size:12px; font-weight:500; color:var(--shop-muted); background:#f0f0f0; }
.access-check-icon { width:20px; height:20px; box-sizing:border-box; border:1px solid var(--shop-line); border-radius:50%; display:grid; place-items:center; line-height:1; flex-shrink:0; }
.access-check[data-state="waiting"] { color:var(--shop-muted); }
.access-check[data-state="checking"] .access-check-icon { border:2px solid #dbeafe; border-top-color:var(--access-checking); animation:access-spin .8s linear infinite; }
.access-check[data-state="checking"] strong { color:var(--access-checking); background:#eff6ff; }
.access-check[data-state="success"] .access-check-icon { border:0; color:var(--shop-success); }
.access-check[data-state="success"] .access-check-icon::after { content:"✓"; }
.access-check[data-state="success"] strong { color:var(--shop-success); background:#ecfdf3; }
.access-check[data-state="blocked"] .access-check-icon, .access-check[data-state="error"] .access-check-icon { border-color:var(--access-error); color:var(--access-error); }
.access-check[data-state="blocked"] .access-check-icon::after, .access-check[data-state="error"] .access-check-icon::after { content:"!"; }
.access-check[data-state="blocked"] strong, .access-check[data-state="error"] strong { color:var(--access-error); background:#fef2f2; }
.access-panel-note { margin:20px 0 0; font-size:12px; line-height:1.8; color:var(--shop-muted); }
.access-guide { display:none; margin-top:32px; }
.access-guide-tip { font-size:12px; line-height:1.9; color:var(--shop-muted); margin:0; }
#access-gate[data-state="blocked"] .access-guide { display:block; }
.access-steps { list-style:none; padding:0; margin:0; }
.access-steps li { display:flex; gap:18px; margin-top:22px; }
.access-steps li > span { color:var(--shop-accent); font-size:12px; line-height:24px; font-variant-numeric:tabular-nums; }
.access-steps strong { color:var(--shop-text); font-size:14px; font-weight:600; }
.access-steps p { margin:5px 0 0; font-size:12px; line-height:1.8; color:var(--shop-muted); }
#access-retry { margin:32px 0 0; padding:15px 28px; min-width:230px; border:0; border-radius:6px; background:var(--shop-ink); color:var(--shop-bg); cursor:pointer; font-size:14px; font-weight:600; }
#access-retry:hover { opacity:.9; }
#access-retry:focus-visible { outline:3px solid var(--shop-accent); outline-offset:4px; }
.access-loading-note { margin:34px 0 0; padding-left:16px; border-left:2px solid var(--shop-accent); color:var(--shop-muted); font-size:13px; line-height:1.8; }
#access-gate:not([data-state="checking"]) .access-loading-note { display:none; }
@keyframes access-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .access-symbol,.access-check[data-state="checking"] .access-check-icon { animation:none; } }
@media (max-width:760px) {
  #access-gate { padding:28px 22px; }
  .access-layout { grid-template-columns:1fr; gap:32px; padding-top:32px; }
  .access-brand { font-size:20px; }
  .access-symbol { margin-bottom:20px; }
  .access-panel { padding:22px; }
  #access-retry { width:100%; }
  .access-check { min-height:60px; }
}
