:root{--iota-teal:#0bb9b2;--iota-teal2:#19d2c8;--iota-violet:#8868f2;--iota-ink:#183746;--iota-soft:#f3fbfa;--iota-shadow:0 18px 50px rgba(22,72,83,.12)}
html{scroll-behavior:smooth}body{background:radial-gradient(circle at 8% 5%,#d9fffb 0,transparent 28%),radial-gradient(circle at 92% 12%,#eee9ff 0,transparent 26%),linear-gradient(145deg,#f7fffe,#f7f7ff)!important;background-attachment:fixed}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:radial-gradient(circle,#6edfd5 1px,transparent 1px),radial-gradient(circle,#b8a8ff 1px,transparent 1px);background-size:44px 44px,61px 61px;background-position:0 0,22px 17px;opacity:.18}
.wrap{animation:iotaPageIn .42s cubic-bezier(.2,.75,.25,1)}@keyframes iotaPageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.card,.mini-card,.today-card{border:1px solid rgba(255,255,255,.9)!important;box-shadow:var(--iota-shadow)!important;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.card:hover,.mini-card:hover{transform:translateY(-3px);box-shadow:0 22px 55px rgba(50,78,105,.16)!important}
.btn{transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}.btn:active{transform:scale(.97)}.btn.green{background:linear-gradient(135deg,var(--iota-teal),#08a88d)!important;box-shadow:0 8px 22px rgba(11,185,178,.25)}
.hero{position:relative;overflow:hidden;min-height:180px!important;padding-right:min(44vw,440px)!important;background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(238,255,252,.9))!important;box-shadow:var(--iota-shadow)!important}
.hero:after{content:"";position:absolute;right:-12px;top:0;width:min(46%,430px);height:100%;background:url('/iota_hero_110.webp?v=110') center/cover no-repeat;opacity:.96;mask-image:linear-gradient(90deg,transparent,#000 18%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%)}
.hero>div{position:relative;z-index:1}.hero h1{font-size:clamp(28px,5vw,44px)!important}.hero p{max-width:620px;line-height:1.55}
.iota-progress{position:fixed;left:0;top:0;height:4px;width:0;background:linear-gradient(90deg,var(--iota-teal),var(--iota-violet));z-index:99999;box-shadow:0 1px 10px rgba(91,78,238,.35);transition:width .08s linear}
.iota-loader-overlay{position:fixed;inset:0;z-index:100000;display:grid;place-items:center;background:rgba(244,255,253,.86);backdrop-filter:blur(10px);opacity:0;visibility:hidden;transition:.22s}
.iota-loader-overlay.on{opacity:1;visibility:visible}.iota-load-card{width:min(88vw,360px);padding:28px 25px 24px;border-radius:28px;background:#ffffffed;box-shadow:0 26px 80px rgba(23,72,82,.18);text-align:center;border:1px solid #fff}
.iota-load-logo{width:104px;height:104px;margin:auto;background:url('/iota_icon_110.webp?v=110') center/contain no-repeat;animation:iotaFloat 1.55s ease-in-out infinite}
.iota-load-ring{width:54px;height:54px;margin:8px auto 14px;border-radius:50%;border:5px solid #dbf5f2;border-top-color:var(--iota-violet);border-right-color:var(--iota-teal);animation:iotaSpin .8s linear infinite}
.iota-load-card b{display:block;font-size:21px;color:var(--iota-ink)}.iota-load-card span{display:block;margin-top:7px;color:#718793;line-height:1.4}
.iota-pulse{display:flex;justify-content:center;gap:7px;margin-top:14px}.iota-pulse i{width:9px;height:9px;border-radius:50%;background:var(--iota-violet);animation:iotaDot 1.1s ease-in-out infinite}.iota-pulse i:nth-child(2){animation-delay:.15s}.iota-pulse i:nth-child(3){animation-delay:.3s}
@keyframes iotaSpin{to{transform:rotate(360deg)}}@keyframes iotaFloat{50%{transform:translateY(-7px) rotate(2deg)}}@keyframes iotaDot{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-7px)}}
.iota-scroll-hint{position:fixed;left:50%;bottom:18px;z-index:9990;transform:translate(-50%,25px);opacity:0;pointer-events:none;display:flex;align-items:center;gap:10px;padding:10px 15px;border-radius:999px;background:#182f3de8;color:white;box-shadow:0 12px 34px #132d3d33;font-size:13px;font-weight:850;transition:.3s}
.iota-scroll-hint.on{opacity:1;transform:translate(-50%,0)}.iota-scroll-arrow{font-size:22px;line-height:1;animation:iotaDown 1.2s infinite}@keyframes iotaDown{50%{transform:translateY(5px)}}
.iota-update-btn{position:fixed;right:16px;bottom:18px;z-index:9988;border:0;border-radius:999px;padding:11px 15px;background:linear-gradient(135deg,#7057dc,#9879ff);color:white;font:800 13px/1 system-ui;box-shadow:0 12px 32px rgba(84,61,181,.25);cursor:pointer;display:flex;align-items:center;gap:7px}
.iota-update-btn:active{transform:scale(.97)}
.iota-skeleton{position:relative;overflow:hidden;background:#edf4f4!important;color:transparent!important;border-color:transparent!important}.iota-skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);animation:iotaShimmer 1.3s infinite}@keyframes iotaShimmer{100%{transform:translateX(100%)}}
.progress{overflow:hidden!important;background:#e8f2f2!important}.progress span{background:linear-gradient(90deg,var(--iota-teal),#64dccc,var(--iota-violet))!important;position:relative;overflow:hidden}.progress span:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.6) 50%,transparent 65%);animation:iotaSweep 2.4s infinite}@keyframes iotaSweep{from{transform:translateX(-120%)}to{transform:translateX(120%)}}
#studyCycleCard{position:relative;overflow:hidden}#studyCycleCard:before{content:"⏱️";position:absolute;right:18px;bottom:-8px;font-size:76px;opacity:.09;animation:iotaFloat 2s ease-in-out infinite}
#studyCycleCard[data-iota-state="break"]{background:linear-gradient(135deg,#f4edff,#fff)!important;border-color:#ded0ff!important}#studyCycleCard[data-iota-state="study"]{background:linear-gradient(135deg,#e8fffb,#fff)!important;border-color:#b8eee7!important}#studyCycleCard[data-iota-state="done"]{background:linear-gradient(135deg,#fff8d9,#fff)!important;border-color:#f7dc75!important}
.iota-confetti{position:fixed;top:-20px;width:9px;height:15px;border-radius:3px;z-index:99998;pointer-events:none;animation:iotaConfetti 1.8s ease-in forwards}@keyframes iotaConfetti{to{transform:translate(var(--dx),105vh) rotate(720deg);opacity:.1}}
.iota-toast{position:fixed;left:50%;top:18px;z-index:100005;transform:translate(-50%,-20px);opacity:0;background:#173448;color:#fff;border-radius:16px;padding:12px 16px;box-shadow:0 14px 34px #17344833;font-weight:800;transition:.25s}.iota-toast.on{opacity:1;transform:translate(-50%,0)}
@media(max-width:700px){.hero{padding-right:20px!important;padding-bottom:150px!important}.hero:after{top:auto;bottom:0;right:0;width:100%;height:145px;background-position:center 54%;mask-image:linear-gradient(0deg,#000,transparent);-webkit-mask-image:linear-gradient(0deg,#000,transparent)}.iota-update-btn{bottom:72px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}
