/* ShipUniverse Fun Zone 1.0.0 — fully scoped front end */
#sufz-app, #sufz-app * { box-sizing:border-box; }
body.sufz-standalone-page { margin:0; background:#050c28; }
#sufz-app { --fz-dark:#081738; --fz-ink:#162447; --fz-white:#fff; --fz-muted:#b9c9e9; --fz-line:rgba(198,226,255,.18); font:500 16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; color:white; background:radial-gradient(ellipse at 50% 5%,#423d9d 0%,#1a235a 31%,#081431 65%,#050b22 100%); isolation:isolate; min-height:100vh; position:relative; overflow:hidden; }
#sufz-app :is(h1,h2,h3,h4,p) { margin-top:0; }
#sufz-app a { text-decoration:none; color:inherit; }
#sufz-app button, #sufz-app input { font:inherit; }
#sufz-app button { cursor:pointer; }
#sufz-app a:focus-visible, #sufz-app button:focus-visible, #sufz-app input:focus-visible { outline:3px solid #fbd04f; outline-offset:3px; }
#sufz-app .sufz-layout { position:relative; z-index:2; width:min(1480px,calc(100% - 64px)); margin:0 auto; }
#sufz-app .sufz-space { position:absolute; inset:0; overflow:hidden; z-index:0; pointer-events:none; background-image:radial-gradient(#eaf3ff 1px,transparent 1.6px),radial-gradient(#8df8ff 1px,transparent 1.4px),radial-gradient(#ffafd9 1px,transparent 1.5px); background-size:97px 109px,169px 183px,237px 221px; background-position:12px 22px,55px 105px,130px 70px; opacity:.77; }
#sufz-app .sufz-planet { display:block; position:absolute; border-radius:50%; box-shadow:0 0 65px 5px currentColor,inset -14px -12px 35px #15184977,inset 10px 10px 20px #ffffff33; animation:sufz-float 8s ease-in-out infinite alternate; }
#sufz-app .sufz-planet-a { color:#ee54e1; top:180px; left:-83px; width:195px; height:195px; background:radial-gradient(circle at 32% 28%,#ffc1ed,#fc64bd 30%,#9547dc 74%,#472aab); }
#sufz-app .sufz-planet-a:after { content:""; position:absolute; inset:35% -25%; border:15px solid #fbd971aa; border-radius:50%; transform:rotate(-21deg); }
#sufz-app .sufz-planet-b { color:#05d9fb; top:590px; right:-66px; width:160px; height:160px; background:radial-gradient(circle at 28% 25%,#d9fff9,#3fdaf0 35%,#2b7dd7 75%,#4c42b1); animation-delay:-3s; }
#sufz-app .sufz-planet-c { color:#ffac37; top:1100px; left:-80px; width:135px; height:135px; background:radial-gradient(circle at 30% 25%,#fff4b4,#ffbf4e 33%,#ff795e 77%,#be3e89); animation-delay:-5s; }
#sufz-app .sufz-planet-d { color:#62efaa; top:1650px; right:-95px; width:210px; height:210px; background:radial-gradient(circle at 35% 24%,#e4ffbc,#6be89b 34%,#29b5b2 75%,#4f55ba); animation-delay:-2s; }
#sufz-app .sufz-space-star { position:absolute; font-style:normal; font-size:40px; text-shadow:0 0 18px currentColor; animation:sufz-twinkle 4s ease-in-out infinite alternate; }
#sufz-app .s1 { left:4%; top:6%; color:#ffee85; } #sufz-app .s2 { right:5%; top:15%; color:#fd88d8; animation-delay:-2s; } #sufz-app .s3 { left:8%; top:39%; color:#80faff; animation-delay:-1s; } #sufz-app .s4 { right:7%; top:58%; color:#ffe08c; animation-delay:-3s; } #sufz-app .s5 { left:6%; bottom:15%; color:#f5a3ff; } #sufz-app .s6 { right:9%; bottom:6%; color:#94f7d5; }
@keyframes sufz-float { to { transform:translateY(17px) rotate(6deg); } } @keyframes sufz-twinkle { to { opacity:.3; transform:scale(.75); } }
#sufz-app .sufz-utility { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:16px 4px 12px; font-size:12px; letter-spacing:.11em; font-weight:800; color:#c5d6fe; }
#sufz-app .sufz-utility a { color:#b4f0ff; letter-spacing:.02em; } #sufz-app .sufz-utility span span { color:#ffe380; }
#sufz-app .sufz-header { display:flex; justify-content:space-between; align-items:center; gap:20px; background:linear-gradient(120deg,#0d214e 0%,#0c2758 55%,#31266d 100%); border:1px solid #8b9ce95e; border-radius:21px 21px 0 0; padding:19px 30px; box-shadow:0 18px 40px #0005; }
#sufz-app .sufz-brand { display:flex; align-items:center; flex-wrap:wrap; gap:18px; min-width:0; }
#sufz-app .sufz-logo-img { max-width:370px; max-height:69px; width:auto; height:auto; display:block; object-fit:contain; }
#sufz-app .sufz-logo-fallback { font-size:clamp(18px,2.25vw,31px); font-weight:1000; letter-spacing:-.06em; line-height:1; color:#e5f6ff; } #sufz-app .sufz-logo-fallback span { color:#4ccaff; }
#sufz-app .sufz-fun-letters { display:inline-flex; gap:1px; align-items:center; white-space:nowrap; letter-spacing:-.04em; filter:drop-shadow(0 4px 1px #040a30); }
#sufz-app .sufz-fun-letters b { display:inline-block; font-weight:1000; font-family:"Trebuchet MS",system-ui,sans-serif; font-size:clamp(23px,3vw,43px); line-height:1.1; -webkit-text-stroke:1.5px #ffffffaa; text-shadow:0 3px 0 #21134b,1px 5px 0 #020b2e; }
#sufz-app .sufz-fun-letters b:nth-of-type(1){color:#fb6d99;transform:rotate(-8deg)} #sufz-app .sufz-fun-letters b:nth-of-type(2){color:#ffc857;transform:rotate(5deg)} #sufz-app .sufz-fun-letters b:nth-of-type(3){color:#55e8bb;transform:rotate(-5deg)} #sufz-app .sufz-fun-letters b:nth-of-type(4){color:#9aa3ff;transform:rotate(5deg)} #sufz-app .sufz-fun-letters b:nth-of-type(5){color:#ff84d4;transform:rotate(-7deg)} #sufz-app .sufz-fun-letters b:nth-of-type(6){color:#7be1fc;transform:rotate(4deg)} #sufz-app .sufz-fun-letters b:nth-of-type(7){color:#ffd663;transform:rotate(-4deg)}
#sufz-app .sufz-fun-letters em { width:12px; }
#sufz-app .sufz-header-side { display:flex; align-items:center; gap:14px; font-weight:800; font-size:11px; line-height:1.45; letter-spacing:.1em; text-align:right; color:#b4c6f4; } #sufz-app .sufz-header-side strong { color:#ffe279; }
#sufz-app .sufz-header-smile { display:grid; place-items:center; width:53px; height:53px; border-radius:50%; background:linear-gradient(130deg,#ffdd55,#ff9258); box-shadow:0 7px 0 #dc6675; font-size:43px; line-height:1; color:#683688; transform:rotate(-13deg); }
#sufz-app .sufz-radar { border:1px solid #8b9ce95e; border-top:0; background:linear-gradient(155deg,#172a61f5 0%,#0e204ef7 48%,#102052f7 100%); padding:24px; box-shadow:0 30px 80px #020817ae; border-radius:0 0 23px 23px; }
#sufz-app .sufz-intro { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:9px 8px 27px; }
#sufz-app .sufz-overline { color:#8ce5fe; letter-spacing:.18em; font-size:11px; font-weight:900; }
#sufz-app .sufz-intro h2 { font-weight:1000; font-size:clamp(28px,3.1vw,44px); letter-spacing:-.04em; margin:3px 0 4px; line-height:1.15; } #sufz-app .sufz-intro h2 span { color:#ffd666; }
#sufz-app .sufz-intro p { color:#c1d0ef; font-size:15px; margin:0; }
#sufz-app .sufz-today { flex:none; display:flex; gap:11px; align-items:center; padding:10px 15px; border:1px solid #ffcc7199; border-radius:15px; background:#ffb64018; } #sufz-app .sufz-today>span { font-size:30px; } #sufz-app .sufz-today small { display:block; color:#ffcf8b; font-weight:900; font-size:10px; letter-spacing:.15em; } #sufz-app .sufz-today strong { display:block; color:#fff; font-size:12px; }
#sufz-app .sufz-tabs { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; margin:0 0 15px; }
#sufz-app .sufz-tab { display:flex; justify-content:center; align-items:center; gap:9px; padding:14px 6px; border:1px solid #597ac480; border-radius:12px; background:#152b61; color:#dceaff; font-size:15px; font-weight:900; transition:transform .16s,background .16s,border-color .16s; text-align:center; line-height:1.25; }
#sufz-app .sufz-tab>span { font-size:23px; } #sufz-app .sufz-tab:hover { transform:translateY(-3px); background:#284891; }
#sufz-app .sufz-tab.is-active { color:#12244b; border-color:#fff9a9; background:linear-gradient(115deg,#ffe16c,#ffad72); box-shadow:0 4px 0 #de6491,0 0 30px #ffdc7955; }
#sufz-app .sufz-workspace { display:grid; grid-template-columns:minmax(0,1fr) 288px; gap:15px; align-items:stretch; }
#sufz-app .sufz-screen { min-width:0; padding:23px; border:1px solid #8d9fe777; border-radius:19px; background:linear-gradient(155deg,#111f4e,#0a1639); box-shadow:inset 0 1px #ffffff16; }
#sufz-app .sufz-scene[hidden], #sufz-app .sufz-sidepanel[hidden] { display:none !important; }
#sufz-app .sufz-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:13px; }
#sufz-app .sufz-pill { display:inline-flex; align-items:center; gap:8px; color:#88eff3; font-weight:900; letter-spacing:.13em; font-size:10px; }
#sufz-app .sufz-live-dot { width:8px; height:8px; background:#50f5a9; border-radius:50%; box-shadow:0 0 13px #44fabc; }
#sufz-app .sufz-panel-category { background:#ffffff13; border:1px solid #ffffff23; padding:6px 12px; border-radius:20px; color:#d5e3ff; font-size:12px; font-weight:900; }
#sufz-app .sufz-scene-title { font-size:clamp(22px,2.5vw,35px); line-height:1.15; letter-spacing:-.035em; font-weight:1000; margin:0 0 7px; }
#sufz-app .sufz-scene-sub { color:#a8bce8; margin:0 0 19px; font-size:14px; }
#sufz-app .sufz-illustration { position:relative; height:365px; overflow:hidden; background:linear-gradient(130deg,#212c8a 0%,#473aba 48%,#c546ae 100%); border:1px solid #91cafa88; border-radius:15px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:20px; isolation:isolate; }
#sufz-app .sufz-illustration:before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 50% 45%,#f9c8ff59 0 16%,transparent 52%),repeating-radial-gradient(circle at 50% 50%,transparent 0 44px,#ffffff15 45px 47px,transparent 48px 91px); z-index:-1; }
#sufz-app .sufz-illustration span { font-size:clamp(70px,12vw,132px); filter:drop-shadow(0 12px 4px #0005); } #sufz-app .sufz-illustration small { text-transform:uppercase; color:#fff; font-size:14px; letter-spacing:.14em; text-align:center; font-weight:1000; text-shadow:0 2px #20256a; padding:0 10px; }
#sufz-app .sufz-illustration-comics { background:linear-gradient(130deg,#fc914d,#ef539f,#694ce5); } #sufz-app .sufz-illustration-puzzles { background:linear-gradient(130deg,#0f83c2,#38bdb5,#8de18a); } #sufz-app .sufz-illustration-trivia { background:linear-gradient(130deg,#7265dc,#d554ca,#f69688); } #sufz-app .sufz-illustration-challenges { background:linear-gradient(130deg,#b66824,#f7b93b,#dc6563); }
#sufz-app .sufz-featured-image { display:block; border-radius:15px; overflow:hidden; background:#182d5d; border:1px solid #9fd4f877; } #sufz-app .sufz-featured-image img { display:block; width:100%; height:auto; max-height:450px; object-fit:contain; margin:0 auto; }
#sufz-app .sufz-detail { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 0 0; }
#sufz-app .sufz-detail-label { font-size:10px; letter-spacing:.15em; font-weight:900; color:#98e6ff; } #sufz-app .sufz-detail h2 { font-size:21px; margin:4px 0; color:#fff; } #sufz-app .sufz-detail p { margin:4px 0; color:#c3cfe9; font-size:14px; } #sufz-app .sufz-detail>div { min-width:0; }
#sufz-app .sufz-action, #sufz-app .sufz-secondary { background:linear-gradient(110deg,#fee375,#ff9c62); color:#203458; border:0; border-radius:11px; padding:12px 16px; font-weight:1000; display:inline-flex; align-items:center; justify-content:center; gap:8px; white-space:nowrap; box-shadow:0 4px 0 #d66378; }
#sufz-app .sufz-action:hover { filter:brightness(1.1); } #sufz-app .sufz-secondary { background:#263d73; color:#dceaff; box-shadow:none; border:1px solid #8baee54a; }
#sufz-app .sufz-sidebar { display:flex; flex-direction:column; gap:13px; }
#sufz-app .sufz-sidepanel { flex:1; background:linear-gradient(160deg,#293d88 0%,#152758 80%); border:1px solid #8aa4e578; border-radius:18px; padding:21px; min-width:0; }
#sufz-app .sufz-side-label { color:#a4bbef; font-size:10px; letter-spacing:.14em; font-weight:1000; } #sufz-app .sufz-sidepanel h2 { margin:5px 0 7px; font-size:25px; letter-spacing:-.03em; } #sufz-app .sufz-sidepanel>p { font-size:13px; color:#c5d6fa; line-height:1.5; }
#sufz-app .sufz-stat-row { display:flex; justify-content:space-between; align-items:center; border:1px solid #ffffff27; background:#111f4b; border-radius:13px; padding:13px; margin:18px 0 23px; gap:10px; }
#sufz-app .sufz-stat-row span { font-size:10px; font-weight:900; letter-spacing:.09em; color:#b6cafa; } #sufz-app .sufz-stat-row strong { font-size:31px; color:#ffdb65; line-height:1; }
#sufz-app .sufz-sidepanel h3 { font-size:13px; color:#fff; margin-bottom:10px; }
#sufz-app .sufz-side-links { display:flex; flex-direction:column; gap:8px; } #sufz-app .sufz-side-links a { display:flex; justify-content:space-between; gap:5px; align-items:center; background:#ffffff12; border:1px solid #ffffff15; border-radius:9px; padding:11px; font-size:12px; color:#e5f3ff; } #sufz-app .sufz-side-links a:hover { background:#ffffff28; } #sufz-app .sufz-side-links a span { color:#ffe088; } #sufz-app .sufz-side-links p { font-size:13px; color:#d5dcf5; }
#sufz-app .sufz-side-browse { display:block; color:#ffdc74; font-size:12px; font-weight:900; margin-top:15px; }
#sufz-app .sufz-notice { background:linear-gradient(125deg,#7447b5,#5c3692); border:1px solid #c99ef5a9; border-radius:16px; padding:17px; } #sufz-app .sufz-notice>span { font-size:26px; display:block; } #sufz-app .sufz-notice strong { display:block; margin:5px 0; } #sufz-app .sufz-notice p { color:#e3d9fe; font-size:12px; margin:0; }
#sufz-app .sufz-bottom { margin-top:22px; } #sufz-app .sufz-bottom-title { display:flex; justify-content:space-between; align-items:end; gap:12px; padding:0 5px 13px; } #sufz-app .sufz-bottom-title span { color:#96cfff; font-size:11px; letter-spacing:.13em; font-weight:900; } #sufz-app .sufz-bottom-title h2 { margin:4px 0 0; font-size:24px; letter-spacing:-.03em; }
#sufz-app .sufz-explore { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
#sufz-app .sufz-explore-card { min-width:0; position:relative; display:flex; flex-direction:column; align-items:flex-start; padding:17px; min-height:164px; border-radius:15px; overflow:hidden; background:linear-gradient(130deg,#5154c3,#8051a9); border:1px solid #ffffff4d; transition:transform .18s; } #sufz-app .sufz-explore-card:hover { transform:translateY(-5px); } #sufz-app .sufz-explore-icon { font-size:34px; filter:drop-shadow(0 3px 2px #0004); } #sufz-app .sufz-explore-card strong { font-size:17px; margin:5px 0 3px; } #sufz-app .sufz-explore-card small { font-size:11px; color:#f1f5ff; line-height:1.35; } #sufz-app .sufz-explore-arrow { position:absolute; top:12px; right:13px; color:#fff9bf; font-size:22px; }
#sufz-app .sufz-explore-comics { background:linear-gradient(120deg,#eb6893,#b14b9f); } #sufz-app .sufz-explore-puzzles { background:linear-gradient(120deg,#198ab6,#177db2); } #sufz-app .sufz-explore-trivia { background:linear-gradient(120deg,#9b60d2,#6c49b7); } #sufz-app .sufz-explore-challenges { background:linear-gradient(120deg,#e5a344,#cd6b5b); }
#sufz-app .sufz-footer { display:flex; justify-content:space-between; gap:15px; width:min(1480px,calc(100% - 64px)); margin:25px auto 0; padding:0 0 36px; color:#c5d3f9; font-size:12px; }
#sufz-app .sufz-empty { min-height:300px; border:1px dashed #99c6f885; border-radius:15px; background:#ffffff0a; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; text-align:center; padding:25px; } #sufz-app .sufz-empty-emoji { font-size:68px; } #sufz-app .sufz-empty h3 { font-size:22px; margin:0; } #sufz-app .sufz-empty p { color:#c5d6f5; margin:0 0 10px; }
#sufz-app .sufz-archive-grid, #sufz-app .sufz-mini-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } #sufz-app .sufz-related { border-top:1px solid var(--fz-line); padding-top:20px; margin-top:28px; } #sufz-app .sufz-related h2 { font-size:18px; }
#sufz-app .sufz-content-card { display:flex; flex-direction:column; overflow:hidden; background:#ffffff0d; border:1px solid #92acdf59; border-radius:13px; padding:11px; gap:6px; } #sufz-app .sufz-content-card:hover { background:#ffffff21; } #sufz-app .sufz-content-card strong { font-size:13px; line-height:1.3; } #sufz-app .sufz-content-card>span:last-child { font-size:11px; color:#b5c6e8; } #sufz-app .sufz-card-thumb, #sufz-app .sufz-card-placeholder { display:grid; place-items:center; width:100%; aspect-ratio:16/10; height:auto; object-fit:cover; border-radius:8px; background:linear-gradient(135deg,#244ead,#ed64ad); font-size:40px; } #sufz-app .sufz-card-comics { background:linear-gradient(135deg,#f9935c,#ef4f9b); } #sufz-app .sufz-card-puzzles { background:linear-gradient(135deg,#1dbfbb,#5476c6); }
#sufz-app .sufz-article { color:#d6e1fb; font-size:15px; overflow-wrap:anywhere; } #sufz-app .sufz-article :is(h2,h3,h4) { color:white; } #sufz-app .sufz-article a { color:#8ae8ff; text-decoration:underline; } #sufz-app .sufz-article img { max-width:100%; height:auto; }
/* Built-in arcade game */
#sufz-app .sufz-stack { border:1px solid #5f88d7; border-radius:15px; padding:10px; background:linear-gradient(#113866,#0c1c43); } #sufz-app .sufz-stack canvas { display:block; width:100%; height:auto; border-radius:9px; cursor:crosshair; touch-action:manipulation; }
#sufz-app .sufz-game-controls { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:11px 2px 4px; } #sufz-app .sufz-game-controls :is(.sufz-game-score,.sufz-game-best) { font-weight:900; color:#fff; font-size:13px; } #sufz-app .sufz-game-controls .sufz-game-best { color:#fcd472; } #sufz-app .sufz-hint { color:#bed3f5; font-size:12px; margin:8px 3px 0; }
/* Trivia */
#sufz-app .sufz-trivia { background:linear-gradient(130deg,#1c3475,#292e79); border:1px solid #8aaae36c; border-radius:15px; padding:23px; min-height:320px; }
#sufz-app .sufz-trivia-progress { display:flex; justify-content:space-between; color:#90e3fd; text-transform:uppercase; font-size:11px; font-weight:900; letter-spacing:.1em; margin-bottom:20px; } #sufz-app .sufz-trivia-question { font-size:clamp(18px,2vw,25px); color:#fff; margin-bottom:20px; }
#sufz-app .sufz-trivia-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } #sufz-app .sufz-trivia-options button { border:1px solid #829ae3; background:#ffffff10; padding:14px; text-align:left; border-radius:10px; color:#fff; font-weight:700; } #sufz-app .sufz-trivia-options button:hover { background:#ffffff29; } #sufz-app .sufz-trivia-options button.sufz-correct { border-color:#6df9b7; background:#1c8b66; } #sufz-app .sufz-trivia-options button.sufz-wrong { border-color:#f9a1b5; background:#a43b67; }
#sufz-app .sufz-quiz-feedback { min-height:42px; padding:13px 0 0; color:#fff; font-weight:800; } #sufz-app .sufz-finished { text-align:center; padding:25px 10px; } #sufz-app .sufz-finished strong { display:block; color:#ffe37a; font-size:52px; }
/* Crosswords */
#sufz-app .sufz-crossword { border:1px solid #76b7e477; border-radius:15px; background:linear-gradient(120deg,#155275,#16376a); padding:18px; min-height:300px; }
#sufz-app .sufz-crossword-wrap { display:grid; grid-template-columns:minmax(0,1fr) minmax(150px,230px); gap:18px; align-items:start; }
#sufz-app .sufz-crossword-grid { display:grid; gap:3px; width:min(100%,360px); margin:0 auto; } #sufz-app .sufz-crossword-cell { aspect-ratio:1; min-width:0; position:relative; background:#fbfcff; border:1px solid #bbcce0; border-radius:3px; } #sufz-app .sufz-crossword-cell.is-block { background:#0c244d; border-color:#0c244d; } #sufz-app .sufz-crossword-cell input { border:0; border-radius:3px; width:100%; height:100%; text-align:center; color:#172a58; background:transparent; font-size:clamp(15px,2vw,27px); font-weight:900; text-transform:uppercase; padding:5px 0 0; } #sufz-app .sufz-crossword-cell small { position:absolute; z-index:1; top:1px; left:3px; font-size:9px; line-height:1; color:#34466d; pointer-events:none; } #sufz-app .sufz-crossword-cell.is-wrong { background:#ffbbc8; } #sufz-app .sufz-crossword-cell.is-right { background:#b3f7d5; }
#sufz-app .sufz-crossword-clues h3 { font-size:15px; margin:3px 0 7px; color:#ffe47b; } #sufz-app .sufz-crossword-clues ul { list-style:none; padding:0; margin:0 0 16px; } #sufz-app .sufz-crossword-clues li { font-size:12px; color:#f0f6ff; margin:0 0 7px; } #sufz-app .sufz-crossword-status { color:#fff7a9; font-size:12px; min-height:25px; font-weight:800; margin:12px 0; } #sufz-app .sufz-crossword-actions { display:flex; flex-wrap:wrap; gap:9px; }
#sufz-app.sufz-no-motion *, #sufz-app.sufz-no-motion *:before, #sufz-app.sufz-no-motion *:after { animation:none !important; transition:none !important; }
@media (max-width:1100px) { #sufz-app .sufz-layout { width:min(100% - 32px,1480px); } #sufz-app .sufz-workspace { grid-template-columns:minmax(0,1fr) 245px; } #sufz-app .sufz-explore { gap:7px; } #sufz-app .sufz-explore-card { padding:12px; } #sufz-app .sufz-header-side { display:none; } }
@media (max-width:780px) { #sufz-app .sufz-utility { font-size:10px; } #sufz-app .sufz-utility>span { display:none; } #sufz-app .sufz-header { padding:19px; } #sufz-app .sufz-brand { gap:11px; } #sufz-app .sufz-logo-img { max-width:230px; max-height:53px; } #sufz-app .sufz-radar { padding:13px; } #sufz-app .sufz-intro { padding:10px 3px 19px; } #sufz-app .sufz-today { display:none; } #sufz-app .sufz-tabs { display:flex; overflow:auto; scrollbar-width:thin; padding:3px 1px 10px; gap:8px; } #sufz-app .sufz-tab { min-width:120px; padding:11px 10px; font-size:13px; flex:none; } #sufz-app .sufz-workspace { display:flex; flex-direction:column; } #sufz-app .sufz-screen { padding:16px; } #sufz-app .sufz-sidebar { display:grid; grid-template-columns:1fr 1fr; } #sufz-app .sufz-explore { display:flex; overflow:auto; padding:0 0 8px; scroll-snap-type:x mandatory; } #sufz-app .sufz-explore-card { flex:0 0 185px; scroll-snap-align:start; } #sufz-app .sufz-footer { width:calc(100% - 32px); } }
@media (max-width:570px) { #sufz-app .sufz-layout { width:calc(100% - 18px); } #sufz-app .sufz-header { border-radius:14px 14px 0 0; padding:15px; } #sufz-app .sufz-logo-img { max-width:190px; max-height:44px; } #sufz-app .sufz-fun-letters b { font-size:26px; } #sufz-app .sufz-radar { border-radius:0 0 15px 15px; padding:10px; } #sufz-app .sufz-intro h2 { font-size:29px; } #sufz-app .sufz-intro p { font-size:13px; } #sufz-app .sufz-screen { padding:13px; } #sufz-app .sufz-panel-category { font-size:10px; } #sufz-app .sufz-illustration { height:275px; } #sufz-app .sufz-detail { display:block; } #sufz-app .sufz-detail .sufz-action { margin-top:14px; } #sufz-app .sufz-sidebar { display:flex; } #sufz-app .sufz-stat-row { margin:13px 0; } #sufz-app .sufz-bottom-title>span { display:none; } #sufz-app .sufz-bottom-title h2 { font-size:21px; } #sufz-app .sufz-archive-grid,#sufz-app .sufz-mini-list { grid-template-columns:repeat(2,minmax(0,1fr)); } #sufz-app .sufz-trivia { padding:14px; } #sufz-app .sufz-trivia-options { grid-template-columns:1fr; } #sufz-app .sufz-crossword-wrap { grid-template-columns:1fr; } #sufz-app .sufz-crossword-grid { max-width:310px; } #sufz-app .sufz-footer { display:block; line-height:1.7; } #sufz-app .sufz-game-controls { gap:9px; } #sufz-app .sufz-game-controls button { font-size:12px; } }
@media (prefers-reduced-motion:reduce) { #sufz-app *, #sufz-app *:before, #sufz-app *:after { animation:none !important; transition:none !important; } }

/* V1.1 comic voting and community leaderboards */
#sufz-app .sufz-comic-voter { display:flex; flex-direction:column; gap:13px; border:1px solid #fba5d188; border-radius:17px; background:linear-gradient(155deg,#512f83,#223b89); padding:17px; box-shadow:inset 0 0 30px #ec76bd18; }
#sufz-app .sufz-comic-art { background:#ffffff; border-radius:13px; overflow:hidden; padding:8px; }
#sufz-app .sufz-comic-art img { display:block; margin:0 auto; max-width:100%; height:auto; max-height:680px; object-fit:contain; border-radius:8px; }
#sufz-app .sufz-comic-placeholder { min-height:250px; background:linear-gradient(120deg,#ffcb67,#ff7db4,#8c7dff); display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:80px; border-radius:13px; }
#sufz-app .sufz-comic-placeholder span { color:#38275c; font-size:13px; font-weight:900; }
#sufz-app .sufz-comic-caption { font-size:17px; line-height:1.5; color:#fff; overflow-wrap:anywhere; }
#sufz-app .sufz-comic-caption p:last-child { margin-bottom:0; }
#sufz-app .sufz-comic-question { margin:4px 0 0; font-weight:1000; font-size:20px; text-align:center; }
#sufz-app .sufz-reaction-buttons { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
#sufz-app .sufz-reaction { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:10px; padding:15px 12px; border-radius:13px; border:2px solid #fff5; background:#ffffff18; color:white; font-size:29px; font-weight:900; transition:transform .15s,background .15s; }
#sufz-app .sufz-reaction span { font-size:16px; }
#sufz-app .sufz-reaction:hover:not(:disabled) { transform:translateY(-2px); background:#ffffff35; }
#sufz-app .sufz-reaction.is-selected { border-color:#ffe877; background:#ffffff36; box-shadow:0 0 22px #ffcb7570; }
#sufz-app .sufz-reaction:disabled { cursor:default; opacity:.8; }
#sufz-app .sufz-comic-result { text-align:center; font-size:13px; color:#ffedbc; margin:0; font-weight:800; }
#sufz-app .sufz-next-comic { text-align:center; align-self:center; min-width:190px; }
#sufz-app .sufz-next-comic[hidden] { display:none !important; }
#sufz-app .sufz-comic-last { text-align:center; color:#ffffffbc; }
#sufz-app .sufz-comic-rankings { margin-top:18px; padding:18px; border:1px solid #ffa6dd57; background:#ffa3d50d; border-radius:15px; }
#sufz-app .sufz-comic-rankings h3 { color:#ffe8a5; margin-bottom:12px; }
#sufz-app .sufz-ranking-switch { display:flex; gap:8px; margin-bottom:12px; }
#sufz-app .sufz-ranking-switch button { flex:1; color:#e4efff; font-weight:900; font-size:13px; padding:10px 12px; border:1px solid #ffffff4a; border-radius:9px; background:#ffffff14; }
#sufz-app .sufz-ranking-switch button.is-active { background:#ffca73; color:#2b224a; border-color:#ffca73; }
#sufz-app .sufz-ranking-results { color:#cedefd; font-size:13px; }
#sufz-app .sufz-comic-rank-link { display:flex; justify-content:space-between; flex-wrap:wrap; gap:7px; border-bottom:1px solid #ffffff2d; padding:9px 0; font-size:13px; }
#sufz-app .sufz-comic-rank-link:hover { color:#ffe18c; }
#sufz-app .sufz-comic-rank-link strong { color:#ffe18c; font-size:12px; }
#sufz-app .sufz-leaderboard { margin-top:18px; border:1px solid #85c2ee66; background:linear-gradient(125deg,#1d376b,#171f53); border-radius:15px; padding:18px; }
#sufz-app .sufz-board-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
#sufz-app .sufz-board-heading h3 { color:#ffdf7b; font-size:19px; margin:0 0 9px; }
#sufz-app .sufz-board-heading span { font-size:11px; color:#a8dff8; }
#sufz-app .sufz-leader-row { display:grid; grid-template-columns:38px minmax(0,1fr) auto; gap:10px; align-items:center; padding:9px 0; border-bottom:1px solid #ffffff1a; font-size:13px; }
#sufz-app .sufz-leader-row .sufz-rank { color:#ffda85; font-weight:900; }
#sufz-app .sufz-leader-row .sufz-player { overflow-wrap:anywhere; }
#sufz-app .sufz-leader-row strong { color:#b5f6df; font-variant-numeric:tabular-nums; }
#sufz-app .sufz-no-scores { color:#b6cfee; margin:0; }
#sufz-app .sufz-rank-entry { background:linear-gradient(110deg,#414394,#5e418d); margin-top:14px; padding:16px; border-radius:12px; border:1px solid #ffd7739e; }
#sufz-app .sufz-rank-entry h3 { color:#ffe084; font-size:19px; margin:0 0 4px; }
#sufz-app .sufz-rank-entry p { color:#eff6ff; font-size:13px; margin-bottom:10px; }
#sufz-app .sufz-score-form { display:flex; gap:9px; flex-wrap:wrap; }
#sufz-app .sufz-score-form input { flex:1 1 160px; width:100%; min-width:0; background:#fff; border:1px solid #a8c0ea; border-radius:9px; padding:9px 13px; color:#11234b; }
#sufz-app .sufz-score-form .sufz-action { font-size:13px; }
#sufz-app .sufz-score-feedback { padding-top:8px; }
#sufz-app .sufz-score-saved { color:#a0ffd8 !important; font-weight:900; }
@media(max-width:500px) {
  #sufz-app .sufz-comic-voter { padding:11px; }
  #sufz-app .sufz-reaction { padding:12px 6px; gap:5px; font-size:25px; }
  #sufz-app .sufz-reaction span { font-size:13px; }
  #sufz-app .sufz-comic-placeholder { min-height:180px; }
  #sufz-app .sufz-score-form .sufz-action { width:100%; }
}

/* v1.2 — two full-size, responsive arcade experiences */
#sufz-app .sufz-arcade { border:1px solid #8ddfff8c; border-radius:18px; background:linear-gradient(150deg,#0a2954,#111c50); padding:12px; box-shadow:0 14px 38px #0000002a,inset 0 1px #dff7ff24; overflow:hidden; }
#sufz-app .sufz-arcade-stats {display:grid; grid-template-columns:1fr 1fr 1fr;gap:8px; padding:0 0 11px;}
#sufz-app .sufz-arcade-stats span {min-width:0; padding:10px 9px; text-align:center;border:1px solid #ffffff26;border-radius:10px; background:linear-gradient(120deg,#3270b55c,#a05acc36); font-size:clamp(10px,1vw,14px);font-weight:1000;color:#fff;letter-spacing:.015em;line-height:1.25;}
#sufz-app .sufz-arcade-stats .sufz-game-score {color:#ffdf7e;}
#sufz-app .sufz-arcade-stats .sufz-game-best, #sufz-app .sufz-arcade-stats .sufz-game-clock {color:#8ef4e1;}
#sufz-app .sufz-canvas-frame {position:relative;isolation:isolate;background:#084a7d;overflow:hidden;border-radius:14px;box-shadow:0 6px 16px #0003;}
#sufz-app .sufz-canvas-frame canvas {width:100%;height:auto;aspect-ratio:900 / 440;display:block;touch-action:manipulation;outline-offset:-5px;border-radius:14px;}
#sufz-app .sufz-canvas-frame canvas:focus-visible {outline:3px solid #ffdf7e;}
#sufz-app .sufz-game-overlay {position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:11px;text-align:center;background:linear-gradient(135deg,#051e4ddd,#163783cd 56%,#33134bdc);padding:24px;color:white;backdrop-filter:blur(3px);}
#sufz-app .sufz-game-overlay[hidden] {display:none!important;}
#sufz-app .sufz-game-overlay .sufz-overlay-emoji {font-size:clamp(34px,6vw,64px);line-height:1;filter:drop-shadow(0 3px 7px #0004);}
#sufz-app .sufz-game-overlay h2 {margin:0;font-size:clamp(23px,3.5vw,42px);color:#fff;font-weight:1000;text-shadow:0 2px 11px #001a4e;letter-spacing:-.025em;}
#sufz-app .sufz-game-overlay p {margin:0;max-width:380px;font-size:clamp(12px,1.5vw,17px);color:#d9f2ff;line-height:1.45;}
#sufz-app .sufz-game-overlay .sufz-action {background:linear-gradient(120deg,#ffda6f,#ff8f7b);color:#20295f;border:0;font-size:15px;font-weight:1000;min-height:43px;padding:12px 23px;box-shadow:0 5px 17px #0004;}
#sufz-app .sufz-game-overlay .sufz-action:hover {transform:translateY(-2px);}
#sufz-app .sufz-arcade .sufz-game-controls {padding:13px 1px 5px;gap:9px;display:flex;align-items:center;flex-wrap:wrap;}
#sufz-app .sufz-arcade .sufz-game-controls button {min-height:43px;border-radius:10px;font-size:13px;padding:10px 15px;font-weight:900;}
#sufz-app .sufz-arcade .sufz-drop {background:linear-gradient(125deg,#ffce5f,#ff8e89)!important;color:#183257!important;}
#sufz-app .sufz-arcade .sufz-drop:disabled {opacity:.48;cursor:not-allowed;}
#sufz-app .sufz-game-signal {color:#c2e5ff;font-size:12px;font-weight:700;flex:1 1 170px;text-align:right;}
#sufz-app .sufz-arcade .sufz-hint {color:#c0d9ef;font-size:12px;line-height:1.6;margin:9px 2px 1px;}
#sufz-app .sufz-touch-controls {display:flex;gap:10px;justify-content:center;padding:12px 0 0;}
#sufz-app .sufz-touch-controls button {display:grid;place-items:center;width:70px;min-height:58px;padding:0;border:2px solid #6ccdfc8c;border-radius:13px;background:linear-gradient(150deg,#3b69b6,#5b3dab);color:white;font-size:31px;font-weight:1000;user-select:none;-webkit-user-select:none;touch-action:none;box-shadow:inset 0 1px #fff7,0 4px 11px #0003;}
#sufz-app .sufz-touch-controls button.is-pressed,#sufz-app .sufz-touch-controls button:active {background:#ffc85b;color:#172e4b;transform:translateY(2px);}
#sufz-app .sufz-touch-controls button:focus-visible {outline:3px solid #fff;outline-offset:2px;}
@media (max-width:670px){
  #sufz-app .sufz-arcade {padding:8px;border-radius:13px;}
  #sufz-app .sufz-arcade-stats {gap:4px;padding-bottom:8px;}
  #sufz-app .sufz-arcade-stats span {padding:8px 3px;font-size:10px;}
  #sufz-app .sufz-game-overlay {gap:6px;padding:12px;}
  #sufz-app .sufz-game-overlay .sufz-overlay-emoji {font-size:32px;}
  #sufz-app .sufz-game-overlay h2 {font-size:23px;}
  #sufz-app .sufz-game-overlay p {font-size:12px;max-width:250px;}
  #sufz-app .sufz-game-overlay .sufz-action {font-size:12px;min-height:34px;padding:8px 14px;}
  #sufz-app .sufz-touch-controls {gap:7px;}
  #sufz-app .sufz-touch-controls button {width:23%;min-height:58px;}
  #sufz-app .sufz-game-signal {flex-basis:100%;text-align:left;}
}
@media (max-width:385px){
  #sufz-app .sufz-game-overlay .sufz-overlay-emoji {display:none;}
  #sufz-app .sufz-game-overlay h2 {font-size:20px;}
  #sufz-app .sufz-game-overlay p {font-size:11px;line-height:1.2;}
  #sufz-app .sufz-game-overlay .sufz-action {padding:6px 13px;min-height:31px;}
}


/* v1.2.1 — brighter playful refresh */
body.sufz-standalone-page { background:linear-gradient(180deg,#7b4dff 0%,#288de6 32%,#31d5d1 63%,#ffd663 100%); }
#sufz-app { background:radial-gradient(circle at 18% 10%,rgba(255,227,120,.58) 0 10%,transparent 11%),radial-gradient(circle at 80% 12%,rgba(255,118,193,.42) 0 13%,transparent 14%),radial-gradient(circle at 50% 0%,rgba(122,93,255,.65),rgba(44,113,222,.85) 38%,rgba(10,22,74,.96) 100%); }
#sufz-app .sufz-header { background:linear-gradient(120deg,rgba(255,255,255,.20),rgba(255,255,255,.10)); border:2px solid rgba(255,255,255,.35); box-shadow:0 18px 40px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.3); backdrop-filter:blur(10px); }
#sufz-app .sufz-brand { gap:0; }
#sufz-app .sufz-logo-wordmark { display:flex; align-items:flex-end; flex-wrap:wrap; gap:10px; line-height:1; filter:drop-shadow(0 6px 0 rgba(22,25,88,.55)) drop-shadow(0 12px 22px rgba(0,0,0,.18)); }
#sufz-app .sufz-logo-wordmark .sufz-word { display:inline-block; font-style:normal; font-family:"Trebuchet MS", system-ui, sans-serif; font-weight:1000; letter-spacing:-.06em; -webkit-text-stroke:1.6px rgba(255,255,255,.92); text-shadow:0 3px 0 rgba(37,26,89,.7); }
#sufz-app .sufz-logo-wordmark .ship { font-size:clamp(25px,3.4vw,50px); color:#5cf5ff; transform:rotate(-3deg); }
#sufz-app .sufz-logo-wordmark .universe { font-size:clamp(25px,3.4vw,50px); color:#ffd45d; transform:rotate(2deg); }
#sufz-app .sufz-logo-wordmark .fun { font-size:clamp(30px,4.2vw,66px); color:#ff74c9; transform:rotate(-5deg) translateY(2px); }
#sufz-app .sufz-logo-wordmark .zone { font-size:clamp(30px,4.2vw,66px); color:#86ff7a; transform:rotate(4deg) translateY(2px); }
#sufz-app .sufz-header-side { color:#eef7ff; text-shadow:0 2px 10px rgba(19,20,89,.35); }
#sufz-app .sufz-header-side strong { color:#fff7a3; }
#sufz-app .sufz-header-smile { background:linear-gradient(145deg,#fff16f,#ff8b95); color:#6b1f80; box-shadow:0 8px 0 #8e56cf,0 14px 24px rgba(0,0,0,.16); }
#sufz-app .sufz-radar { background:linear-gradient(160deg,rgba(15,35,98,.76) 0%,rgba(54,45,150,.70) 40%,rgba(16,38,102,.83) 100%); border:2px solid rgba(255,255,255,.28); box-shadow:0 30px 80px rgba(2,8,23,.24); }
#sufz-app .sufz-overline { color:#baf7ff; text-shadow:0 0 16px rgba(57,236,255,.35); }
#sufz-app .sufz-intro h2 { color:#fff; text-shadow:0 3px 16px rgba(0,16,84,.35); }
#sufz-app .sufz-intro h2 span { color:#fff58d; }
#sufz-app .sufz-intro p { color:#eff8ff; font-size:16px; }
#sufz-app .sufz-today { background:linear-gradient(135deg,rgba(255,219,111,.28),rgba(255,133,164,.24)); border:2px solid rgba(255,241,169,.58); }
#sufz-app .sufz-tab { background:linear-gradient(135deg,rgba(255,255,255,.20),rgba(255,255,255,.09)); border:1px solid rgba(255,255,255,.28); box-shadow:inset 0 1px 0 rgba(255,255,255,.12); }
#sufz-app .sufz-tab:hover { background:linear-gradient(135deg,rgba(99,211,255,.45),rgba(194,98,255,.36)); }
#sufz-app .sufz-tab.is-active { background:linear-gradient(115deg,#fff27b,#ff9dcf 48%,#89ffbd); color:#17294d; box-shadow:0 5px 0 rgba(136,86,207,.85),0 0 28px rgba(255,219,121,.45); }
#sufz-app .sufz-screen { background:linear-gradient(160deg,rgba(16,42,111,.82),rgba(84,57,163,.72)); border:2px solid rgba(255,255,255,.22); }
#sufz-app .sufz-scene-title, #sufz-app .sufz-detail h2, #sufz-app .sufz-related h2, #sufz-app .sufz-sidepanel h2, #sufz-app .sufz-bottom-title h2 { color:#ffffff; text-shadow:0 3px 14px rgba(13,17,81,.28); }
#sufz-app .sufz-scene-title { font-size:clamp(24px,2.8vw,39px); }
#sufz-app .sufz-scene-sub, #sufz-app .sufz-detail p, #sufz-app .sufz-sidepanel p, #sufz-app .sufz-notice p { color:#ebf8ff; }
#sufz-app .sufz-panel-category, #sufz-app .sufz-side-label, #sufz-app .sufz-detail-label { background:linear-gradient(120deg,rgba(255,255,255,.16),rgba(255,255,255,.08)); border:1px solid rgba(255,255,255,.18); color:#fff7ab; }
#sufz-app .sufz-sidepanel, #sufz-app .sufz-notice, #sufz-app .sufz-content-card, #sufz-app .sufz-detail, #sufz-app .sufz-related, #sufz-app .sufz-bottom, #sufz-app .sufz-leaderboard, #sufz-app .sufz-comic-rankings { background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.08)); border:1px solid rgba(255,255,255,.20); box-shadow:inset 0 1px 0 rgba(255,255,255,.10); }
#sufz-app .sufz-action { background:linear-gradient(120deg,#fff377,#ffb36c 38%,#ff8fc0 72%,#7af8d0); color:#173257; box-shadow:0 7px 0 #8759cf,0 12px 24px rgba(0,0,0,.14); }
#sufz-app .sufz-action:hover { filter:brightness(1.03); }
#sufz-app .sufz-secondary { background:linear-gradient(130deg,rgba(255,255,255,.24),rgba(255,255,255,.12)); border:1px solid rgba(255,255,255,.3); color:#fff; }
#sufz-app .sufz-board-heading h3, #sufz-app .sufz-comic-rankings h3 { color:#fff6a0; }
#sufz-app .sufz-footer { color:#edf7ff; background:transparent; }
@media (max-width:780px) {
  #sufz-app .sufz-logo-wordmark { gap:6px; }
  #sufz-app .sufz-logo-wordmark .ship, #sufz-app .sufz-logo-wordmark .universe { font-size:24px; }
  #sufz-app .sufz-logo-wordmark .fun, #sufz-app .sufz-logo-wordmark .zone { font-size:30px; }
}
@media (max-width:570px) {
  #sufz-app .sufz-header-side { display:none; }
  #sufz-app .sufz-logo-wordmark { justify-content:flex-start; }
}


/* v1.2.8 — darker outer scene with stars fading into ocean */
body.sufz-standalone-page { background:#00040b; }
#sufz-app {
  background:
    linear-gradient(180deg,
      #010308 0%,
      #02060f 18%,
      #040b16 36%,
      #071a31 50%,
      #0a3156 63%,
      #0f5d8b 80%,
      #2e8dc2 100%) !important;
}
#sufz-app .sufz-space {
  background-image:
    radial-gradient(rgba(255,255,255,.95) 1px,transparent 1.7px),
    radial-gradient(rgba(170,225,255,.75) 1px,transparent 1.5px),
    radial-gradient(rgba(255,255,255,.55) .8px,transparent 1.4px) !important;
  background-size:110px 125px, 190px 210px, 270px 260px !important;
  background-position:8px 18px, 60px 90px, 140px 55px !important;
  opacity:.46 !important;
}
#sufz-app .sufz-planet { display:none !important; }
#sufz-app .sufz-space-star { color:#d7f0ff !important; font-size:26px; text-shadow:0 0 12px rgba(170,225,255,.45); opacity:.8; }
#sufz-app .s1 { left:5%; top:10%; }
#sufz-app .s2 { right:8%; top:18%; }
#sufz-app .s3 { left:10%; top:48%; }
#sufz-app .s4 { right:9%; top:62%; }
#sufz-app .s5 { left:7%; bottom:16%; }
#sufz-app .s6 { right:10%; bottom:10%; }


/* v1.2.9 — compact header and utility URL note */
#sufz-app .sufz-utility {
  padding:10px 4px 8px !important;
  font-size:11px;
}
#sufz-app .sufz-url-note {
  display:inline-flex;
  align-items:center;
  padding:5px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(180,210,255,.22);
  color:#d8ecff !important;
  letter-spacing:.03em !important;
  font-weight:900;
  text-transform:none;
}
@media (max-width:780px) {
  #sufz-app .sufz-utility { font-size:10px; }
  #sufz-app .sufz-utility > .sufz-url-note { display:inline-flex !important; }
}

/* v1.4.0 — informational challenge details (no entries yet) */
#sufz-app .sufz-challenge-details{margin:14px 0;padding:17px 20px;background:rgba(31,65,126,.34);border-radius:13px;color:#eaf5ff}
#sufz-app .sufz-challenge-format{display:inline-block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#ffe289;font-weight:900;margin-bottom:8px}
#sufz-app .sufz-challenge-details p{margin:6px 0 10px;line-height:1.6}
#sufz-app .sufz-challenge-details strong{color:#fff}
#sufz-app .sufz-challenge-closed{color:#ffbfba;font-weight:800}
#sufz-app .sufz-challenge-instructions{border-top:1px solid rgba(255,255,255,.14);padding-top:12px;margin-top:10px}


/* v1.8.0 — Port Panic game embedded without an extra framed panel */
#sufz-app .sufz-portpanic { width:100%; margin:0; }
#sufz-app .sufz-portpanic-frame { display:block; width:100%; height:820px; border:0; border-radius:12px; background:#061522; }
#sufz-app .sufz-portpanic-note { font-size:12px; color:#bbd9e7; margin:9px 2px 0; }
#sufz-app .sufz-portpanic-note a { color:#ffde91; text-decoration:underline; }
#sufz-app .sufz-tabs { grid-template-columns:repeat(5,minmax(0,1fr)); }
@media(max-width:680px){#sufz-app .sufz-portpanic-frame{height:710px;border-radius:8px;} }

#sufz-app .sufz-illustration-picpuzzles {background:linear-gradient(130deg,#1469aa,#1691a7,#68cfbd)}
#sufz-app .sufz-explore-picpuzzles {background:linear-gradient(120deg,#1e99aa,#4c6ed0)}
#sufz-app .sufz-card-picpuzzles {background:linear-gradient(135deg,#2178ab,#65c2c2)}

/* v1.8.2 Port Panic mobile viewport and full-screen fixes */
#sufz-app .sufz-portpanic.is-immersive {position:fixed!important;inset:0!important;z-index:2147483000!important;width:100vw!important;height:100dvh!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:#061522!important;}
#sufz-app .sufz-portpanic.is-immersive .sufz-portpanic-frame{width:100%!important;height:100%!important;max-height:none!important;border-radius:0!important;}
#sufz-app .sufz-portpanic.is-immersive .sufz-portpanic-note{display:none!important;}
html.sufz-portpanic-active,html.sufz-portpanic-active body{overflow:hidden!important;overscroll-behavior:none!important;}
@media(max-width:680px){#sufz-app .sufz-portpanic-note{background:#12475d;color:#e7f6ff;border-radius:8px;padding:9px 10px;line-height:1.5}#sufz-app .sufz-portpanic-frame{max-width:100%;border-radius:8px}}

html.sufz-portpanic-active #sufz-app {isolation:auto!important;overflow:visible!important;}

/* v1.9.0 — Funnies: image-first, compact reactions, rankings and sharing */
#sufz-app .sufz-comic-voter{background:transparent;border:0;box-shadow:none;padding:0;gap:12px;max-width:100%;}
#sufz-app .sufz-comic-art{display:block;position:relative;width:100%;max-width:100%;padding:0;border:0;cursor:zoom-in;background:#fff;overflow:hidden;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,.18);}
#sufz-app .sufz-comic-art img{display:block;width:100%;height:auto;max-height:min(72vh,740px);object-fit:contain;object-position:center;}
#sufz-app .sufz-comic-zoom-hint{position:absolute;bottom:10px;right:10px;padding:5px 10px;border-radius:20px;background:rgba(3,22,41,.84);font-size:12px;font-weight:900;color:#fff;}
#sufz-app .sufz-comic-question{text-align:center;font-size:19px;margin:0;font-weight:950;}
#sufz-app .sufz-reaction-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
#sufz-app .sufz-reaction{min-width:0;padding:10px 6px;border:1px solid rgba(255,255,255,.24);border-radius:11px;font-size:23px;gap:6px;background:rgba(255,255,255,.09);}
#sufz-app .sufz-reaction span{font-size:clamp(11px,1.25vw,15px);font-weight:900;}
#sufz-app .sufz-comic-result{font-size:12px;line-height:1.55;}
#sufz-app .sufz-comic-share{display:flex;flex-direction:column;gap:8px;border-top:1px solid rgba(255,255,255,.12);padding-top:13px;}
#sufz-app .sufz-comic-share>strong{font-size:13px;color:#bce9ff;}
#sufz-app .sufz-comic-share-actions{display:flex;flex-wrap:wrap;gap:7px;}
#sufz-app .sufz-comic-share-actions button{padding:8px 11px;border-radius:8px;color:#eefaff;background:#23476d;border:1px solid rgba(255,255,255,.18);font-size:12px;font-weight:850;cursor:pointer;}
#sufz-app .sufz-comic-share-actions button:hover{background:#356b95;}
#sufz-app .sufz-comic-share-status{min-height:14px;font-size:11px;color:#94f3ca;}
#sufz-app .sufz-comic-rankings{padding:17px 12px;background:rgba(6,25,58,.35);border:0;box-shadow:none;}
#sufz-app .sufz-rank-explainer{font-size:12px;color:#c5d8f0;margin:0 0 12px;}
#sufz-app .sufz-comic-rank-link{display:flex;align-items:center;gap:10px;padding:9px 3px;border-bottom:1px solid rgba(255,255,255,.12);text-decoration:none;color:#fff;flex-wrap:nowrap;}
#sufz-app .sufz-comic-rank-thumb{width:74px;height:54px;object-fit:cover;border-radius:7px;background:#24436b;flex:none;}
#sufz-app .sufz-comic-rank-body{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1;}
#sufz-app .sufz-comic-rank-body strong{font-size:13px;line-height:1.3;color:#fff;}
#sufz-app .sufz-comic-rank-body small{font-size:11px;color:#bfd5ed;}
#sufz-app .sufz-comic-rank-score{white-space:nowrap;font-size:12px;color:#ffe492;font-weight:900;flex:none;}
#sufz-app .sufz-ranking-switch{gap:5px;}
#sufz-app .sufz-ranking-switch button{padding:9px 4px;font-size:12px;}
@media(max-width:520px){
 #sufz-app .sufz-comic-art img{max-height:65vh;}
 #sufz-app .sufz-comic-zoom-hint{bottom:6px;right:6px;font-size:10px;}
 #sufz-app .sufz-reaction{padding:11px 3px;gap:4px;flex-direction:column;}
 #sufz-app .sufz-reaction span{font-size:11px;}
 #sufz-app .sufz-comic-rank-thumb{width:60px;height:46px;}
 #sufz-app .sufz-comic-rank-score{font-size:11px;}
}

/* Full-size comic lightbox lives on body, outside the clipped Fun Zone container. */
.sufz-comic-lightbox[hidden]{display:none!important;}
.sufz-comic-lightbox{position:fixed;inset:0;background:#020711ee;z-index:2147483640;display:flex;flex-direction:column;color:#fff;padding:8px;}
.sufz-comic-lightbox-bar{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:4px 5px 10px;flex-wrap:wrap;font:700 12px system-ui,sans-serif;}
.sufz-comic-lightbox-bar span{margin-right:auto;}
.sufz-comic-lightbox-bar button{border:1px solid #7292b7;background:#1a3856;color:white;border-radius:7px;padding:9px 12px;font:800 13px system-ui,sans-serif;cursor:pointer;}
.sufz-comic-lightbox-content{flex:1;min-height:0;overflow:auto;display:flex;align-items:center;justify-content:center;}
.sufz-comic-lightbox-content img{display:block;object-fit:contain;max-width:100%;max-height:100%;height:auto;width:auto;}
.sufz-comic-lightbox.is-zoomed .sufz-comic-lightbox-content{display:block;text-align:center;}
.sufz-comic-lightbox.is-zoomed .sufz-comic-lightbox-content img{max-width:none;max-height:none;width:min(170vw,1700px);height:auto;margin:auto;}
body.sufz-lightbox-open{overflow:hidden!important;}

/* Content-only focus mode: hide surrounding Fun Zone furniture and use phone viewport. */
#sufz-app .sufz-focus-controls{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 12px;}
#sufz-app .sufz-focus-toggle{background:#244b77;color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:9px;padding:9px 13px;font-size:13px;font-weight:900;cursor:pointer;}
#sufz-app .sufz-rotate-tip{color:#b7e5fa;font-size:12px;}
body.sufz-body-focus{overflow:hidden!important;overscroll-behavior:none;}
body.sufz-body-focus #sufz-app{isolation:auto!important;overflow:visible!important;z-index:2147482000;position:relative;}
#sufz-app .sufz-scene.is-focus,
#sufz-app .sufz-scene.is-focus:fullscreen{position:fixed!important;inset:0!important;z-index:2147482001!important;box-sizing:border-box!important;width:100vw!important;height:100dvh!important;max-width:none!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;background:#08162c!important;color:#fff!important;padding:12px!important;margin:0!important;border:0!important;border-radius:0!important;scrollbar-width:thin;}
#sufz-app .sufz-scene.is-focus>.sufz-panel-head,
#sufz-app .sufz-scene.is-focus>.sufz-scene-title,
#sufz-app .sufz-scene.is-focus>.sufz-scene-sub,
#sufz-app .sufz-scene.is-focus>.sufz-detail,
#sufz-app .sufz-scene.is-focus>.sufz-related,
#sufz-app .sufz-scene.is-focus>.sufz-leaderboard,
#sufz-app .sufz-scene.is-focus>.sufz-comic-rankings{display:none!important;}
#sufz-app .sufz-scene.is-focus .sufz-focus-controls{position:sticky;top:0;z-index:4;margin:0 0 8px;padding:6px;background:#08162cee;}
#sufz-app .sufz-scene.is-focus .sufz-comic-voter{max-width:min(100%,1150px);margin:0 auto;}
#sufz-app .sufz-scene.is-focus .sufz-comic-art img{max-height:calc(100dvh - 180px);}
#sufz-app .sufz-scene.is-focus .sufz-portpanic-frame{height:calc(100dvh - 83px)!important;min-height:0!important;border-radius:4px!important;}
#sufz-app .sufz-scene.is-focus .sufz-portpanic-note{display:none;}
#sufz-app .sufz-scene.is-focus .sufz-crane-stage canvas,
#sufz-app .sufz-scene.is-focus .sufz-canvas-frame canvas{max-height:calc(100dvh - 210px);object-fit:contain;}
@media(max-width:780px) and (orientation:portrait){
 #sufz-app .sufz-scene.is-focus[data-sufz-scene="games"] .sufz-rotate-tip{display:block;width:100%;text-align:center;background:#113e63;border-radius:8px;padding:7px;}
}


/* v2.0.0 comic navigation + mobile pinch-zoom accessibility */
#sufz-app .sufz-comic-zoom-hint{top:9px!important;right:9px!important;bottom:auto!important;display:inline-block!important;background:#09233ddb!important;font-size:12px!important;padding:8px 13px!important;border:1px solid #bde6ff88!important;}
#sufz-app .sufz-comic-prevnext{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;}
#sufz-app .sufz-comic-prevnext a{flex:1;text-align:center;padding:12px 8px;border:1px solid #79b9e266;border-radius:11px;background:#17456b;color:#fff;font-size:14px;font-weight:900;}
#sufz-app .sufz-comic-prevnext a:hover{background:#245980;}
#sufz-app .sufz-comic-next-arrow[aria-disabled="true"]{opacity:.45;cursor:not-allowed;}
.sufz-comic-lightbox{z-index:2147483647!important;padding:0!important;overscroll-behavior:none!important;}
.sufz-comic-lightbox-bar{flex:none;z-index:2;background:#071526;justify-content:space-between;padding:9px 12px!important;}
.sufz-comic-lightbox-bar span{font-size:12px;flex:1;min-width:120px;}
.sufz-comic-lightbox-content{position:relative;min-height:0!important;flex:1!important;display:flex!important;justify-content:center!important;align-items:center!important;overflow:hidden!important;touch-action:none!important;user-select:none!important;cursor:grab!important;overscroll-behavior:contain!important;}
.sufz-comic-lightbox-content img{display:block!important;width:auto!important;max-width:100%!important;max-height:100%!important;height:auto!important;object-fit:contain!important;transform-origin:center center!important;will-change:transform!important;touch-action:none!important;pointer-events:none!important;user-select:none!important;}
@media(max-width:650px){.sufz-comic-lightbox-bar{gap:4px!important;padding:7px 4px!important}.sufz-comic-lightbox-bar button{padding:8px 7px!important;font-size:12px!important}.sufz-comic-lightbox-bar span{font-size:10px}.sufz-comic-lightbox-content{flex:1!important}}

.sufz-comic-lightbox-content .sufz-lightbox-prev,.sufz-comic-lightbox-content .sufz-lightbox-next{position:absolute;top:50%;transform:translateY(-50%);z-index:4;display:grid;place-items:center;border:1px solid #ffffff88;border-radius:12px;background:#082741d9;color:#fff;font-size:39px;font-weight:850;width:43px;height:76px;cursor:pointer;touch-action:manipulation;}
.sufz-comic-lightbox-content .sufz-lightbox-prev{left:7px}.sufz-comic-lightbox-content .sufz-lightbox-next{right:7px}
.sufz-comic-lightbox-content [data-comic-nav]:disabled{opacity:.24;cursor:not-allowed;}
@media(max-width:680px){.sufz-comic-lightbox-content .sufz-lightbox-prev,.sufz-comic-lightbox-content .sufz-lightbox-next{width:30px;height:55px;font-size:30px;}}


/* v2.1.0: comic navigation belongs ON the artwork, not beneath it */
#sufz-app .sufz-comic-stage{position:relative;width:100%;max-width:100%;isolation:isolate;}
#sufz-app .sufz-comic-stage .sufz-comic-art{display:block;width:100%;}
#sufz-app .sufz-comic-stage .sufz-comic-side-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:48px;height:84px;display:grid;place-items:center;border-radius:12px;border:1px solid rgba(255,255,255,.6);background:rgba(4,27,48,.82);color:#fff;font-size:51px;font-weight:700;line-height:1;text-decoration:none;box-shadow:0 4px 15px rgba(0,0,0,.3);touch-action:manipulation;}
#sufz-app .sufz-comic-stage .sufz-comic-prev{left:10px;}
#sufz-app .sufz-comic-stage .sufz-comic-next-arrow{right:10px;}
#sufz-app .sufz-comic-stage .sufz-comic-side-arrow:hover{background:rgba(18,79,114,.96);}
#sufz-app .sufz-comic-stage .sufz-comic-side-arrow:focus-visible{outline:3px solid #ffe08a;outline-offset:2px;}
#sufz-app .sufz-comic-stage .sufz-comic-next-arrow[aria-disabled="true"]{opacity:.53;cursor:not-allowed;}
#sufz-app .sufz-comic-stage .sufz-comic-zoom-hint{top:9px!important;right:9px!important;bottom:auto!important;}
@media(max-width:680px){
 #sufz-app .sufz-comic-stage .sufz-comic-side-arrow{width:35px;height:59px;font-size:39px;border-radius:9px;}
 #sufz-app .sufz-comic-stage .sufz-comic-prev{left:3px;}
 #sufz-app .sufz-comic-stage .sufz-comic-next-arrow{right:3px;}
 #sufz-app .sufz-comic-stage .sufz-comic-zoom-hint{font-size:11px!important;padding:6px 8px!important;}
}


/* v2.2 — isolated Picture Shuffle module under the existing Pic Puzzles tab. */
#sufz-app .sufz-shuffle-wrap{width:100%;min-width:0;margin:0}
#sufz-app .sufz-shuffle-frame{display:block;width:100%;height:950px;min-height:350px;border:0;border-radius:12px;background:#06192e;overflow:hidden}
#sufz-app .sufz-shuffle-note{font-size:12px;line-height:1.5;color:#b9dcf0;margin:9px 2px 0}
#sufz-app .sufz-shuffle-note a{color:#ffe19a;text-decoration:underline}
@media(max-width:780px){#sufz-app .sufz-shuffle-frame{height:1420px;border-radius:8px}}

/* v2.3.0 — Pic Puzzles owns the complete game area, no article-style wrapper */
#sufz-app:has(.sufz-scene[data-sufz-scene="picpuzzles"]:not([hidden])) .sufz-workspace{display:block!important;}
#sufz-app:has(.sufz-scene[data-sufz-scene="picpuzzles"]:not([hidden])) .sufz-sidebar{display:none!important;}
#sufz-app:has(.sufz-scene[data-sufz-scene="picpuzzles"]:not([hidden])) .sufz-screen{width:100%;max-width:none;border:0!important;background:#06192e!important;padding:0!important;border-radius:14px;overflow:hidden;box-shadow:none!important;}
#sufz-app .sufz-scene[data-sufz-scene="picpuzzles"]{width:100%;margin:0;padding:0;background:#06192e;}
#sufz-app .sufz-scene[data-sufz-scene="picpuzzles"]>.sufz-panel-head,
#sufz-app .sufz-scene[data-sufz-scene="picpuzzles"]>.sufz-focus-controls,
#sufz-app .sufz-scene[data-sufz-scene="picpuzzles"]>.sufz-scene-title,
#sufz-app .sufz-scene[data-sufz-scene="picpuzzles"]>.sufz-scene-sub,
#sufz-app .sufz-scene[data-sufz-scene="picpuzzles"]>.sufz-detail{display:none!important;}
#sufz-app .sufz-shuffle-wrap{width:100%;background:#06192e;padding:0!important;}
#sufz-app .sufz-shuffle-frame{width:100%;height:900px;min-height:350px;border:0!important;border-radius:0!important;display:block;background:#06192e;}
#sufz-app .sufz-shuffle-note{display:none!important;}
@media(max-width:780px){#sufz-app .sufz-shuffle-frame{height:1250px;}}
/* Clear, one-tap comic voting */
#sufz-app .sufz-comic-question{font-size:clamp(22px,3vw,30px)!important;font-weight:950!important;margin:12px 0 8px!important;}
#sufz-app .sufz-reaction-buttons{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px!important;}
#sufz-app .sufz-reaction{display:flex!important;flex-direction:column;align-items:center;gap:2px;font-size:13px!important;min-width:0;padding:10px 3px!important;}
#sufz-app .sufz-reaction-emoji{font-size:clamp(35px,5.4vw,54px)!important;line-height:1.1;}
#sufz-app .sufz-comic-stage .sufz-comic-side-arrow{background:#072742e3!important;}

#sufz-app .sufz-comic-stage .sufz-comic-side-arrow[hidden]{display:none!important;}

/* v2.4.0 - dedicated full-area crossword with responsive iframe sizing */
#sufz-app .sufz-crossword-v24{width:100%;min-width:0;background:#07182d;border:0;padding:0;overflow:hidden;border-radius:13px}
#sufz-app .sufz-crossword-v24-frame{display:block;width:100%;height:950px;border:0;background:#07182d;min-width:0}
#sufz-app .sufz-comic-stage .sufz-comic-side-arrow{pointer-events:auto!important;cursor:pointer!important;appearance:none;-webkit-appearance:none}
#sufz-app .sufz-comic-stage .sufz-comic-side-arrow[hidden]{display:none!important}
#sufz-app .sufz-reaction-emoji{font-size:clamp(38px,5vw,62px)!important;line-height:1.1}
#sufz-app .sufz-reaction{min-height:94px;font-weight:900}
@media(max-width:640px){#sufz-app .sufz-crossword-v24-frame{height:1280px}#sufz-app .sufz-reaction{min-height:85px}}


/* v2.4.1 — Funnies: real arrows, external enlarge control, no text obstruction */
#sufz-app .sufz-comic-tools{display:flex;justify-content:flex-end;align-items:center;min-height:37px;padding:0 1px 8px;background:transparent;}
#sufz-app .sufz-comic-zoom-action{display:inline-flex;align-items:center;justify-content:center;gap:5px;color:#ecf8ff;background:#174d77;border:1px solid #74add0;border-radius:9px;padding:9px 15px;font-size:13px;font-weight:900;cursor:pointer;min-height:38px;line-height:1.1;}
#sufz-app .sufz-comic-zoom-action:hover{background:#246a9d;}
#sufz-app .sufz-comic-zoom-hint{display:none!important;}
#sufz-app .sufz-comic-stage .sufz-comic-side-arrow{z-index:15!important;pointer-events:auto!important;}
#sufz-app .sufz-comic-stage .sufz-comic-side-arrow[aria-disabled="true"]{opacity:.35;}
@media(max-width:640px){
 #sufz-app .sufz-comic-tools{min-height:39px;padding:0 0 7px;}
 #sufz-app .sufz-comic-zoom-action{font-size:12px;min-height:36px;padding:7px 11px;}
 #sufz-app .sufz-comic-stage .sufz-comic-side-arrow{width:38px;height:62px;font-size:42px;}
}

/* v2.4.1 — Crossword owns the full viewing area just as Pic Puzzles does */
#sufz-app:has(.sufz-scene[data-sufz-scene="puzzles"]:not([hidden])) .sufz-workspace{display:block!important;}
#sufz-app:has(.sufz-scene[data-sufz-scene="puzzles"]:not([hidden])) .sufz-sidebar{display:none!important;}
#sufz-app:has(.sufz-scene[data-sufz-scene="puzzles"]:not([hidden])) .sufz-screen{width:100%;max-width:none;padding:0!important;border:0!important;border-radius:14px;overflow:hidden;background:#050c18!important;box-shadow:none!important;}
#sufz-app .sufz-scene[data-sufz-scene="puzzles"]{width:100%;margin:0;padding:0;background:#050c18;}
#sufz-app .sufz-scene[data-sufz-scene="puzzles"]>.sufz-panel-head,
#sufz-app .sufz-scene[data-sufz-scene="puzzles"]>.sufz-focus-controls,
#sufz-app .sufz-scene[data-sufz-scene="puzzles"]>.sufz-scene-title,
#sufz-app .sufz-scene[data-sufz-scene="puzzles"]>.sufz-scene-sub,
#sufz-app .sufz-scene[data-sufz-scene="puzzles"]>.sufz-detail{display:none!important;}
#sufz-app .sufz-crossword-v24{margin:0!important;padding:0!important;width:100%!important;border:0!important;box-shadow:none!important;background:#050c18!important;overflow:hidden;border-radius:0!important;}
#sufz-app .sufz-crossword-v24-frame{width:100%!important;display:block;border:0!important;border-radius:0!important;background:#050c18!important;min-height:480px;}
@media(max-width:640px){#sufz-app .sufz-crossword-v24-frame{min-height:590px;}}

#sufz-app .sufz-comic-image-wrap{position:relative;width:100%;min-width:0;}


/* v2.4.2 — Games use the full Fun Zone workspace, matching Crossword/Pic Puzzles */
#sufz-app:has(.sufz-scene[data-sufz-scene="games"]:not([hidden])) .sufz-workspace{display:block!important;}
#sufz-app:has(.sufz-scene[data-sufz-scene="games"]:not([hidden])) .sufz-sidebar{display:none!important;}
#sufz-app:has(.sufz-scene[data-sufz-scene="games"]:not([hidden])) .sufz-screen{width:100%;max-width:none;border:0!important;padding:0!important;border-radius:14px;overflow:hidden;background:#050c18!important;box-shadow:none!important;}
#sufz-app .sufz-scene[data-sufz-scene="games"]{width:100%;margin:0;padding:0;background:#050c18;}
#sufz-app .sufz-scene[data-sufz-scene="games"]>.sufz-panel-head,
#sufz-app .sufz-scene[data-sufz-scene="games"]>.sufz-focus-controls,
#sufz-app .sufz-scene[data-sufz-scene="games"]>.sufz-scene-title,
#sufz-app .sufz-scene[data-sufz-scene="games"]>.sufz-scene-sub,
#sufz-app .sufz-scene[data-sufz-scene="games"]>.sufz-detail{display:none!important;}
#sufz-app .sufz-game-selector{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px 11px;background:#06192e;}
#sufz-app .sufz-game-choice{display:inline-flex;align-items:center;justify-content:center;padding:10px 18px;border:1px solid #386184;border-radius:9px;color:#c9e1f5;text-decoration:none;font-size:14px;font-weight:850;background:#102842;transition:background .16s;}
#sufz-app .sufz-game-choice:is(:hover,:focus-visible){color:white;background:#25547b;}
#sufz-app .sufz-game-choice.is-current{border-color:#72bcef;color:white;background:#205280;}
#sufz-app .sufz-scene[data-sufz-scene="games"] .sufz-portpanic{width:100%;margin:0;border:0!important;border-radius:0!important;padding:0!important;background:#050c18;}
#sufz-app .sufz-scene[data-sufz-scene="games"] .sufz-portpanic-frame{display:block;width:100%;border:0!important;border-radius:0!important;min-width:0;}
#sufz-app .sufz-scene[data-sufz-scene="games"] .sufz-portpanic-note{padding:8px 16px;margin:0;background:#06192e;}
#sufz-app .sufz-scene[data-sufz-scene="games"] .sufz-leaderboard{margin:14px 12px!important;}
@media(max-width:640px){#sufz-app .sufz-game-selector{padding:7px;gap:6px;}#sufz-app .sufz-game-choice{flex:1 1 120px;font-size:12px;padding:9px 7px;}}

/* v2.6.1 immersive game fallback: allow all available phone screen, even inside a focus scene. */
html.sufz-portpanic-active,html.sufz-portpanic-active body{overflow:hidden!important;height:100dvh!important}
#sufz-app .sufz-scene.is-focus .sufz-portpanic.is-immersive .sufz-portpanic-frame,#sufz-app .sufz-portpanic.is-immersive .sufz-portpanic-frame{height:100dvh!important;width:100vw!important;min-height:0!important;max-height:none!important}
#sufz-app .sufz-portpanic.is-immersive{position:fixed!important;inset:0!important;z-index:2147483000!important;margin:0!important;border:0!important;height:100dvh!important;width:100vw!important}

/* v2.7.3 — Comic rankings occupy the narrow right mission-control panel. */
#sufz-app .sufz-comic-rank-side{padding:15px 12px!important;min-width:0;}
#sufz-app .sufz-comic-rank-side .sufz-comic-rankings{padding:14px 0 0!important;margin:12px 0 0!important;border-top:1px solid rgba(255,255,255,.18)!important;background:transparent!important;box-shadow:none!important;}
#sufz-app .sufz-comic-rank-side .sufz-comic-rankings h3{font-size:clamp(17px,1.5vw,22px);line-height:1.2;margin:0 0 8px;}
#sufz-app .sufz-comic-rank-side .sufz-ranking-switch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;}
#sufz-app .sufz-comic-rank-side .sufz-ranking-switch button{font-size:10px;padding:9px 2px;}
#sufz-app .sufz-comic-rank-side .sufz-comic-rank-link{gap:7px;flex-wrap:wrap;align-items:flex-start;}
#sufz-app .sufz-comic-rank-side .sufz-comic-rank-thumb{width:67px;height:51px;object-fit:cover;}
#sufz-app .sufz-comic-rank-side .sufz-comic-rank-body{flex:1 1 calc(100% - 76px);min-width:100px;}
#sufz-app .sufz-comic-rank-side .sufz-comic-rank-score{display:block;flex:1 1 100%;padding-left:74px;font-size:12px;}
/* v2.7.3 — Coming-soon Challenge uses vibrant per-letter typography, no edit actions. */
#sufz-app .sufz-challenge-coming{min-height:420px;padding:clamp(22px,5vw,50px) 18px;gap:23px;background:radial-gradient(circle at 48% 14%,#32508c70,transparent 48%),linear-gradient(135deg,#071c39,#18245a 70%,#09182e);border:0!important;box-shadow:none!important;}
#sufz-app .sufz-challenge-coming .sufz-challenge-star{font-size:clamp(38px,6vw,72px);color:#ffd46a;text-shadow:0 0 25px #fa9f4f8c;}
#sufz-app .sufz-challenge-rainbow{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.02em .24em;max-width:920px;margin:0!important;font-size:clamp(36px,5.5vw,76px)!important;font-weight:1000;line-height:1.15;letter-spacing:-.04em;text-shadow:0 4px 2px rgba(0,0,0,.25);}
#sufz-app .sufz-challenge-rainbow .sufz-rainbow-word{display:inline-flex;white-space:nowrap;}
#sufz-app .sufz-challenge-rainbow .sufz-rainbow-word span{display:inline-block;color:hsl(calc(320deg + var(--letter-index)*56deg),100%,73%);filter:drop-shadow(0 2px 1px rgba(0,0,0,.17));}
#sufz-app .sufz-rainbow-gap{width:.28em;}
#sufz-app .sufz-challenge-soon-sub{font-size:clamp(22px,3.1vw,35px)!important;font-weight:950;color:#f8fbff!important;line-height:1.35;text-shadow:0 2px 12px #001829;margin:0!important;}
@media(max-width:570px){#sufz-app .sufz-challenge-rainbow{font-size:clamp(28px,8vw,50px)!important;}#sufz-app .sufz-challenge-coming{min-height:325px;gap:17px;}#sufz-app .sufz-comic-rank-side .sufz-comic-rank-score{flex-basis:auto;padding-left:0;}}

/* v2.7.4 — actual crossword content height comes from its iframe, not a fixed 950/1280px canvas */
#sufz-app .sufz-scene[data-sufz-scene="puzzles"] .sufz-crossword-v24-frame{height:660px;min-height:0!important;max-height:none!important;}
@media(max-width:640px){#sufz-app .sufz-scene[data-sufz-scene="puzzles"] .sufz-crossword-v24-frame{height:820px;min-height:0!important;}}

/* v2.7.5 -- clear arcade game switcher; never render WP link underlines */
#sufz-app .sufz-game-selector {display:flex!important;gap:12px!important;align-items:stretch!important;justify-content:center!important;background:transparent!important;border:0!important;padding:8px 8px 13px!important;flex-wrap:wrap!important}
#sufz-app .sufz-game-selector a.sufz-game-choice,
#sufz-app .sufz-game-selector a.sufz-game-choice:link,
#sufz-app .sufz-game-selector a.sufz-game-choice:visited {display:flex!important;gap:10px;align-items:center;justify-content:center;min-width:198px;min-height:52px;padding:12px 24px!important;border:1px solid #4389b9!important;border-radius:15px!important;background:linear-gradient(135deg,#183d65,#09233e)!important;box-shadow:inset 0 1px #ffffff29,0 5px 13px #0004;color:#eef9ff!important;text-decoration:none!important;text-decoration-line:none!important;text-underline-offset:initial!important;font-size:clamp(15px,1.5vw,19px)!important;font-weight:900!important;letter-spacing:.01em;transition:transform .16s,box-shadow .16s,filter .16s!important}
#sufz-app .sufz-game-choice .sufz-choice-title {text-decoration:none!important;border-bottom:0!important;line-height:1.2;white-space:nowrap}
#sufz-app .sufz-game-choice .sufz-choice-icon{font-size:24px;line-height:1}
#sufz-app .sufz-game-selector a.sufz-game-choice.is-current{background:linear-gradient(125deg,#1565ad,#184d88 54%,#143b6c)!important;border-color:#9cd5ff!important;box-shadow:0 0 0 1px #6cc8ff65,0 8px 20px #003f7999,inset 0 1px #ffffff55!important}
#sufz-app .sufz-game-selector a.sufz-game-choice:hover,#sufz-app .sufz-game-selector a.sufz-game-choice:focus-visible{transform:translateY(-2px);filter:brightness(1.14);text-decoration:none!important}
@media(max-width:570px){#sufz-app .sufz-game-selector{gap:7px!important;padding:5px 0 10px!important}#sufz-app .sufz-game-selector a.sufz-game-choice{min-width:0;flex:1 1 45%;padding:10px 8px!important;font-size:13px!important;min-height:49px;gap:6px}#sufz-app .sufz-game-choice .sufz-choice-icon{font-size:20px}}
