Files
boc/app-store-guide.html
T

662 lines
27 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="sv" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<title>App Store Guide — quiXzoom</title>
<meta name="description" content="Step-by-step guide to download and set up the quiXzoom app from the App Store and Google Play. Start earning as a Zoomer today.">
<link rel="canonical" href="https://www.quixzoom.com/app-store-guide.html">
<link rel="stylesheet" href="/_design-system/apple-native/tokens.css">
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: var(--font-text);
background: var(--grouped-background-primary);
color: var(--label-primary);
min-height: 100dvh;
padding-top: env(safe-area-inset-top, 44px);
padding-bottom: calc(env(safe-area-inset-bottom, 34px) + 40px);
-webkit-font-smoothing: antialiased;
}
.nav-bar {
position: sticky; top: 0; z-index: 200;
display: flex; align-items: center; justify-content: space-between;
height: 44px; padding: 0 16px;
background: var(--navbar-bg);
backdrop-filter: saturate(180%) blur(20px);
-webkit-backdrop-filter: saturate(180%) blur(20px);
border-bottom: 0.5px solid var(--separator);
}
.nav-title { font-size: 17px; font-weight: 600; letter-spacing: -0.41px; }
.nav-badge {
font-size: 12px; font-weight: 600; padding: 4px 10px;
background: rgba(10,132,255,0.15); color: var(--ios-blue);
border-radius: 20px;
}
/* Hero */
.hero {
padding: 28px 20px 24px;
text-align: center;
background: linear-gradient(180deg, rgba(10,132,255,0.08) 0%, transparent 100%);
}
.hero-icon { font-size: 64px; margin-bottom: 12px; line-height: 1; }
.hero-title {
font-family: var(--font-display);
font-size: 28px; font-weight: 800; letter-spacing: -0.5px;
margin-bottom: 8px;
}
.hero-sub { font-size: 15px; color: var(--label-secondary); line-height: 1.5; }
/* Progress overview */
.progress-overview {
margin: 0 16px 20px;
background: var(--background-secondary);
border-radius: 16px; overflow: hidden;
border: 0.5px solid var(--separator);
padding: 16px;
}
.progress-label {
display: flex; justify-content: space-between; align-items: center;
margin-bottom: 10px;
}
.progress-label-text { font-size: 14px; color: var(--label-secondary); }
.progress-label-count { font-size: 14px; font-weight: 700; color: var(--ios-blue); }
.progress-track {
height: 8px; background: var(--fill-secondary); border-radius: 4px; overflow: hidden;
}
.progress-fill {
height: 100%; border-radius: 4px;
background: linear-gradient(90deg, var(--ios-blue), var(--ios-indigo));
transition: width 0.8s cubic-bezier(0.34,1.56,0.64,1);
}
.progress-chips {
display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap;
}
.progress-chip {
font-size: 12px; font-weight: 500; padding: 4px 10px; border-radius: 12px;
}
.chip-done { background: rgba(48,209,88,0.15); color: var(--ios-green); }
.chip-todo { background: var(--fill-secondary); color: var(--label-secondary); }
/* Section */
.section { margin: 0 16px 28px; }
.section-header {
font-size: 13px; font-weight: 600; color: var(--label-secondary);
text-transform: uppercase; letter-spacing: 0.5px;
padding: 0 4px 10px;
}
/* Steps */
.steps-list { display: flex; flex-direction: column; gap: 0; }
.step-card {
background: var(--background-secondary);
border-radius: 0; overflow: hidden;
border: 0.5px solid var(--separator);
margin-bottom: -0.5px;
}
.step-card:first-child { border-radius: 14px 14px 0 0; }
.step-card:last-child { border-radius: 0 0 14px 14px; margin-bottom: 0; }
.step-card:only-child { border-radius: 14px; }
.step-header {
display: flex; align-items: center; gap: 14px;
padding: 16px; cursor: pointer;
}
.step-number {
width: 32px; height: 32px; border-radius: 50%;
display: flex; align-items: center; justify-content: center;
font-size: 14px; font-weight: 700; flex-shrink: 0;
}
.step-num-done { background: var(--ios-green); color: #fff; }
.step-num-todo { background: var(--fill-secondary); color: var(--label-secondary); }
.step-num-progress { background: var(--ios-blue); color: #fff; }
.step-info { flex: 1; }
.step-title { font-size: 16px; font-weight: 600; }
.step-desc { font-size: 13px; color: var(--label-secondary); margin-top: 2px; }
.step-check { font-size: 18px; }
.step-body {
padding: 0 16px 16px 62px;
font-size: 14px; color: var(--label-secondary);
line-height: 1.6;
display: none;
}
.step-body.open { display: block; }
.step-detail-row {
display: flex; gap: 8px; margin-bottom: 8px; align-items: flex-start;
}
.step-detail-dot { margin-top: 5px; width: 5px; height: 5px; border-radius: 50%; background: var(--ios-blue); flex-shrink: 0; }
.step-detail-text { flex: 1; color: var(--label-primary); }
.step-code {
font-family: var(--font-mono); font-size: 13px;
background: var(--fill-secondary); padding: 2px 7px; border-radius: 5px;
color: var(--ios-teal);
}
.step-cta {
display: inline-flex; align-items: center; gap: 6px;
margin-top: 10px; padding: 9px 16px; border-radius: 10px;
background: rgba(10,132,255,0.12); color: var(--ios-blue);
font-size: 14px; font-weight: 600; text-decoration: none;
transition: opacity 0.12s;
}
.step-cta:active { opacity: 0.7; }
/* Legal checklist */
.legal-card {
background: var(--background-secondary);
border-radius: 14px; overflow: hidden;
border: 0.5px solid var(--separator);
}
.legal-row {
display: flex; align-items: center; gap: 14px;
padding: 13px 16px;
border-bottom: 0.5px solid var(--separator);
}
.legal-row:last-child { border-bottom: none; }
.legal-icon { font-size: 20px; }
.legal-info { flex: 1; }
.legal-title { font-size: 15px; font-weight: 500; }
.legal-sub { font-size: 12px; color: var(--label-secondary); margin-top: 2px; }
.legal-status { font-size: 16px; }
/* Screenshot guide */
.screenshot-grid {
display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px;
margin-top: 0;
}
.screenshot-card {
background: var(--background-secondary);
border-radius: 12px; overflow: hidden;
border: 0.5px solid var(--separator);
padding: 14px 10px; text-align: center;
}
.screenshot-icon { font-size: 28px; margin-bottom: 8px; }
.screenshot-size { font-size: 12px; font-weight: 700; color: var(--label-primary); }
.screenshot-note { font-size: 11px; color: var(--label-secondary); margin-top: 3px; }
/* Info card */
.info-card {
background: rgba(10,132,255,0.08);
border: 0.5px solid rgba(10,132,255,0.2);
border-radius: 14px; padding: 14px 16px;
margin-top: 12px;
}
.info-card-title { font-size: 13px; font-weight: 600; color: var(--ios-blue); margin-bottom: 4px; }
.info-card-body { font-size: 13px; color: var(--label-secondary); line-height: 1.5; }
/* Warning card */
.warn-card {
background: rgba(255,159,10,0.08);
border: 0.5px solid rgba(255,159,10,0.2);
border-radius: 14px; padding: 14px 16px;
margin: 16px 16px 8px;
}
.warn-card-title { font-size: 13px; font-weight: 600; color: var(--ios-orange); margin-bottom: 4px; }
.warn-card-body { font-size: 13px; color: var(--label-secondary); line-height: 1.5; }
</style>
<style id="wcag-contrast-enforcement">
/* AAMOS GLOBAL CONTRAST ENFORCEMENT — WCAG AA (4.5:1 minimum) */
/* Regel: Ingen text under 70% opacity. Aldrig. */
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
/* Fix common low-contrast patterns */
[style*="rgba(60,60,67,0.4)"] { color: rgba(60,60,67,0.65) !important; }
[style*="rgba(60,60,67,0.3)"] { color: rgba(60,60,67,0.65) !important; }
[style*="rgba(255,255,255,0.4)"] { color: rgba(255,255,255,0.72) !important; }
[style*="rgba(255,255,255,0.3)"] { color: rgba(255,255,255,0.72) !important; }
[style*="opacity: 0.4"] { opacity: 0.72 !important; }
[style*="opacity: 0.3"] { opacity: 0.72 !important; }
</style>
<meta property="og:type" content="website">
<meta property="og:title" content="App Store Guide — quiXzoom">
<meta property="og:description" content="quiXzoom — Earn per Mission. No Platform Fee.">
<meta property="og:url" content="https://www.quixzoom.com/app-store-guide.html">
<meta property="og:image" content="https://www.quixzoom.com/images/app-screenshot.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="quiXzoom App Store guide — download on iOS and Android">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="https://www.quixzoom.com/images/app-screenshot.jpg">
<meta name="twitter:title" content="App Store Guide — quiXzoom">
</head>
<body>
<!-- Nav -->
<div class="nav-bar">
<span class="nav-title">App Store Guide</span>
<span class="nav-badge">3 / 9 klara</span>
</div>
<!-- H1 for SEO -->
<h1 style="position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;">quiXzoom App Store Guide — iOS & Android Download</h1>
<!-- Hero -->
<div class="hero">
<div class="hero-icon">📱</div>
<div class="hero-title">App Store Submission</div>
<div class="hero-sub">Steg-för-steg guide för quiXzoom<br>iOS App — augusti 2026</div>
</div>
<!-- Progress -->
<div class="progress-overview">
<div class="progress-label">
<span class="progress-label-text">Inlämningssteg slutförda</span>
<span class="progress-label-count">3 av 9</span>
</div>
<div class="progress-track">
<div class="progress-fill" id="progress-fill" style="width:33%"></div>
</div>
<div class="progress-chips">
<span class="progress-chip chip-done">✅ Privacy Policy</span>
<span class="progress-chip chip-done">✅ Support URL</span>
<span class="progress-chip chip-done">✅ Terms of Service</span>
<span class="progress-chip chip-todo">⏳ SwiftUI App</span>
<span class="progress-chip chip-todo">⏳ Screenshots</span>
<span class="progress-chip chip-todo">⏳ App Store Connect</span>
</div>
</div>
<!-- Steps -->
<div class="section">
<div class="section-header">Inlämningssteg</div>
<div class="steps-list">
<!-- Step 1 -->
<div class="step-card" onclick="toggle(1)">
<div class="step-header">
<div class="step-number step-num-todo">1</div>
<div class="step-info">
<div class="step-title">App Store Connect konto</div>
<div class="step-desc">Apple Developer Program · $99/år</div>
</div>
<span class="step-check">⚠️</span>
</div>
<div class="step-body" id="step-1">
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Logga in på <strong>appstoreconnect.apple.com</strong> med <span class="step-code">erik@hypbit.com</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Verifiera att Apple Developer Program ($99/år) är aktivt — kan ta 2448h att aktivera om nytt</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Navigera till "Apps" → klicka "+" → "New App"</div>
</div>
<a class="step-cta" href="https://appstoreconnect.apple.com" target="_blank">
🔗 Öppna App Store Connect
</a>
</div>
</div>
<!-- Step 2 -->
<div class="step-card" onclick="toggle(2)">
<div class="step-header">
<div class="step-number step-num-todo">2</div>
<div class="step-info">
<div class="step-title">App ID & Bundle ID</div>
<div class="step-desc">Registrera unik identifierare</div>
</div>
<span class="step-check">⚠️</span>
</div>
<div class="step-body" id="step-2">
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Gå till <strong>developer.apple.com/account</strong> → Certificates, IDs & Profiles → Identifiers</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Klicka "+" → App IDs → App → Continue</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Bundle ID (Explicit): <span class="step-code">se.wavult.quixzoom</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Capabilities att aktivera: Push Notifications, Sign in with Apple, Location Services</div>
</div>
<div class="info-card">
<div class="info-card-title">💡 Bundle ID</div>
<div class="info-card-body">Bundle ID är permanent och kan inte ändras efter publicering. Använd <code>se.wavult.quixzoom</code> exakt.</div>
</div>
</div>
</div>
<!-- Step 3 -->
<div class="step-card" onclick="toggle(3)">
<div class="step-header">
<div class="step-number step-num-todo">3</div>
<div class="step-info">
<div class="step-title">App Metadata</div>
<div class="step-desc">Namn, kategori, beskrivning</div>
</div>
<span class="step-check">⚠️</span>
</div>
<div class="step-body" id="step-3">
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">App Name: <span class="step-code">quiXzoom</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Subtitle (max 30 tecken): <span class="step-code">Drönartjänster på begäran</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Primary Category: <strong>Business</strong></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Secondary Category: <strong>Productivity</strong></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Keywords (max 100 tecken): <span class="step-code">drönare, scanning, uppdrag, zoomer, fastighet, inspektiön</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Description: Skriv en övertygande 4000-tecken beskrivning på svenska och engelska</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">What's New (v1.0): <span class="step-code">quiXzoom lanseras i Sverige! Ta drönarppdrag när det passar dig.</span></div>
</div>
</div>
</div>
<!-- Step 4 -->
<div class="step-card" onclick="toggle(4)">
<div class="step-header">
<div class="step-number step-num-todo">4</div>
<div class="step-info">
<div class="step-title">Screenshots</div>
<div class="step-desc">3 storlekar krävda av Apple</div>
</div>
<span class="step-check">⚠️</span>
</div>
<div class="step-body" id="step-4">
<div class="screenshot-grid">
<div class="screenshot-card">
<div class="screenshot-icon">📱</div>
<div class="screenshot-size">6.7"</div>
<div class="screenshot-note">iPhone 15 Plus<br>1290×2796</div>
</div>
<div class="screenshot-card">
<div class="screenshot-icon">📱</div>
<div class="screenshot-size">6.1"</div>
<div class="screenshot-note">iPhone 15<br>1179×2556</div>
</div>
<div class="screenshot-card">
<div class="screenshot-icon">🖥</div>
<div class="screenshot-size">iPad 12.9"</div>
<div class="screenshot-note">iPad Pro<br>2048×2732</div>
</div>
</div>
<div class="step-detail-row" style="margin-top:14px">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Minimum 3 screenshots, max 10 per enhet</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Visa: Uppdragskarta, Zoomer-profil, Betalningsflöde, Onboarding</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Verktyg: Figma + iPhone Simulator (Xcode), eller Rottenwood/AppLaunchpad</div>
</div>
<div class="info-card">
<div class="info-card-title">💡 Pro tip</div>
<div class="info-card-body">Lägg till device frames och svenska texter i bilderna. Localize screenshots till SV för bättre konvertering.</div>
</div>
</div>
</div>
<!-- Step 5 -->
<div class="step-card" onclick="toggle(5)">
<div class="step-header">
<div class="step-number step-num-todo">5</div>
<div class="step-info">
<div class="step-title">App Review Information</div>
<div class="step-desc">Kontaktinfo + demouppgifter</div>
</div>
<span class="step-check">⚠️</span>
</div>
<div class="step-body" id="step-5">
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">First Name / Last Name: <span class="step-code">Erik Svensson</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Email: <span class="step-code">erik@hypbit.com</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Phone: <span class="step-code">+46709123223</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Demo Account: Skapa ett test-zoomer-konto med verifierad KYC för review-teamet</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Review Notes: "quiXzoom is a gig economy platform for drone operators. Use the demo account to browse available missions. Location access is required for the mission map feature."</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Attachment: Valfri — överväg att bifoga en kort video (MP4, max 2 min) som demonstrerar appen</div>
</div>
</div>
</div>
<!-- Step 6 -->
<div class="step-card" onclick="toggle(6)">
<div class="step-header">
<div class="step-number step-num-done">6</div>
<div class="step-info">
<div class="step-title">Privacy Policy URL</div>
<div class="step-desc">GDPR-kompatibel · live</div>
</div>
<span class="step-check"></span>
</div>
<div class="step-body" id="step-6">
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">URL: <span class="step-code">https://quixzoom.com/privacy</span> ✅ Live</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">GDPR compliance: ✅ Täcker datainsamling, behandling, raderingsrätt</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Måste vara tillgänglig utan inloggning (publikt URL)</div>
</div>
<a class="step-cta" href="https://quixzoom.com/privacy" target="_blank">
🔗 Visa Privacy Policy
</a>
</div>
</div>
<!-- Step 7 -->
<div class="step-card" onclick="toggle(7)">
<div class="step-header">
<div class="step-number step-num-done">7</div>
<div class="step-info">
<div class="step-title">Support URL</div>
<div class="step-desc">Kundservice · live</div>
</div>
<span class="step-check"></span>
</div>
<div class="step-body" id="step-7">
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">URL: <span class="step-code">https://quixzoom.com/support</span> ✅ Live</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Email: <span class="step-code">support@quixzoom.com</span></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Phone: <span class="step-code">+46 8 123 45 67</span></div>
</div>
<a class="step-cta" href="https://quixzoom.com/support" target="_blank">
🔗 Visa Support-sida
</a>
</div>
</div>
<!-- Step 8 -->
<div class="step-card" onclick="toggle(8)">
<div class="step-header">
<div class="step-number step-num-todo">8</div>
<div class="step-info">
<div class="step-title">Marketing URL</div>
<div class="step-desc">Valfritt — produktsida</div>
</div>
<span class="step-check"></span>
</div>
<div class="step-body" id="step-8">
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Valfri men rekommenderad — ökar trovärdighet hos Apple</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Förslag: <span class="step-code">https://quixzoom.com</span> (landningssida)</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Alternativt: <span class="step-code">https://quixzoom.com/app</span> — specifik nedladdningssida</div>
</div>
</div>
</div>
<!-- Step 9 -->
<div class="step-card" onclick="toggle(9)">
<div class="step-header">
<div class="step-number step-num-todo">9</div>
<div class="step-info">
<div class="step-title">Submit for Review</div>
<div class="step-desc">Sista steget · 17 dagar väntetid</div>
</div>
<span class="step-check"></span>
</div>
<div class="step-body" id="step-9">
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Kontrollera att alla tidigare steg är klara (grön check)</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Klicka "Add for Review" → välj release type: <strong>Automatic release</strong></div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Genomsnittlig granskningstid: 2448h (kan vara upp till 7 dagar v1.0)</div>
</div>
<div class="step-detail-row">
<div class="step-detail-dot"></div>
<div class="step-detail-text">Planera inlämning: <strong>senast 24 juli</strong> för lansering 1 augusti</div>
</div>
<div class="info-card">
<div class="info-card-title">⏱ Tidslinje</div>
<div class="info-card-body">Lämna in senast 24 juli → App Review 25 dagar → Klar 3031 juli → Launch Day 1 augusti 🚀</div>
</div>
</div>
</div>
</div>
</div>
<!-- Legal checklist -->
<div class="section">
<div class="section-header">Juridisk checklista</div>
<div class="legal-card">
<div class="legal-row">
<span class="legal-icon">🇪🇺</span>
<div class="legal-info">
<div class="legal-title">GDPR Compliance</div>
<div class="legal-sub">Privacy policy live, dataskyddsombud</div>
</div>
<span class="legal-status"></span>
</div>
<div class="legal-row">
<span class="legal-icon">📊</span>
<div class="legal-info">
<div class="legal-title">DAC7 Rapportering</div>
<div class="legal-sub">EU-direktiv för plattformsekonomin — pågår</div>
</div>
<span class="legal-status"></span>
</div>
<div class="legal-row">
<span class="legal-icon">📄</span>
<div class="legal-info">
<div class="legal-title">Zoomer-avtal</div>
<div class="legal-sub">Uppdragstagares villkor — behövs innan launch</div>
</div>
<span class="legal-status"></span>
</div>
<div class="legal-row">
<span class="legal-icon">📱</span>
<div class="legal-info">
<div class="legal-title">SwiftUI App</div>
<div class="legal-sub">Native iOS-app för App Store</div>
</div>
<span class="legal-status"></span>
</div>
<div class="legal-row">
<span class="legal-icon">⚖️</span>
<div class="legal-info">
<div class="legal-title">Terms of Service</div>
<div class="legal-sub">Användarvillkor live</div>
</div>
<span class="legal-status"></span>
</div>
<div class="legal-row">
<span class="legal-icon">✈️</span>
<div class="legal-info">
<div class="legal-title">Drönartillstånd (LFV/Transportstyrelsen)</div>
<div class="legal-sub">Zoomer ansvarar för eget tillstånd</div>
</div>
<span class="legal-status">⚠️</span>
</div>
</div>
</div>
<!-- Critical path warning -->
<div class="warn-card">
<div class="warn-card-title">⚠️ Kritisk väg till 1 augusti</div>
<div class="warn-card-body">SwiftUI-app måste vara klar senast <strong>5 juni</strong> för att hinna med screenshots, testning och App Review-processen. Det är den enda blockande faktorn för en lyckad launch.</div>
</div>
<div style="height:32px"></div>
<script>
const openSteps = new Set();
function toggle(n) {
const el = document.getElementById('step-' + n);
if (!el) return;
if (openSteps.has(n)) {
el.classList.remove('open');
openSteps.delete(n);
} else {
el.classList.add('open');
openSteps.add(n);
}
}
// Auto-open step 1 on load
toggle(1);
</script>
</body>
</html>