HairpiN

#pwaDesktopGuide .pwa-d-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);z-index:10000} #pwaDesktopGuide .pwa-d-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10001;background:linear-gradient(135deg,#1a1a2e,#16213e);border:1px solid rgba(212,175,55,.3);border-radius:18px;padding:28px 24px 22px;max-width:420px;width:calc(100% - 40px);text-align:center;animation:pwaDFadeIn .3s cubic-bezier(.4,0,.2,1)} @keyframes pwaDFadeIn{from{opacity:0;transform:translate(-50%,-48%);}to{opacity:1;transform:translate(-50%,-50%);}} #pwaDesktopGuide .pwa-d-close{position:absolute;top:10px;right:12px;background:none;border:none;color:rgba(255,255,255,.4);font-size:22px;cursor:pointer;padding:4px 8px;line-height:1;transition:color .15s} #pwaDesktopGuide .pwa-d-close:hover{color:#fff} #pwaDesktopGuide .pwa-d-logo{width:64px;height:64px;border-radius:14px;margin:0 auto 14px;display:block;box-shadow:0 6px 22px rgba(212,175,55,.25)} #pwaDesktopGuide .pwa-d-title{font-size:18px;font-weight:800;color:#fff;margin-bottom:18px;letter-spacing:-.3px} #pwaDesktopGuide .pwa-d-body{display:flex;flex-direction:column;gap:12px;text-align:left} #pwaDesktopGuide .pwa-d-step{display:flex;align-items:flex-start;gap:12px} #pwaDesktopGuide .pwa-d-step-num{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#d4af37,#ffd700);color:#0a0a0a;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0} #pwaDesktopGuide .pwa-d-step-text{font-size:13px;color:rgba(255,255,255,.85);line-height:1.5;padding-top:5px} #pwaDesktopGuide .pwa-d-step-text strong{color:#fff;font-weight:700} #pwaDesktopGuide .pwa-d-step-text code{background:rgba(255,255,255,.08);padding:2px 6px;border-radius:4px;font-size:12px;font-family:monospace;color:#ffd700} #pwaDesktopGuide .pwa-d-warn{margin-top:8px;padding:10px 12px;background:rgba(255,193,7,.08);border:1px solid rgba(255,193,7,.2);border-radius:8px;font-size:12px;color:rgba(255,255,255,.7);line-height:1.5} #pwaDesktopGuide .pwa-d-warn code{background:rgba(0,0,0,.3);padding:2px 6px;border-radius:4px;font-family:monospace;color:#ffd700}

#pwaIosGuide .pwa-ios-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);z-index:10000} #pwaIosGuide .pwa-ios-modal{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:10001;background:linear-gradient(135deg,#1a1a2e,#16213e);border:1px solid rgba(212,175,55,.3);border-radius:18px;padding:28px 24px 22px;max-width:340px;width:calc(100% - 40px);text-align:center;animation:pwaSlideIn .4s cubic-bezier(.4,0,.2,1)} #pwaIosGuide .pwa-ios-close{position:absolute;top:10px;right:12px;background:none;border:none;color:rgba(255,255,255,.4);font-size:20px;cursor:pointer;padding:4px 6px;line-height:1} #pwaIosGuide .pwa-ios-close:hover{color:#fff} #pwaIosGuide .pwa-ios-logo{width:56px;height:56px;border-radius:14px;margin:0 auto 16px;display:block} #pwaIosGuide .pwa-ios-title{font-size:17px;font-weight:800;color:#fff;margin-bottom:6px} #pwaIosGuide .pwa-ios-subtitle{font-size:12px;color:rgba(255,255,255,.4);margin-bottom:20px} #pwaIosGuide .pwa-ios-steps{display:flex;flex-direction:column;gap:14px;margin-bottom:6px} #pwaIosGuide .pwa-ios-step{display:flex;align-items:center;gap:14px;text-align:left} #pwaIosGuide .pwa-ios-step-num{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#d4af37,#ffd700);color:#0a0a0a;font-size:14px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0} #pwaIosGuide .pwa-ios-step-text{font-size:13px;color:rgba(255,255,255,.8);line-height:1.4} #pwaIosGuide .pwa-ios-step-text strong{color:#fff} #pwaIosGuide .pwa-ios-share-icon{display:inline-block;width:20px;height:20px;vertical-align:middle;margin:0 2px} #pwaIosGuide .pwa-ios-arrow{display:block;margin:0 auto;width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-top:10px solid rgba(212,175,55,.4);margin-top:14px}