/* CoursePilot iOS 27 concept — preview branch only.
   Inspired by Apple's 2026 Liquid Glass refinements; web approximation. */
:root{--ios-glass-strength:.78;--ios-ink:#17263e;--ios-blue:#3268ec;--ios-edge:rgba(255,255,255,.85);--ios-frost:rgba(255,255,255,var(--ios-glass-strength))}
html{scroll-behavior:smooth}
body{background:#f0f4fb!important;background-image:radial-gradient(ellipse at 9% 0%,rgba(124,170,252,.23),transparent 49%),radial-gradient(ellipse at 100% 42%,rgba(183,147,246,.14),transparent 42%)!important;background-attachment:fixed!important;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",sans-serif!important;letter-spacing:-.012em}
body.dark{--ios-ink:#eef3ff;--ios-edge:rgba(255,255,255,.15);--ios-frost:rgba(27,36,55,var(--ios-glass-strength));background:#0c1220!important;background-image:radial-gradient(ellipse at 15% 0%,rgba(48,90,175,.20),transparent 51%),radial-gradient(ellipse at 95% 70%,rgba(116,71,187,.15),transparent 48%)!important}
#app .app{max-width:1240px}
#app .top{position:relative!important;min-height:80px;margin-bottom:19px;padding:13px 17px;border-radius:28px;background:var(--ios-frost);-webkit-backdrop-filter:blur(30px) saturate(180%);backdrop-filter:blur(30px) saturate(180%);box-shadow:0 14px 45px rgba(40,66,110,.07),inset 0 1px 0 var(--ios-edge);border:1px solid rgba(255,255,255,.6)}
body.dark #app .top{border-color:rgba(255,255,255,.12)}
#app .top .brand h1{font-size:23px;font-weight:800;letter-spacing:-.06em}
#app .top .brand p{font-size:12px;letter-spacing:-.012em}
#app .logo{height:49px;width:49px;border-radius:17px!important;box-shadow:0 9px 22px rgba(38,92,201,.24),inset 0 1px 1px rgba(255,255,255,.68)!important}
#app .card,#app .authCard,#app .settingsCard,#app .stat,#app .insightCard,#app .briefCard{border-radius:25px!important;border:1px solid rgba(255,255,255,.80)!important;background:var(--ios-frost)!important;-webkit-backdrop-filter:blur(22px) saturate(160%);backdrop-filter:blur(22px) saturate(160%);box-shadow:0 9px 34px rgba(37,67,120,.075),inset 0 1px 0 var(--ios-edge)!important}
body.dark #app .card,body.dark #app .authCard,body.dark #app .settingsCard,body.dark #app .stat{border-color:rgba(255,255,255,.13)!important}
#app .stat{padding:20px!important;min-height:107px}
#app .stat .l{font-size:12px;font-weight:650;color:var(--muted)}
#app .stat .v{font-size:24px;font-weight:790;letter-spacing:-.05em}
#app h2,#app h3{letter-spacing:-.045em;font-weight:750}
#app .btn,#app .iconBtn,#app .pill,#app button{touch-action:manipulation}
#app .btn,#app .iconBtn{border-radius:15px!important;min-height:39px}
#app .btn.primary{background:linear-gradient(155deg,#4b85ff,#285ddd)!important;color:white!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 6px 16px rgba(57,111,232,.20),inset 0 1px 0 rgba(255,255,255,.38)!important}
#app .pill{border-radius:999px!important;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
#app .pill.active{background:rgba(69,124,242,.18)!important;color:#346ae6!important;border-color:rgba(75,133,248,.25)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
body.dark #app .pill.active{color:#b3ceff!important}
#app .tabs{gap:6px;padding:6px;border:1px solid rgba(255,255,255,.6);background:var(--ios-frost);-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px);border-radius:19px;overflow-x:auto}
#app .tab{border-radius:13px;padding:9px 13px;border:0!important;font-size:13px;font-weight:650}
#app .tab.active{background:rgba(79,125,230,.14);color:var(--accent)!important}
#app .item{border-radius:19px!important}
#app .modal{border-radius:27px!important;background:var(--ios-frost)!important;-webkit-backdrop-filter:blur(32px) saturate(150%);backdrop-filter:blur(32px) saturate(150%);border:1px solid var(--ios-edge)!important}
#app input,#app select,#app textarea{border-radius:13px}
#cpIos27PreviewRibbon{position:fixed;z-index:180;top:max(10px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:9px;padding:7px 13px;border:1px solid rgba(255,255,255,.7);border-radius:999px;background:rgba(37,65,124,.85);color:white;box-shadow:0 9px 24px #162e5e35;-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);font:700 11px/1.3 -apple-system,sans-serif;pointer-events:none;white-space:nowrap}
#cpIos27GlassControl{position:fixed;right:18px;bottom:110px;z-index:175;padding:12px 15px;border-radius:22px;border:1px solid rgba(255,255,255,.75);background:var(--ios-frost);-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);box-shadow:0 12px 32px #182a4a25;font:600 12px -apple-system,sans-serif;color:var(--text);display:flex;align-items:center;gap:12px}
#cpIos27GlassControl input{accent-color:#487cf1;width:95px}
@media(max-width:760px){
 html,body{overscroll-behavior-x:none}
 #app .app{padding:calc(16px + env(safe-area-inset-top)) 13px calc(130px + env(safe-area-inset-bottom))!important}
 #app .top{border-radius:25px!important;padding:15px 15px!important;margin-top:20px}
 #app .brand h1{font-size:22px!important}
 #app .brand p{font-size:11px}
 #app .stats{gap:10px!important}
 #app .stat{padding:16px!important;min-height:105px;border-radius:22px!important}
 #app .stat .v{font-size:21px}
 #app .card{border-radius:23px!important}
 #app .mobileNav{display:grid!important;position:fixed!important;left:11px!important;right:11px!important;width:auto!important;max-width:none!important;bottom:max(9px,env(safe-area-inset-bottom))!important;z-index:100!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:2px!important;padding:7px 5px!important;overflow:hidden!important;border-radius:30px!important;border:1px solid rgba(255,255,255,.88)!important;background:rgba(250,252,255,.79)!important;-webkit-backdrop-filter:blur(40px) saturate(185%)!important;backdrop-filter:blur(40px) saturate(185%)!important;box-shadow:0 16px 46px rgba(30,55,107,.24),inset 0 1.5px 0 rgba(255,255,255,.95)!important}
 body.dark #app .mobileNav{background:rgba(29,36,53,.82)!important;border-color:rgba(255,255,255,.19)!important}
 #app .mobileNav button{border:0!important;border-radius:22px!important;padding:10px 0 7px!important;min-width:0!important;min-height:57px!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:transparent!important;color:var(--muted)!important;font-size:9px!important;font-weight:650!important;transition:background .23s cubic-bezier(.2,.85,.2,1),transform .23s ease!important}
 #app .mobileNav button .mi{font-size:21px!important;line-height:23px!important}
 #app .mobileNav button.active{color:var(--accent)!important;background:rgba(69,116,226,.15)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.55)!important}
 #app .mobileNav button:active{transform:scale(.92)}
 #cpIos27PreviewRibbon{top:max(3px,env(safe-area-inset-top));font-size:10px;padding:5px 11px}
 #cpIos27GlassControl{bottom:calc(91px + env(safe-area-inset-bottom));right:13px;padding:9px 12px;border-radius:16px}
 #cpIos27GlassControl input{width:72px}
 #app .sembar{padding-top:4px}
}
@media(prefers-reduced-motion:reduce){#app .mobileNav button{transition:none!important}}
@media(prefers-reduced-transparency:reduce){#app .card,#app .mobileNav,#app .top{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:var(--card)!important}}