/* Màn chào ra / vào workspace (mockup F-WsGreeting, duyệt 17/10/2026): Danh sách workspace (shell.php) và «Bắt đầu làm việc» (pick_layout.php).
   Rèm navy như màn chào trang đăng nhập (.gi của layout.php), mép phải lượn: mặt nạ là file cùng nguồn wsgo-edge.svg (CSP chặn data:),
   rèm chỉ tịnh tiến. Trên rèm: logo S-Data (vào workspace thì ghép ô workspace), đường lượn, dòng nhỏ, tên, dòng phụ, các bước.
   Lớp phủ do wsgo.js dựng; hiệu ứng chạy bằng Web Animations (CSP chặn style=""), file này chỉ giữ trạng thái tĩnh. */
.wsgo{position:fixed;inset:0;z-index:90;overflow:hidden;color:#fff;
  --wsgo-c:#e8323c;--wsgo-k:color-mix(in srgb,var(--wsgo-c) 55%,#fff);--wsgo-glow:color-mix(in srgb,var(--wsgo-c) 55%,transparent)}
.wsgo[hidden]{display:none}
.wsgo:focus{outline:none}
/* Tông S-Data (rời workspace, vào Cổng, mở lại trang đang làm dở): vạch đỏ, quầng đỏ nhạt như màn «Hẹn gặp lại». */
.wsgo.wsgo-sd{--wsgo-c:#e8323c;--wsgo-k:#e8323c;--wsgo-glow:rgba(232,50,60,.28)}
.wsgo-cur{position:absolute;top:0;bottom:0;left:0;width:calc(100% + 44px);
  background:radial-gradient(700px 420px at 86% 0%,var(--wsgo-glow),transparent 60%),linear-gradient(150deg,#2b2622 0%,#172a44 100%);
  -webkit-mask:linear-gradient(#000,#000) 0 0/calc(100% - 43px) 100% no-repeat,url(wsgo-edge.svg) 100% 0/44px 100% no-repeat;
  mask:linear-gradient(#000,#000) 0 0/calc(100% - 43px) 100% no-repeat,url(wsgo-edge.svg) 100% 0/44px 100% no-repeat}
.wsgo-cur::before{content:"";position:absolute;top:0;bottom:0;left:0;right:44px;background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1.2px);background-size:22px 22px;
  -webkit-mask-image:radial-gradient(60% 70% at 50% 50%,#000,transparent);mask-image:radial-gradient(60% 70% at 50% 50%,#000,transparent)}
.wsgo-edge{position:absolute;top:0;right:0;width:44px;height:100%;overflow:visible}
.wsgo-edge path{fill:none;stroke:var(--wsgo-k);stroke-width:2.5;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 4px var(--wsgo-k));opacity:.9}
/* Màn hẹp (dưới 760px) và giảm chuyển động: rèm thẳng, chỉ mờ + trượt. */
.wsgo.is-flat .wsgo-cur{width:100%;-webkit-mask:none;mask:none}
.wsgo.is-flat .wsgo-cur::before{right:0}
.wsgo.is-flat .wsgo-edge{display:none}

.wsgo-gc{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.wsgo-in{display:flex;flex-direction:column;align-items:center;gap:14px;width:min(520px,100%);text-align:center}
.wsgo-lock{display:flex;align-items:center;gap:22px}
.wsgo-logo{position:relative;width:300px;max-width:100%}
.wsgo-lock.has-tile .wsgo-logo{width:210px}
.wsgo-win,.wsgo-img{display:block}
.wsgo-win{overflow:hidden}
.wsgo-img img{display:block;width:100%;height:auto}
.wsgo-scan{position:absolute;top:-8%;bottom:-8%;left:0;width:3px;background:var(--wsgo-k);box-shadow:0 0 14px 2px var(--wsgo-glow);opacity:0}
.wsgo-x{width:1px;height:46px;background:rgba(255,255,255,.3)}
.wsgo-lock:not(.has-tile) .wsgo-x,.wsgo-lock:not(.has-tile) .wsgo-tile{display:none}
.wsgo-tile{display:grid;place-items:center;flex:none;width:64px;height:64px;overflow:hidden;border-radius:18px;background:#fff;color:var(--wsgo-c);font-size:27px;font-weight:760;font-stretch:var(--wide,100%);
  box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
.wsgo-tile img{width:70%;height:auto}
/* Logo tràn ô (img.lg như trên thẻ): phủ kín ô, bo theo ô. */
.wsgo-tile img.lg{width:100%;height:100%;border-radius:inherit;object-fit:cover}
/* Ô bay từ thẻ / ô vừa bấm tới chỗ ô trong màn chào (đặt sẵn ở đích, tịnh tiến + thu từ vị trí nguồn). */
.wsgo-fly{position:absolute;transform-origin:0 0;pointer-events:none}
.wsgo-src{visibility:hidden}
.wsgo-wave{display:block;width:min(340px,100%);height:44px;margin:0 0 4px;overflow:visible}
.wsgo-wave path{fill:none;stroke-width:2.5;stroke-linecap:round}
.wsgo-wave .t{stroke:rgba(255,255,255,.14)}
.wsgo-wave .f{stroke:var(--wsgo-k);stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 4px var(--wsgo-glow))}
.wsgo-k:empty,.wsgo-sub:empty{display:none}
.wsgo-k{margin:0;font:600 12px/1 ui-monospace,"Cascadia Mono","SF Mono",Consolas,monospace;letter-spacing:.2em;text-transform:uppercase;color:#f39c12}
.wsgo-name{margin:0;font-size:clamp(28px,calc(5vw / var(--canvas-z,1)),44px);line-height:1.1;font-weight:750;letter-spacing:-.02em;text-wrap:balance}
/* Chữ lớn tách từng chữ cái để hiện lần lượt; mỗi từ giữ một khối không ngắt giữa chừng («S-Data» luôn một hàng). */
.wsgo-name .w{display:inline-block;white-space:nowrap}
.wsgo-name .w span{display:inline-block}
.wsgo-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wsgo-sub{margin:0;max-width:460px;font-size:16px;line-height:1.55;color:rgba(255,255,255,.75)}
.wsgo-sub.is-slow{color:#fff}
.wsgo-steps{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.wsgo-steps[hidden]{display:none}
.wsgo-steps li{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border:1px solid rgba(255,255,255,.14);border-radius:999px;font-size:13px;line-height:1.4;color:rgba(255,255,255,.72);transition:color .3s,border-color .3s}
.wsgo-steps i{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);transition:background .3s,border-color .3s}
.wsgo-steps li.is-done{color:#fff;border-color:rgba(255,255,255,.3)}
.wsgo-steps li.is-done i{background:var(--wsgo-k);border-color:var(--wsgo-k)}
.wsgo-steps li.is-done i::after{content:"";width:6px;height:3px;border:solid #fff;border-width:0 0 1.5px 1.5px;transform:translateY(-1px) rotate(-45deg)}
.wsgo-acts{position:absolute;top:max(16px,env(safe-area-inset-top,0px));right:max(16px,env(safe-area-inset-right,0px));display:flex;gap:8px}
.wsgo-acts button{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:transparent;color:rgba(255,255,255,.85);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.wsgo-acts button[hidden]{display:none}
.wsgo-acts button:hover{color:#fff;border-color:rgba(255,255,255,.5)}
.wsgo-acts button.pri{background:#fff;color:#15233f;border-color:#fff}
.wsgo-acts button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.wsgo-acts kbd{background:rgba(255,255,255,.12);border-color:currentColor;color:inherit;opacity:.7;font-size:10.5px}
.wsgo-out{cursor:pointer}
html.wsgo-on,html.wsgo-on body{overflow:hidden}
/* Về Cổng / đến trang đích của enter({to}): script đầu trang gắn html.wsgo-pre khi có dấu để rèm phủ sẵn trước khi wsgo.js chạy; tự tắt sau 2,5 giây nếu script hỏng. */
html.wsgo-pre::after{content:"";position:fixed;inset:0;z-index:89;pointer-events:none;
  background:radial-gradient(700px 420px at 86% 0%,rgba(232,50,60,.28),transparent 60%),linear-gradient(150deg,#2b2622 0%,#172a44 100%);animation:wsgoPre .2s linear 2.5s forwards}
/* Thẻ vừa bấm lún nhẹ trước khi rèm phủ. */
.wsc.is-going{transform:scale(.97)}
.wsc.is-back,.wsl.is-back{animation:wsBackRing 1.1s ease-out 2}
.wsgo-toast{position:fixed;left:50%;bottom:28px;z-index:91;display:flex;align-items:center;gap:14px;max-width:calc(100% - 32px);padding:10px 10px 10px 16px;border-radius:14px;background:#0f172a;color:#fff;
  font-size:14px;font-weight:600;line-height:1.3;box-shadow:0 18px 40px -16px rgba(15,23,42,.6);transform:translateX(-50%)}
.wsgo-toast i{flex:none;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--wsgo-c,#15803d)}
.wsgo-toast i::after{content:"";width:8px;height:4px;border:solid #fff;border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg)}
.wsgo-toast button{flex:none;min-height:30px;padding:0 12px;border:0;border-radius:9px;background:rgba(255,255,255,.12);color:#fff;font:inherit;font-size:12.5px;cursor:pointer}
.wsgo-toast button:hover{background:rgba(255,255,255,.2)}
@keyframes wsgoPre{to{opacity:0;visibility:hidden}}
@keyframes wsBackRing{from{box-shadow:0 0 0 0 color-mix(in srgb,var(--tone,#e8323c) 55%,transparent)}to{box-shadow:0 0 0 14px transparent}}
@media (prefers-reduced-motion:reduce){
  .wsc.is-going{transform:none}
  .wsc.is-back,.wsl.is-back{animation:none}
}
