*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif}button,input,textarea,select{font:inherit}button{border:0;background:transparent;color:inherit;padding:0}h1,h2,p{margin:0}.hidden{display:none!important}.page-container{height:100dvh;position:relative;overflow:hidden;color:var(--text-main);background:var(--main-bg)}.theme-black{--main-bg:linear-gradient(145deg,#f3f4f8 0%,#fff 55%,#eceef5 100%);--card-bg:rgba(255,255,255,.92);--text-main:#111;--text-sub:#8a8a8e;--primary:#111;--primary-text:#fff;--tag-bg:#f0f0f3;--orb-one:rgba(0,0,0,.05);--orb-two:rgba(0,0,0,.035)}.theme-cream{--main-bg:linear-gradient(145deg,#fbf5ea 0%,#fffaf2 55%,#f0dfc9 100%);--card-bg:rgba(255,250,242,.92);--text-main:#2b2118;--text-sub:#9b8170;--primary:#5a3e2b;--primary-text:#fff;--tag-bg:#f2e5d4;--orb-one:rgba(174,126,73,.18);--orb-two:rgba(255,255,255,.6)}.theme-pink{--main-bg:linear-gradient(145deg,#fff1f5 0%,#fff 50%,#ffd6e3 100%);--card-bg:rgba(255,255,255,.92);--text-main:#3a2028;--text-sub:#b47b8d;--primary:#e75c8d;--primary-text:#fff;--tag-bg:#ffe2eb;--orb-one:rgba(231,92,141,.18);--orb-two:rgba(255,182,208,.22)}.theme-blue{--main-bg:linear-gradient(145deg,#eef5ff 0%,#fff 55%,#d9e8ff 100%);--card-bg:rgba(255,255,255,.92);--text-main:#132033;--text-sub:#6e83a5;--primary:#1f4b99;--primary-text:#fff;--tag-bg:#dfeaff;--orb-one:rgba(31,75,153,.16);--orb-two:rgba(100,156,255,.18)}.theme-purple{--main-bg:linear-gradient(145deg,#f4f0ff 0%,#fff 50%,#ddd2ff 100%);--card-bg:rgba(255,255,255,.92);--text-main:#211936;--text-sub:#7d6ba8;--primary:#6c4bd8;--primary-text:#fff;--tag-bg:#ece5ff;--orb-one:rgba(108,75,216,.17);--orb-two:rgba(193,173,255,.2)}.bg-orb{position:fixed;border-radius:50%;z-index:0;filter:blur(4px);pointer-events:none}.orb-one{width:180px;height:180px;right:-60px;top:65px;background:var(--orb-one)}.orb-two{width:210px;height:210px;left:-80px;bottom:80px;background:var(--orb-two)}.main-view{height:100%;max-width:520px;margin:0 auto;display:flex;flex-direction:column;padding:0 20px;position:relative;z-index:1;overflow:hidden}.header{padding:max(48px,env(safe-area-inset-top) + 34px) 0 11px;display:flex;flex-direction:column;gap:10px;flex-shrink:0}.header-top{display:flex;position:relative}.header-title-block{min-width:0;flex:1}.header-title-row{display:flex;align-items:center;gap:9px;flex-wrap:nowrap;padding-top:2px}.header-title{font-size:30px;font-weight:900;line-height:1.1;white-space:nowrap;letter-spacing:-1.4px}.switch-tab-btn{background:var(--card-bg);border-radius:999px;padding:6px 11px;box-shadow:0 4px 9px rgba(0,0,0,.04);font-size:12px;font-weight:800;white-space:nowrap}.header-subtitle{margin-top:7px;font-size:13px;color:var(--text-sub);font-weight:600}.theme-btn{position:absolute;top:0;right:90px;padding:7px 11px;background:var(--card-bg);border-radius:999px;font-size:12px;font-weight:800;box-shadow:0 5px 12px rgba(0,0,0,.05);white-space:nowrap;z-index:5}.dashboard-card{background:var(--card-bg);border-radius:17px;padding:14px 15px;box-shadow:0 10px 25px rgba(0,0,0,.06);backdrop-filter:blur(20px)}.dashboard-top{display:flex;justify-content:space-between;align-items:flex-start}.dashboard-label{display:block;font-size:12px;color:var(--text-sub);font-weight:800;margin-bottom:3px}.dashboard-date{display:block;font-size:14px;font-weight:850}.year-widget{display:flex;flex-direction:column;align-items:flex-end}.year-num{font-size:26px;font-weight:900;line-height:1}.year-text{margin-top:4px;font-size:12px;color:var(--text-sub);font-weight:800}.year-progress-bar{margin-top:12px;height:7px;background:var(--tag-bg);border-radius:999px;overflow:hidden}.year-progress-inner{height:100%;width:0;background:var(--primary);border-radius:999px}.header-actions{display:flex;width:100%;gap:6px}.primary-btn{flex:1;height:42px;background:var(--primary);color:var(--primary-text);border-radius:15px;font-size:15px;font-weight:900;display:flex;justify-content:center;align-items:center;box-shadow:0 8px 17px rgba(0,0,0,.15)}.btn-plus{font-size:20px;margin-right:5px;line-height:1;font-weight:400}.secondary-btn{width:90px;height:42px;background:var(--card-bg);border-radius:15px;font-size:13px;font-weight:900;display:flex;justify-content:center;align-items:center;box-shadow:0 6px 13px rgba(0,0,0,.055)}.backup-btn{width:65px}.primary-btn:active,.secondary-btn:active,.switch-tab-btn:active,.theme-btn:active,.category-pill:active,.schedule-mode-btn:active,.count-card:active,.festival-card:active,.checklist-card:active,.save-btn:active{transform:scale(.985);opacity:.88}.category-scroll{overflow-x:auto;white-space:nowrap;margin-bottom:4px;flex-shrink:0;scrollbar-width:none}.category-scroll::-webkit-scrollbar{display:none}.category-row{display:inline-flex;gap:8px;padding-right:5px}.category-pill{display:inline-flex;align-items:center;justify-content:center;height:31px;padding:0 13px;border-radius:999px;background:var(--card-bg);font-size:12px;font-weight:800;box-shadow:0 4px 10px rgba(0,0,0,.04)}.category-pill-active{background:var(--primary);color:var(--primary-text)}.schedule-view-switch{display:flex;gap:8px;flex-shrink:0}.schedule-mode-btn{height:31px;padding:0 15px;border-radius:999px;background:var(--card-bg);font-size:13px;font-weight:900;box-shadow:0 4px 10px rgba(0,0,0,.04)}.schedule-mode-active{background:var(--primary);color:var(--primary-text)}.content{min-height:0;flex:1;position:relative}.tab-panel{display:none;height:100%}.tab-panel.active{display:block}.list-container{height:100%;overflow-y:auto;padding-bottom:104px;scrollbar-width:none}.list-container::-webkit-scrollbar{display:none}.count-card,.checklist-card,.festival-card{background:var(--card-bg);border-radius:18px;padding:15px;display:flex;align-items:center;margin-bottom:12px;box-shadow:0 9px 20px rgba(0,0,0,.045);backdrop-filter:blur(20px)}.count-icon-box{width:44px;height:44px;border-radius:13px;background:var(--tag-bg);display:flex;align-items:center;justify-content:center;margin-right:12px;flex-shrink:0}.count-icon{font-size:28px}.count-info{flex:1;overflow:hidden}.count-title-row{display:flex;align-items:center;margin-bottom:5px}.count-title{font-size:17px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pin-icon{font-size:12px;margin-left:5px;flex-shrink:0}.count-date{font-size:12px;color:var(--text-sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tag-row{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.tag{background:var(--tag-bg);color:var(--text-sub);font-size:10px;padding:3px 7px;border-radius:999px;font-weight:700}.progress-line{margin-top:8px;height:6px;border-radius:999px;background:var(--tag-bg);overflow:hidden}.progress-inner{height:100%;background:var(--primary);border-radius:999px}.count-number-box{min-width:56px;display:flex;flex-direction:column;align-items:flex-end;justify-content:center}.count-number{font-size:30px;font-weight:900;line-height:1;margin-bottom:4px}.future-color{color:var(--text-main)}.past-color{color:#b2b2b8}.count-unit{font-size:12px;color:var(--text-sub)}.schedule-container{background:var(--card-bg);border-radius:15px;overflow:hidden;border:1px solid var(--theme-line);box-shadow:0 8px 18px rgba(0,0,0,.05)}.schedule-header-row,.schedule-row{display:flex;width:100%;min-height:44px;border-bottom:1px solid var(--theme-line)}.schedule-header-row{background:var(--tag-bg);font-weight:900}.schedule-cell{display:flex;justify-content:center;align-items:center;padding:9px 5px;font-size:12px;border-right:1px solid var(--theme-line);text-align:center;word-break:break-all;line-height:1.35}.schedule-cell:last-child{border-right:none}.date-cell{flex:.85;font-weight:800}.title-cell{flex:1.5}.task-cell{flex:1.35}.note-cell{flex:1.2;color:var(--text-sub)}.done-cell{flex:.75}.check-box{width:21px;height:21px;border-radius:6px;display:flex;justify-content:center;align-items:center;font-size:12px;font-weight:900}.unchecked{color:#b7b7bd}.checked{background:var(--primary);color:var(--primary-text)}.expired{background:#e5e5ea;color:#777}.past-toggle-row{min-height:41px;background:var(--tag-bg);display:flex;justify-content:center;align-items:center;font-size:12px;color:var(--text-sub);font-weight:800;border-bottom:1px solid var(--theme-line)}.past-row{opacity:.62}.past-row .title-cell,.past-row .task-cell{text-decoration:line-through}.timeline-container{padding:4px 0 40px}.timeline-month{margin-bottom:22px}.month-title{font-size:18px;font-weight:900;margin-bottom:12px}.timeline-item{display:flex;margin-bottom:13px}.timeline-left{width:45px;display:flex;flex-direction:column;align-items:center;position:relative}.timeline-day{font-size:16px;font-weight:900;margin-bottom:8px}.timeline-dot{width:9px;height:9px;background:var(--primary);border-radius:50%;box-shadow:0 0 0 5px var(--tag-bg);z-index:2}.timeline-left::after{content:"";position:absolute;top:33px;bottom:-19px;width:1px;background:rgba(0,0,0,.12)}.timeline-card{flex:1;background:var(--card-bg);border-radius:16px;padding:15px 16px;box-shadow:0 7px 16px rgba(0,0,0,.045);display:flex;flex-direction:column}.timeline-title{font-size:16px;font-weight:900;margin-bottom:5px}.timeline-desc{font-size:13px;margin-bottom:4px;font-weight:600}.timeline-note{font-size:12px;color:var(--text-sub)}.checklist-card{display:block}.checklist-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.checklist-title{display:block;font-size:17px;font-weight:900;margin-bottom:5px}.checklist-note{display:block;font-size:12px;color:var(--text-sub)}.checklist-count{font-size:14px;font-weight:900}.checklist-progress{margin-top:12px;height:6px;border-radius:999px;background:var(--tag-bg);overflow:hidden}.checklist-progress-inner{height:100%;background:var(--primary);border-radius:999px}.checklist-items{margin-top:12px;display:flex;flex-direction:column;gap:9px}.checklist-item{display:flex;align-items:center}.check-dot{width:19px;height:19px;border-radius:6px;background:var(--tag-bg);color:var(--primary-text);display:flex;justify-content:center;align-items:center;margin-right:8px;font-size:11px;font-weight:900}.check-dot-done{background:var(--primary)}.check-text{font-size:14px;font-weight:600}.check-text-done{color:var(--text-sub);text-decoration:line-through}.calendar-panel{background:var(--card-bg);border-radius:19px;padding:17px 14px;box-shadow:0 9px 20px rgba(0,0,0,.045)}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.calendar-title{font-size:18px;font-weight:900}.calendar-nav-btn{width:31px;height:31px;border-radius:50%;background:var(--tag-bg);font-size:21px;font-weight:800;display:flex;justify-content:center;align-items:center}.calendar-week-row{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:8px}.calendar-week-row span{text-align:center;color:var(--text-sub);font-size:12px;font-weight:800}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.calendar-day{height:41px;border-radius:11px;background:rgba(255,255,255,.35);display:flex;flex-direction:column;align-items:center;justify-content:center}.calendar-day.today{background:var(--primary);color:var(--primary-text)}.calendar-day-num{font-size:13px;font-weight:800}.calendar-dot-row{margin-top:4px;display:flex;gap:3px}.calendar-dot{width:5px;height:5px;border-radius:50%;display:inline-block}.event-dot{background:#111}.schedule-dot{background:#9b9ba3}.calendar-day.today .event-dot,.calendar-day.today .schedule-dot{background:#fff}.calendar-legend{margin-top:14px;display:flex;gap:14px;justify-content:center}.legend-item{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text-sub);font-weight:800}.festival-hero{background:#111;color:#fff;border-radius:21px;padding:21px 18px;margin-bottom:14px;box-shadow:0 12px 30px rgba(0,0,0,.18)}.festival-hero-label{display:block;font-size:12px;opacity:.65;font-weight:800;margin-bottom:9px}.festival-hero-title{display:block;font-size:24px;font-weight:900;margin-bottom:7px}.festival-hero-date{display:block;font-size:13px;opacity:.75}.festival-hero-count{margin-top:17px;display:flex;align-items:flex-end}.festival-hero-num{font-size:44px;font-weight:900;line-height:1}.festival-hero-unit{font-size:14px;font-weight:800;margin-left:6px;margin-bottom:5px;opacity:.8}.festival-left{display:flex;align-items:center;min-width:0;flex:1}.festival-icon-box{width:43px;height:43px;border-radius:13px;background:var(--tag-bg);display:flex;justify-content:center;align-items:center;margin-right:11px;flex-shrink:0}.festival-icon{font-size:25px}.festival-info{min-width:0;flex:1}.festival-name{display:block;font-size:16px;font-weight:900;margin-bottom:4px}.festival-date{display:block;font-size:12px;color:var(--text-sub);margin-bottom:5px}.festival-tag{display:inline-flex;background:var(--tag-bg);color:var(--text-sub);font-size:10px;padding:3px 7px;border-radius:999px;font-weight:800}.festival-right{min-width:50px;display:flex;flex-direction:column;align-items:flex-end}.festival-days{font-size:26px;line-height:1;font-weight:900;margin-bottom:4px}.festival-unit{font-size:11px;color:var(--text-sub);font-weight:800}.empty-state{margin-top:60px;display:flex;flex-direction:column;align-items:center;color:#aaa}.empty-illustration{width:85px;height:85px;border-radius:50%;background:var(--card-bg);display:flex;justify-content:center;align-items:center;font-size:39px;margin-bottom:17px;box-shadow:0 10px 25px rgba(0,0,0,.06)}.empty-title{font-size:17px;font-weight:900;color:var(--text-main);margin-bottom:7px}.empty-desc{font-size:13px;color:var(--text-sub)}.add-page{position:fixed;left:50%;top:0;bottom:0;transform:translateX(-50%);width:100%;max-width:520px;z-index:50;background:var(--main-bg);padding:0 20px;overflow-y:auto}.add-nav{padding-top:max(56px,env(safe-area-inset-top) + 38px);height:94px;display:flex;justify-content:space-between;align-items:center}.cancel-text{color:var(--text-sub);font-size:16px;font-weight:700}.add-nav-title{font-size:16px;font-weight:900}.nav-placeholder{color:transparent;font-size:16px}.add-hero{display:flex;flex-direction:column;align-items:center;margin-top:18px;margin-bottom:24px}.add-icon-box{width:84px;height:84px;background:var(--card-bg);border-radius:22px;display:flex;justify-content:center;align-items:center;box-shadow:0 13px 29px rgba(0,0,0,.065)}.add-huge-icon{font-size:46px}.add-tip{margin-top:10px;color:var(--text-sub);font-size:12px}.form-card{background:var(--card-bg);border-radius:16px;padding:4px 19px;margin-bottom:17px;box-shadow:0 7px 15px rgba(0,0,0,.035)}.form-row{min-height:52px;display:flex;justify-content:space-between;align-items:center}.form-line{height:1px;background:rgba(0,0,0,.07);margin-left:35px}.row-label{font-size:16px;font-weight:800;flex-shrink:0}.row-input,.row-select,.row-textarea{flex:1;margin-left:18px;text-align:right;font-size:16px;color:var(--text-main);background:transparent;border:0;outline:0;min-width:0}.row-select{direction:rtl}.row-textarea{text-align:left;min-height:70px;padding:12px 0;resize:none}.input-placeholder{color:#b8b8bd}.checklist-form-title{font-size:16px;font-weight:900;padding:14px 0 9px}.subitem-input-row{display:flex;align-items:center;gap:9px;padding-bottom:12px}.subitem-input{flex:1;height:38px;background:var(--tag-bg);border-radius:12px;padding:0 12px;border:0;outline:0;font-size:14px}.subitem-add-btn{width:56px;height:38px;background:var(--primary);color:var(--primary-text);border-radius:12px;font-size:13px;font-weight:900}.draft-subitem-list{display:flex;flex-direction:column;gap:8px;padding:4px 0 14px}.draft-subitem{display:flex;align-items:center;background:var(--tag-bg);border-radius:12px;padding:8px 9px}.draft-subitem-index{width:21px;height:21px;border-radius:50%;background:var(--card-bg);color:var(--text-sub);display:flex;justify-content:center;align-items:center;font-size:11px;font-weight:900;margin-right:8px;flex-shrink:0}.draft-subitem-input{flex:1;font-size:14px;font-weight:600;border:0;background:transparent;outline:0}.draft-subitem-delete{margin-left:8px;color:#ff3b30;font-size:12px;font-weight:900;flex-shrink:0}.draft-empty-tip{padding:8px 0 15px;color:var(--text-sub);font-size:13px}.save-btn{width:100%;margin-top:27px;margin-bottom:80px;height:46px;background:var(--primary);color:var(--primary-text);border-radius:16px;display:flex;justify-content:center;align-items:center;font-size:17px;font-weight:900;box-shadow:0 9px 20px rgba(0,0,0,.16)}.mask{position:fixed;left:0;right:0;top:0;bottom:0;z-index:999;background:rgba(0,0,0,.48);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center}.tab-picker-panel,.backup-panel,.emoji-panel{width:min(86%,448px);max-height:82dvh;background:rgba(255,255,255,.98);border-radius:22px;padding:19px 15px;overflow-y:auto;box-shadow:0 17px 36px rgba(0,0,0,.22)}.tab-picker-title,.emoji-header{font-size:18px;font-weight:900;color:#111;margin-bottom:14px;text-align:center}.tab-picker-item{width:100%;display:flex;align-items:center;padding:12px 11px;border-radius:14px;margin-bottom:7px;background:#f4f4f6;text-align:left}.tab-picker-active{background:#111}.tab-picker-active b,.tab-picker-active em,.tab-picker-active .tab-picker-check{color:#fff}.tab-picker-icon{width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.7);display:flex;justify-content:center;align-items:center;font-size:18px;margin-right:10px;flex-shrink:0}.tab-picker-text{flex:1;min-width:0}.tab-picker-text b{display:block;font-size:15px;font-weight:900;color:#111;margin-bottom:3px}.tab-picker-text em{display:block;font-style:normal;font-size:12px;color:#888}.tab-picker-check{display:none;font-size:17px;font-weight:900;color:#111;margin-left:9px}.tab-picker-active .tab-picker-check{display:block}.emoji-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px 5px}.emoji-item{font-size:31px;text-align:center;padding:5px 0;border-radius:12px}.emoji-item:active{background:#f2f2f7;transform:scale(.92)}.backup-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.backup-title{font-size:19px;font-weight:900;color:#111}.backup-close{width:29px;height:29px;border-radius:50%;background:#f1f1f4;color:#111;font-size:21px;line-height:29px;text-align:center;font-weight:700}.backup-desc{background:#f5f5f7;color:#777;font-size:12px;line-height:1.6;border-radius:14px;padding:12px;margin-bottom:14px}.backup-section{margin-top:14px}.backup-section-title{font-size:15px;font-weight:900;color:#111;margin-bottom:9px}.backup-main-btn,.restore-btn{width:100%;height:42px;border-radius:14px;background:#111;color:#fff;display:flex;justify-content:center;align-items:center;font-size:14px;font-weight:900;box-shadow:0 8px 17px rgba(0,0,0,.15)}.backup-gap{margin-top:9px}.backup-code-box{margin-top:11px;background:#f5f5f7;border-radius:14px;padding:11px}.backup-code-textarea{width:100%;min-height:90px;font-size:11px;line-height:1.5;color:#333;border:0;background:transparent;resize:none;outline:0}.backup-copy-btn{margin-top:9px;width:100%;height:35px;border-radius:12px;background:#fff;color:#111;font-size:13px;font-weight:800}.restore-textarea{width:100%;min-height:95px;border-radius:14px;background:#f5f5f7;padding:11px;border:0;outline:0;resize:none;font-size:12px;color:#333;line-height:1.5}.restore-btn{margin-top:9px;height:40px}.danger-section{margin-top:18px;padding-top:13px;border-top:1px solid #eee}.clear-data-btn{width:100%;height:38px;border-radius:13px;background:#fff1f1;color:#ff3b30;font-size:13px;font-weight:900}.action-menu{display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.96);border-radius:21px;padding:11px;box-shadow:0 17px 35px rgba(0,0,0,.22)}.action-item{min-width:65px;padding:9px 13px;display:flex;flex-direction:column;align-items:center;justify-content:center}.action-item span{font-size:22px;margin-bottom:5px}.action-item b{font-size:13px;font-weight:800;color:#333}.action-line{width:1px;height:42px;background:rgba(0,0,0,.1)}.action-item.danger b{color:#ff3b30}.detail-overlay{position:fixed;left:0;right:0;top:0;bottom:0;z-index:100;background:rgba(243,244,248,.92);backdrop-filter:blur(18px);display:flex;justify-content:center;align-items:center}.detail-card{width:min(84%,438px);height:68dvh;border-radius:30px;background:#111;overflow:hidden;position:relative;box-shadow:0 22px 44px rgba(0,0,0,.28)}.detail-content{position:relative;z-index:2;height:100%;padding:25px 21px;display:flex;flex-direction:column;justify-content:space-between}.detail-top{display:flex;justify-content:space-between;align-items:flex-start}.detail-text{display:flex;flex-direction:column;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.36)}.detail-title{font-size:21px;font-weight:900;margin-bottom:7px}.detail-date{font-size:14px;opacity:.9;margin-bottom:6px}.detail-days{font-size:18px;font-weight:800;margin-bottom:4px}.detail-repeat{font-size:13px;opacity:.9}.detail-center{flex:1;display:flex;justify-content:center;align-items:center}.detail-big-icon{font-size:85px}.detail-bottom{display:flex;justify-content:flex-start}.detail-back-btn{padding:9px 17px;border-radius:999px;background:rgba(255,255,255,.2);color:#fff;font-size:14px;font-weight:800}@media(max-width:360px){.main-view{padding:0 14px}.header-title{font-size:27px}.theme-btn{right:70px}.secondary-btn{width:78px}.backup-btn{width:56px}.count-card{padding:13px}.count-number{font-size:27px}}

/* 删除底部切换栏后的页面修正 */
.list-container {
  padding-bottom: calc(24px + env(safe-area-inset-bottom)) !important;
}

/* 网站图标与导出 Logo 版本补充 */
/* 表单对齐修复：备注可选填，编辑页更规整 */
.form-row {
  display: grid !important;
  grid-template-columns: 148px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 14px !important;
}

.row-label {
  width: 148px !important;
  flex: none !important;
  white-space: nowrap !important;
  text-align: left !important;
}

.row-input,
.row-select {
  width: 100% !important;
  min-width: 0 !important;
  margin-left: 0 !important;
  text-align: right !important;
  justify-self: stretch !important;
}

.row-input[type="date"],
.row-input[type="time"] {
  text-align: right !important;
  -webkit-appearance: none;
  appearance: none;
}

.row-select {
  text-align-last: right !important;
  direction: ltr !important;
}

.form-line {
  margin-left: 148px !important;
}

@media(max-width: 380px) {
  .form-row {
    grid-template-columns: 128px minmax(0, 1fr) !important;
    column-gap: 10px !important;
  }

  .row-label {
    width: 128px !important;
    font-size: 15px !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }

  .form-line {
    margin-left: 128px !important;
  }
}


/* Header cleanup: remove title dash and move theme button to right */
.header-title::after {
  content: none !important;
  display: none !important;
}

.header-top {
  position: relative !important;
  align-items: flex-start !important;
}

.header-title-row {
  padding-right: 112px !important;
}

.theme-btn {
  right: 0 !important;
  top: 2px !important;
  height: 36px !important;
  min-width: 76px !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 36px !important;
}

.switch-tab-btn {
  height: 36px !important;
  padding: 0 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 36px !important;
}

@media(max-width: 380px) {
  .header-title-row {
    padding-right: 96px !important;
  }

  .theme-btn {
    min-width: 70px !important;
    padding: 0 11px !important;
  }
}


/* 禁止网页内容被长按复制；备份码区域除外 */
html,
body,
.page-container,
.main-view,
.header,
.content,
.count-card,
.schedule-container,
.timeline-container,
.checklist-card,
.calendar-panel,
.festival-card,
.empty-state,
.tab-picker-panel,
.action-menu,
.detail-card {
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
}

button,
span,
b,
strong,
p,
h1,
h2,
div,
label {
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
}

/* 表单和备份区域允许正常编辑、选中、复制 */
input,
textarea,
select,
[contenteditable="true"],
#backupCode,
#restoreCode,
.backup-code-textarea,
.restore-textarea {
  -webkit-user-select: text !important;
  user-select: text !important;
  -webkit-touch-callout: default !important;
}


/* ===== 订阅提醒板块 ===== */
.subscription-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 14px;
}

.subscription-hero div {
  background: var(--card-bg);
  border-radius: 20px;
  padding: 16px;
  box-shadow: 0 10px 26px rgba(0,0,0,.055);
  backdrop-filter: blur(20px);
}

.subscription-hero span,
.subscription-hero em {
  display: block;
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 800;
  font-style: normal;
}

.subscription-hero b {
  display: block;
  margin: 8px 0 5px;
  color: var(--text-main);
  font-size: 26px;
  font-weight: 950;
  line-height: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.subscription-next-card {
  background: rgba(255,255,255,.68);
  color: var(--text-main);
  border: 1px solid rgba(255,255,255,.62);
  border-radius: 22px;
  padding: 18px;
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 14px;
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
  backdrop-filter: blur(16px) saturate(1.12);
  -webkit-backdrop-filter: blur(16px) saturate(1.12);
}

.subscription-next-card span,
.subscription-next-card em {
  display: block;
  color: var(--text-muted, var(--text-sub));
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
  opacity: 1;
}

.subscription-next-card b {
  display: block;
  margin: 8px 0 6px;
  font-size: 24px;
  font-weight: 950;
  color: var(--text-main);
}

.subscription-next-card strong {
  font-size: 18px;
  font-weight: 950;
  white-space: nowrap;
  color: var(--text-main);
}

.subscription-next-card.soon,
.subscription-next-card.today,
.subscription-next-card.overdue {
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255,59,48,.32);
  box-shadow: 0 14px 36px rgba(255,59,48,.12);
}

.subscription-next-card.soon strong,
.subscription-next-card.today strong,
.subscription-next-card.overdue strong {
  color: #dc2626;
}

.subscription-card {
  position: relative;
  background: var(--card-bg);
  border-radius: 20px;
  padding: 15px;
  margin-bottom: 13px;
  box-shadow: 0 10px 26px rgba(0,0,0,.052);
  backdrop-filter: blur(20px);
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) 54px;
  gap: 12px;
  align-items: start;
}

.subscription-card.paused,
.subscription-card.cancelled {
  opacity: .66;
}

.subscription-card.soon::before,
.subscription-card.today::before,
.subscription-card.overdue::before {
  content: "";
  position: absolute;
  left: 15px;
  right: 15px;
  top: 0;
  height: 4px;
  border-radius: 999px;
  background: #ff3b30;
}

.subscription-icon {
  width: 48px;
  height: 48px;
  border-radius: 15px;
  background: var(--tag-bg);
  display: grid;
  place-items: center;
  font-size: 25px;
}

.subscription-icon:has(.subscription-brand-icon) {
  background: transparent;
}

.subscription-icon .subscription-brand-icon {
  width: 48px;
  height: 48px;
}

.subscription-icon .subscription-brand-qqmusic {
  border-radius: 50%;
}

.subscription-icon .subscription-brand-neteasemusic,
.subscription-icon .subscription-brand-applemusic,
.subscription-icon .subscription-brand-apple,
.subscription-icon .subscription-brand-icloud,
.subscription-icon .subscription-brand-googledrive,
.subscription-icon .subscription-brand-tmobilitat {
  border-radius: 15px;
}

.subscription-icon .subscription-brand-vodafone {
  border-radius: 50%;
}

.subscription-brand-icon,
.subscription-custom-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  line-height: 1;
  overflow: hidden;
}

.subscription-brand-qqmusic {
  border-radius: 50%;
}

.subscription-brand-neteasemusic,
.subscription-brand-applemusic,
.subscription-brand-apple,
.subscription-brand-icloud,
.subscription-brand-googledrive,
.subscription-brand-tmobilitat {
  border-radius: 22%;
}

.subscription-brand-vodafone {
  border-radius: 50%;
}

.subscription-brand-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

.subscription-brand-chatgpt {
  color: #111;
}

.subscription-brand-apple {
  color: #050505;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, .08);
  box-shadow: 0 5px 14px rgba(15, 23, 42, .08);
}

.subscription-brand-apple svg {
  width: 58%;
  height: 58%;
}

.subscription-brand-icloud {
  filter: drop-shadow(0 5px 10px rgba(10, 132, 255, .18));
}

.subscription-quick-presets {
  display: grid;
  gap: 10px;
  padding: 14px 0 12px;
}

.subscription-quick-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.subscription-quick-head-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.subscription-quick-head b {
  font-size: 15px;
  font-weight: 950;
}

.subscription-quick-head span {
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 750;
}

.subscription-quick-toggle {
  flex: 0 0 auto;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(0, 0, 0, 0.06);
  color: var(--text-main);
  font-size: 12px;
  font-weight: 850;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
}

.subscription-quick-toggle:active {
  transform: scale(0.98);
  opacity: 0.9;
}

.subscription-quick-presets.is-collapsed .subscription-quick-preset:nth-child(n + 3) {
  display: none;
}

.subscription-quick-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.subscription-quick-preset {
  min-width: 0;
  min-height: 62px;
  border-radius: 16px;
  background: var(--tag-bg);
  border: 1px solid rgba(0, 0, 0, .055);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.subscription-quick-preset:hover {
  border-color: rgba(15, 23, 42, .14);
  background: rgba(255, 255, 255, .72);
}

.subscription-quick-preset:active {
  transform: scale(.98);
}

.subscription-quick-preset.is-selected {
  border-color: var(--primary);
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 14%, transparent);
}

.subscription-quick-preset:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

.subscription-quick-icon {
  width: 38px;
  height: 38px;
  border-radius: 13px;
  background: rgba(255, 255, 255, .7);
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
}

.subscription-quick-icon:has(.subscription-brand-icon) {
  background: transparent;
}

.subscription-quick-icon .subscription-brand-icon {
  width: 38px;
  height: 38px;
}

.subscription-quick-icon .subscription-brand-qqmusic {
  border-radius: 50%;
}

.subscription-quick-icon .subscription-brand-neteasemusic,
.subscription-quick-icon .subscription-brand-applemusic,
.subscription-quick-icon .subscription-brand-apple,
.subscription-quick-icon .subscription-brand-icloud,
.subscription-quick-icon .subscription-brand-googledrive,
.subscription-quick-icon .subscription-brand-tmobilitat {
  border-radius: 13px;
}

.subscription-quick-icon .subscription-brand-vodafone {
  border-radius: 50%;
}

.subscription-quick-preset span:last-child {
  min-width: 0;
}

.subscription-quick-preset b,
.subscription-quick-preset em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.subscription-quick-preset b {
  font-size: 14px;
  font-weight: 950;
}

.subscription-quick-preset em {
  margin-top: 3px;
  color: var(--text-sub);
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
}

.subscription-main {
  min-width: 0;
}

.subscription-title-row {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 5px;
}

.subscription-title-row b {
  font-size: 17px;
  font-weight: 950;
  color: var(--text-main);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.subscription-title-row span {
  flex-shrink: 0;
  background: var(--tag-bg);
  color: var(--text-sub);
  border-radius: 999px;
  padding: 3px 7px;
  font-size: 10px;
  font-weight: 900;
}

.subscription-meta {
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 750;
  margin-bottom: 8px;
}

.subscription-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.subscription-tags span {
  background: var(--tag-bg);
  color: var(--text-sub);
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 850;
}

.subscription-main p {
  margin: 8px 0 0;
  color: var(--text-sub);
  font-size: 12px;
  line-height: 1.5;
  font-weight: 700;
}

.subscription-side {
  text-align: right;
}

.subscription-side b {
  display: block;
  font-size: 18px;
  font-weight: 950;
  color: var(--text-main);
}

.subscription-side span {
  display: block;
  margin-top: 5px;
  color: var(--text-sub);
  font-size: 11px;
  font-weight: 800;
}

.subscription-actions {
  grid-column: 1 / -1;
  margin-top: 2px;
}

.subscription-form-tip {
  margin: -5px 4px 18px;
  color: var(--text-sub);
  font-size: 12px;
  line-height: 1.55;
  font-weight: 700;
}

@media(max-width: 380px) {
  .subscription-card {
    grid-template-columns: 42px minmax(0,1fr) 48px;
    gap: 10px;
  }

  .subscription-icon {
    width: 42px;
    height: 42px;
    font-size: 22px;
  }

  .subscription-brand-icon,
  .subscription-custom-icon {
    width: 28px;
    height: 28px;
  }

  .subscription-quick-grid {
    grid-template-columns: 1fr;
  }

  .subscription-hero {
    grid-template-columns: 1fr;
  }
}


/* ===== 全年节日：中国 / 西班牙切换 ===== */
.festival-region-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}

.festival-region-switch button {
  height: 42px;
  border-radius: 999px;
  background: var(--card-bg);
  color: var(--text-main);
  font-size: 13px;
  font-weight: 900;
  box-shadow: 0 6px 16px rgba(0,0,0,.045);
}

.festival-region-switch button.active {
  background: var(--primary);
  color: var(--primary-text);
}

.festival-name {
  white-space: normal;
  line-height: 1.25;
}


/* 订阅金额 + 货币单位选择 */
.money-form-row {
  grid-template-columns: 148px minmax(0, 1fr) !important;
}

.money-input-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 76px;
  gap: 8px;
  align-items: center;
  width: 100%;
}

.money-amount-input {
  width: 100% !important;
  margin-left: 0 !important;
  text-align: right !important;
  background: transparent !important;
}

.money-currency-select {
  height: 36px;
  border: 0;
  outline: 0;
  border-radius: 12px;
  background: var(--tag-bg);
  color: var(--text-main);
  font-size: 15px;
  font-weight: 900;
  text-align: center;
  text-align-last: center;
  padding: 0 8px;
}

@media(max-width: 380px) {
  .money-form-row {
    grid-template-columns: 128px minmax(0, 1fr) !important;
  }
  .money-input-wrap {
    grid-template-columns: minmax(0, 1fr) 66px;
  }
}


/* ===== Google 登录 / 云同步 ===== */
.cloud-sync-btn {
  width: 112px;
}

.cloud-sync-btn.cloud-online {
  background: #111 !important;
  color: #fff !important;
}

.cloud-sync-btn.cloud-syncing,
.cloud-sync-btn.is-syncing {
  opacity: 1;
}

.cloud-toast {
  position: fixed;
  left: 50%;
  bottom: calc(28px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  z-index: 10020;
  background: rgba(17,17,17,.92);
  color: #fff;
  border-radius: 999px;
  padding: 11px 16px;
  font-size: 13px;
  font-weight: 850;
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
  pointer-events: none;
  max-width: 82vw;
  text-align: center;
}

.cloud-menu-mask {
  position: fixed;
  inset: 0;
  z-index: 10010;
  background: rgba(0,0,0,.42);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
  box-sizing: border-box;
}

.cloud-menu-panel {
  width: min(360px, 92vw);
  background: rgba(255,255,255,.98);
  border-radius: 28px;
  padding: 22px;
  box-shadow: 0 28px 70px rgba(0,0,0,.24);
}

.cloud-menu-panel h3 {
  margin: 0 0 8px;
  font-size: 20px;
  font-weight: 950;
  color: #111;
}

.cloud-menu-panel p {
  margin: 0 0 16px;
  font-size: 13px;
  line-height: 1.55;
  color: #777;
  font-weight: 700;
}

.cloud-menu-user {
  background: #f5f5f7;
  border-radius: 18px;
  padding: 12px;
  margin-bottom: 14px;
  color: #111;
  font-size: 13px;
  font-weight: 850;
  word-break: break-all;
}

.cloud-menu-actions {
  display: grid;
  gap: 10px;
}

.cloud-menu-actions button {
  height: 46px;
  border-radius: 16px;
  background: #111;
  color: #fff;
  font-size: 15px;
  font-weight: 900;
}

.cloud-menu-actions button.secondary {
  background: #f1f1f4;
  color: #111;
}

.cloud-menu-actions button.danger {
  background: #fff1f1;
  color: #ff3b30;
}

@media(max-width: 390px) {
  .header-actions {
    gap: 8px;
  }
  .secondary-btn,
  .backup-btn,
  .cloud-sync-btn {
    width: 92px;
    font-size: 13px;
  }
}


/* ===== Final clean UI refresh: no export, simpler layout ===== */
:root { color-scheme: light; }
.page-container { letter-spacing: -0.01em; }
.main-view {
  padding-left: 22px !important;
  padding-right: 22px !important;
}
.header {
  gap: 14px !important;
  padding-top: max(72px, calc(58px + env(safe-area-inset-top))) !important;
  padding-bottom: 16px !important;
}
.header-title-row {
  gap: 12px !important;
  padding-right: 104px !important;
}
.header-title {
  font-size: clamp(42px, 12vw, 58px) !important;
  letter-spacing: -0.06em !important;
}
.header-subtitle {
  margin-top: 8px !important;
  font-size: 15px !important;
  letter-spacing: 0 !important;
}
.theme-btn,
.switch-tab-btn,
.secondary-btn,
.category-pill,
.schedule-mode-btn,
.festival-region-switch button {
  border: 1px solid rgba(0,0,0,.035);
}
.theme-btn,
.switch-tab-btn {
  height: 40px !important;
  border-radius: 999px !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.045) !important;
}
.theme-btn {
  right: 0 !important;
  min-width: 86px !important;
  top: 3px !important;
}
.switch-tab-btn { padding: 0 18px !important; }
.dashboard-card {
  border-radius: 28px !important;
  padding: 22px !important;
  box-shadow: 0 18px 46px rgba(15, 23, 42, .055) !important;
  border: 1px solid rgba(255,255,255,.62);
}
.dashboard-date { font-size: 18px !important; }
.year-num { font-size: 38px !important; }
.year-text,
.dashboard-label { font-size: 13px !important; }
.header-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 92px 92px !important;
  gap: 10px !important;
}
.primary-btn,
.secondary-btn {
  height: 58px !important;
  border-radius: 22px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.085) !important;
}
.primary-btn { font-size: 17px !important; }
.btn-plus { font-size: 25px !important; }
.secondary-btn {
  width: auto !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}
.cloud-sync-btn { min-width: 0 !important; }
.content { padding-top: 2px !important; }
.list-container {
  padding-bottom: max(44px, calc(34px + env(safe-area-inset-bottom))) !important;
}
.count-card,
.checklist-card,
.festival-card,
.subscription-card,
.calendar-panel,
.schedule-container {
  border: 1px solid rgba(255,255,255,.62);
  box-shadow: 0 12px 32px rgba(15,23,42,.048) !important;
}
.count-card,
.checklist-card,
.festival-card {
  border-radius: 26px !important;
  padding: 20px !important;
  margin-bottom: 14px !important;
}
.count-icon-box,
.festival-icon-box {
  width: 58px !important;
  height: 58px !important;
  border-radius: 18px !important;
}
.count-icon,
.festival-icon { font-size: 34px !important; }
.count-title,
.checklist-title { font-size: 20px !important; }
.count-date,
.checklist-note,
.festival-date { font-size: 13px !important; }
.count-number { font-size: 42px !important; }
.tag {
  font-size: 11px !important;
  padding: 5px 9px !important;
}
.progress-line,
.checklist-progress,
.year-progress-bar { height: 8px !important; }
.empty-state { margin-top: 76px !important; }
.empty-illustration {
  width: 112px !important;
  height: 112px !important;
  font-size: 50px !important;
  box-shadow: 0 18px 46px rgba(15,23,42,.055) !important;
}
.empty-title { font-size: 22px !important; }
.empty-desc { font-size: 15px !important; }
.form-card,
.backup-panel,
.tab-picker-panel,
.cloud-menu-panel {
  border: 1px solid rgba(255,255,255,.7);
  box-shadow: 0 22px 64px rgba(15,23,42,.10) !important;
}
.form-card { border-radius: 24px !important; }
.save-btn {
  height: 62px !important;
  border-radius: 22px !important;
  box-shadow: 0 16px 38px rgba(0,0,0,.12) !important;
}
.subscription-next-card,
.festival-hero {
  box-shadow: 0 18px 44px rgba(0,0,0,.11) !important;
}
@media(max-width: 390px) {
  .main-view {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  .header-actions {
    grid-template-columns: minmax(0, 1fr) 78px 78px !important;
    gap: 8px !important;
  }
  .secondary-btn { font-size: 13px !important; }
  .header-title-row { padding-right: 92px !important; }
}


/* ===== Compact top layout and countdown detail refinements ===== */
.header {
  padding-top: max(34px, calc(20px + env(safe-area-inset-top))) !important;
  gap: 10px !important;
}

.header-title-row {
  align-items: center !important;
  gap: 10px !important;
}

.header-title {
  font-size: clamp(40px, 11vw, 54px) !important;
  line-height: 1 !important;
}

.header-subtitle {
  margin-top: 6px !important;
  font-size: 14px !important;
}

.theme-btn,
.switch-tab-btn {
  height: 38px !important;
  min-height: 38px !important;
}

.dashboard-card {
  padding: 16px 18px !important;
  border-radius: 24px !important;
}

.dashboard-top {
  align-items: center !important;
}

.dashboard-label {
  margin-bottom: 4px !important;
}

.dashboard-date {
  font-size: 17px !important;
}

.year-num {
  font-size: 34px !important;
}

.year-text {
  margin-top: 4px !important;
}

.year-progress-bar {
  margin-top: 14px !important;
  height: 7px !important;
}

.header-actions {
  margin-top: 2px !important;
}

.primary-btn,
.secondary-btn {
  height: 54px !important;
  border-radius: 20px !important;
}

.category-scroll {
  margin-top: 0 !important;
}

.count-date-btn {
  display: inline-block;
  appearance: none;
  border: 0;
  padding: 0;
  background: transparent;
  text-align: left;
  color: var(--text-sub);
  font: inherit;
  font-size: 13px !important;
  font-weight: 700;
}

.count-date-btn:active {
  opacity: .55;
}

.detail-card {
  background-color: #111;
  background-size: cover;
  background-position: center;
}

.detail-top {
  align-items: flex-start;
  gap: 14px;
}

.detail-photo-btn {
  flex-shrink: 0;
  height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
  color: #fff;
  backdrop-filter: blur(12px);
  font-size: 13px;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,.18);
}

/* ===== 实用工具：完全本地的媒体与文件处理 ===== */
.practical-tools-wrap{display:grid;gap:16px;padding-bottom:40px}.practical-tools-intro{display:flex;gap:13px;align-items:flex-start;padding:17px 18px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#171717,#343434);box-shadow:0 16px 36px rgba(15,23,42,.16)}.practical-tools-lock{width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex:0 0 34px;border-radius:12px;background:rgba(255,255,255,.14);font-size:16px;font-weight:950}.practical-tools-intro b{display:block;font-size:16px;font-weight:950;margin-bottom:5px}.practical-tools-intro p{margin:0;font-size:12px;line-height:1.6;color:rgba(255,255,255,.7);font-weight:650}.practical-tools-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.practical-tool-card{display:flex;align-items:center;gap:12px;width:100%;min-height:90px;padding:15px;text-align:left;border:1px solid rgba(15,23,42,.06);border-radius:23px;background:rgba(255,255,255,.78);box-shadow:0 12px 28px rgba(15,23,42,.05);backdrop-filter:blur(20px);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.practical-tool-card:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(15,23,42,.08)}.practical-tool-active{border-color:#111;box-shadow:0 0 0 1px #111,0 16px 34px rgba(15,23,42,.1)}.practical-tool-icon{display:flex;align-items:center;justify-content:center;width:46px;height:46px;flex:0 0 46px;border-radius:16px;background:#111;color:#fff;font-size:10px;font-weight:950;letter-spacing:-.3px}.practical-tool-icon.is-wide{font-size:8px;letter-spacing:0}.practical-convert-settings{margin-top:14px;display:grid;gap:12px}.practical-setting{display:grid;gap:7px}.practical-setting>span{color:#5f6672;font-size:11px;font-weight:850}.practical-choice-row{display:flex;flex-wrap:wrap;gap:7px}.practical-choice{min-height:34px;padding:0 11px;border-radius:999px;background:#f0f1f4;color:#374151;font-size:12px;font-weight:850}.practical-choice.is-active{background:#111;color:#fff}.practical-choice:disabled{opacity:.38}.practical-check-row{display:flex;flex-direction:column;gap:8px}.practical-check{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;color:#374151}.practical-webm-note{margin:0;color:#9a6b16;font-size:11px;font-weight:700;line-height:1.45}.practical-convert-summary{margin:0;color:#697180;font-size:11px;line-height:1.5;font-weight:650}.practical-cancel-btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:42px;margin-top:10px;border-radius:16px;background:#fff1f1;color:#b42318;font-size:13px;font-weight:950}.practical-file-picker.is-disabled{pointer-events:none;opacity:.55}.practical-tool-copy{min-width:0;flex:1}.practical-tool-copy b{display:block;margin-bottom:5px;color:#111827;font-size:14px;line-height:1.25;font-weight:950}.practical-tool-copy em{display:block;color:#7b8190;font-size:11px;line-height:1.45;font-style:normal;font-weight:650}.practical-tool-arrow{color:#9ca3af;font-size:23px;line-height:1}.practical-workbench{padding:19px;border:1px solid rgba(15,23,42,.07);border-radius:28px;background:rgba(255,255,255,.84);box-shadow:0 18px 44px rgba(15,23,42,.07);scroll-margin-top:16px}.practical-workbench-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.practical-workbench-head b{display:block;font-size:18px;font-weight:950;color:#111827;margin-bottom:5px}.practical-workbench-head span{display:block;font-size:12px;color:#7b8190;font-weight:700}.practical-reset-btn{padding:7px 11px;border-radius:999px;background:#f0f1f4;color:#4b5563;font-size:11px;font-weight:900}.practical-tip{margin:14px 0 0;padding:11px 13px;border-radius:15px;background:#f6f7f9;color:#697180;font-size:11px;line-height:1.55;font-weight:650}.practical-file-picker{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:132px;margin-top:15px;padding:18px;border:1.5px dashed rgba(15,23,42,.18);border-radius:21px;background:rgba(248,250,252,.78);cursor:pointer}.practical-file-picker:hover{border-color:#111;background:#fff}.practical-file-plus{display:flex;align-items:center;justify-content:center;width:39px;height:39px;margin-bottom:8px;border-radius:14px;background:#111;color:#fff;font-size:22px;line-height:1}.practical-file-picker b{font-size:14px;font-weight:950;color:#111827}.practical-file-picker em{margin-top:5px;color:#9aa0aa;font-size:10px;font-style:normal;text-align:center;word-break:break-all}.practical-selected{margin-top:14px}.practical-selected-title{display:flex;justify-content:space-between;align-items:center;padding:0 2px 8px;color:#7b8190;font-size:11px;font-weight:850}.practical-selected-title b{display:flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 7px;border-radius:999px;background:#eff0f2;color:#111;font-size:11px}.practical-selected ul{display:grid;gap:6px;max-height:178px;overflow:auto;margin:0;padding:0;list-style:none}.practical-selected li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 11px;border-radius:13px;background:#f6f7f9;color:#444b57;font-size:11px}.practical-selected li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.practical-selected li b{flex:0 0 auto;color:#8b919b;font-size:10px}.practical-file-empty{justify-content:center!important;color:#a1a6ae!important}.practical-progress{margin-top:14px;padding:12px;border-radius:16px;background:#f6f7f9}.practical-progress>div{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#5f6672;font-size:11px;font-weight:800}.practical-progress>div b{color:#111}.practical-progress>i{display:block;height:7px;margin-top:9px;overflow:hidden;border-radius:999px;background:#e1e3e7}.practical-progress>i em{display:block;width:0;height:100%;border-radius:inherit;background:#111;transition:width .25s ease}.practical-run-btn,.practical-download-btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:45px;margin-top:14px;border-radius:16px;background:#111;color:#fff;font-size:14px;font-weight:950;box-shadow:0 10px 24px rgba(17,17,17,.14)}.practical-run-btn:disabled{opacity:.34;box-shadow:none}.practical-result{margin-top:13px;padding:13px;border:1px solid rgba(16,185,129,.18);border-radius:18px;background:#f0fdf7}.practical-result-copy{display:flex;align-items:center;gap:10px}.practical-result-copy>span{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:11px;background:#0f9f68;color:#fff;font-weight:950}.practical-result-copy b{display:block;color:#116149;font-size:13px;font-weight:950}.practical-result-copy em{display:block;max-width:330px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#57917c;font-size:10px;font-style:normal}.practical-download-btn{min-height:39px;margin-top:11px;background:#0f9f68;box-shadow:none;font-size:12px}.practical-extracted-list{display:grid;gap:6px;max-height:220px;margin-top:11px;overflow:auto}.practical-extracted-list a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 11px;border-radius:12px;background:#fff;color:#116149;font-size:11px;font-weight:850}.practical-extracted-list a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.practical-extracted-list a b{flex:0 0 auto;color:#6b9e8b;font-size:9px}.practical-tools-note{text-align:center;margin:0;color:#9ca3af;font-size:10px;font-weight:700}.hide-today-card[data-current-tab="practicalTools"] .today-action-row{display:none!important}.hide-today-card[data-current-tab="practicalTools"] .content{padding-top:8px!important}
#app[data-current-tab="practicalTools"] #shareCurrentTabBtn{display:none!important}
@media(max-width:560px){.practical-tools-grid{grid-template-columns:1fr}.practical-tool-card{min-height:78px}.practical-workbench{padding:16px}.practical-file-picker{min-height:120px}}
.practical-extracted-list button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:10px 11px;border-radius:12px;background:#fff;color:#116149;font-size:11px;font-weight:850;text-align:left}.practical-extracted-list button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.practical-extracted-list button b{flex:0 0 auto;color:#6b9e8b;font-size:9px}
.cloud-conflict-dialog{width:min(92vw,460px)}.cloud-conflict-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.cloud-conflict-preview span{padding:9px 10px;border-radius:12px;background:#f4f5f7;color:#555d69;font-size:11px;font-weight:750}.cloud-conflict-preview span:last-child{grid-column:1/-1}.cloud-conflict-actions{display:grid;gap:8px}.cloud-conflict-actions button{min-height:44px;border-radius:14px;background:#111;color:#fff;font-weight:850}.cloud-conflict-actions button.secondary{background:#f0f1f3;color:#30343a}
@media(min-width:768px){.practical-file-picker-droppable{transition:border-color .16s ease,background .16s ease,box-shadow .16s ease}.practical-file-picker.is-dragover{border-color:#111!important;background:#fff!important;box-shadow:0 0 0 4px rgba(17,17,17,.08)}.practical-drop-hint{display:block;margin-top:6px;color:#6b7280;font-size:11px;font-weight:750}}
@media(max-width:767px){.practical-drop-hint{display:none!important}}
.practical-compress-estimate{margin:0;padding:12px 13px;border-radius:16px;background:#f4f6f8;color:#111}
.practical-compress-estimate b{display:block;margin-bottom:4px;font-size:15px;line-height:1.3;font-weight:950}
.practical-compress-estimate span{display:block;color:#697180;font-size:11px;line-height:1.45;font-weight:650}

/* ===== 柯岚托托学：按字母查阅用法 ===== */
.key-words-wrap{display:grid;gap:14px;padding-bottom:40px}
.key-words-intro{display:flex;gap:13px;align-items:flex-start;padding:17px 18px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#171717,#343434);box-shadow:0 16px 36px rgba(15,23,42,.16)}
.key-words-mark{width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex:0 0 34px;border-radius:12px;background:rgba(255,255,255,.14);font-size:13px;font-weight:950;letter-spacing:-.4px}
.key-words-intro b{display:block;font-size:16px;font-weight:950;margin-bottom:5px}
.key-words-intro p{margin:0;font-size:12px;line-height:1.6;color:rgba(255,255,255,.7);font-weight:650}
.key-words-intro em{margin-left:auto;flex:0 0 auto;color:rgba(255,255,255,.55);font-size:11px;font-style:normal;font-weight:800;padding-top:4px;white-space:nowrap}
.key-word-index{display:flex;flex-wrap:wrap;gap:7px;position:sticky;top:0;z-index:2;padding:4px 0 2px}
.key-word-index-chip{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:42px;height:36px;padding:0 10px;border-radius:12px;background:rgba(255,255,255,.78);color:#111;font-size:12px;font-weight:950;box-shadow:0 8px 18px rgba(15,23,42,.05)}
.key-word-index-chip small{color:#9298a3;font-size:9px;font-weight:850}
.key-word-index-chip-active{background:#111;color:#fff;box-shadow:0 10px 22px rgba(15,23,42,.16)}
.key-word-index-chip-active small{color:rgba(255,255,255,.62)}
.key-word-groups{display:grid;gap:14px}
.key-word-letter-card{overflow:hidden;border-radius:24px;background:rgba(255,255,255,.64);border:1px solid rgba(255,255,255,.58);box-shadow:0 12px 32px rgba(15,23,42,.07)}
.key-word-letter-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 10px}
.key-word-letter-head b{font-size:22px;line-height:1;font-weight:950}
.key-word-letter-head span{min-width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;padding:0 8px;border-radius:999px;background:var(--tag-bg,#f0f0f3);color:var(--text-main,#111);font-size:11px;font-weight:900}
.key-word-letter-list{display:grid}
.key-word-row{display:flex;align-items:center;gap:12px;width:100%;min-height:62px;padding:12px 18px;text-align:left;border-top:1px solid rgba(15,23,42,.06);background:transparent}
.key-word-row-copy{min-width:0;flex:1}
.key-word-row-copy b{display:block;color:#111827;font-size:16px;line-height:1.2;font-weight:950}
.key-word-row-copy em{display:block;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7b8190;font-size:12px;line-height:1.4;font-style:normal;font-weight:650}
.key-word-row-arrow{color:#9ca3af;font-size:22px;line-height:1}
.key-word-detail{display:grid;gap:16px;padding-bottom:24px}
.key-word-back{justify-self:start;min-height:34px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.78);color:#374151;font-size:12px;font-weight:900;box-shadow:0 8px 18px rgba(15,23,42,.05)}
.key-word-hero{padding:22px 20px;border-radius:28px;color:#fff;background:linear-gradient(135deg,#171717,#343434);box-shadow:0 16px 36px rgba(15,23,42,.16)}
.key-word-hero b{display:block;font-size:32px;line-height:1.1;font-weight:950;letter-spacing:-.4px}
.key-word-hero em{display:block;margin-top:8px;color:rgba(255,255,255,.62);font-size:14px;font-style:normal;font-weight:700}
.key-word-hero span{display:block;margin-top:10px;color:rgba(255,255,255,.78);font-size:13px;line-height:1.5;font-weight:700}
.key-word-usages{padding:18px;border-radius:24px;background:rgba(255,255,255,.78);border:1px solid rgba(15,23,42,.06);box-shadow:0 12px 28px rgba(15,23,42,.05)}
.key-word-usages h3{margin:0 0 12px;color:#111827;font-size:13px;font-weight:950}
.key-words-lock-panel{width:min(92%,360px);padding:18px 18px 20px}
.key-words-lock-form{display:grid;gap:12px;margin-top:4px}
.key-words-lock-input{width:100%;height:52px;padding:0 16px;border-radius:16px;border:1px solid rgba(15,23,42,.1);background:#f6f7f9;color:#111;font-size:16px;font-weight:750;letter-spacing:0;text-align:left}
.key-words-lock-input:focus{outline:none;border-color:#111;background:#fff;box-shadow:0 0 0 4px rgba(17,17,17,.08)}
.key-words-lock-error{min-height:18px;margin:0;color:#c24141;font-size:12px;font-weight:750;text-align:center}
.kelan-hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.kelan-hub-card{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:6px;min-height:148px;padding:16px;text-align:left;border-radius:24px;background:rgba(255,255,255,.78);border:1px solid rgba(15,23,42,.06);box-shadow:0 12px 28px rgba(15,23,42,.07)}
.kelan-hub-mark{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#111;color:#fff;font-size:13px;font-weight:950;margin-bottom:auto}
.kelan-hub-card b{display:block;color:#111827;font-size:18px;line-height:1.2;font-weight:950}
.kelan-hub-card em{color:#7b8190;font-size:12px;line-height:1.4;font-style:normal;font-weight:650}
.kelan-hub-card-phrases{background:linear-gradient(145deg,rgba(236,250,252,.96),rgba(255,255,255,.82));border-color:rgba(16,143,163,.14)}
.kelan-hub-card-phrases .kelan-hub-mark{background:#118fa3}
.kelan-hub-card-learning{background:linear-gradient(145deg,rgba(238,241,255,.96),rgba(255,255,255,.84));border-color:rgba(67,78,184,.14)}
.kelan-hub-card-learning .kelan-hub-mark{background:#3546a8}
.kelan-hub-card-irregular{grid-column:1/-1;min-height:118px;background:linear-gradient(145deg,rgba(232,247,244,.96),rgba(255,255,255,.86));border-color:rgba(38,111,105,.15)}
.kelan-hub-card-irregular .kelan-hub-mark{background:#286f69}
.phrase-learning{--learning-ink:#182033;--learning-blue:#435596;--learning-bright:#5265a8;--learning-soft:#f3f5fa;--learning-line:rgba(24,32,51,.09)}
.phrase-learning-intro{color:var(--learning-ink);background:rgba(255,255,255,.76);border:1px solid var(--learning-line);box-shadow:0 1px 2px rgba(15,23,42,.03),0 16px 44px rgba(15,23,42,.055);backdrop-filter:blur(22px)}
.phrase-learning-intro .key-words-mark{background:var(--learning-ink);color:#fff}
.phrase-learning-intro p{color:#667085}
.phrase-learning-intro em{color:#7b8496}
.phrase-learning-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.phrase-learning-card{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:13px;min-height:104px;padding:16px 17px;text-align:left;border-radius:18px;background:rgba(255,255,255,.72);border:1px solid var(--learning-line);box-shadow:0 1px 2px rgba(15,23,42,.025),0 10px 28px rgba(15,23,42,.035);backdrop-filter:blur(18px);transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}
.phrase-learning-number{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:11px;background:var(--learning-soft);border:1px solid rgba(67,85,150,.1);color:var(--learning-blue);font-size:12px;font-weight:850;letter-spacing:.04em}
.phrase-learning-card-copy{min-width:0}
.phrase-learning-card-copy small{display:block;margin-bottom:6px;color:#788198;font-size:11px;line-height:1.2;font-weight:750;letter-spacing:.05em}
.phrase-learning-card-copy b{display:block;overflow-wrap:anywhere;color:var(--learning-ink);font-size:17px;line-height:1.3;font-weight:850;letter-spacing:-.01em}
.phrase-learning-card-copy em{display:block;margin-top:6px;color:#687083;font-size:14px;line-height:1.5;font-style:normal;font-weight:560}
.phrase-learning-arrow{color:#aeb4c1;font-size:21px;font-weight:400}
.phrase-learning-card:focus-visible{outline:2px solid rgba(67,85,150,.55);outline-offset:3px}
.phrase-learning-detail{width:min(100%,940px);margin:0 auto;gap:12px}
.phrase-learning-hero-shell{position:relative}
.phrase-learning-side-nav{position:fixed;inset:0;z-index:18;pointer-events:none}
.phrase-learning-nav-button{position:absolute;top:50%;display:flex;align-items:center;justify-content:center;width:50px;height:50px;border:1px solid rgba(67,85,150,.13);border-radius:50%;background:rgba(255,255,255,.9);color:var(--learning-blue);box-shadow:0 12px 34px rgba(15,23,42,.1);font-size:23px;line-height:1;font-weight:500;cursor:pointer;pointer-events:auto;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transform:translateY(-50%);transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease}
.phrase-learning-nav-previous{left:var(--phrase-learning-nav-previous-left,16px)}
.phrase-learning-nav-next{left:var(--phrase-learning-nav-next-left,calc(100vw - 66px))}
.phrase-learning-nav-button:active{transform:translateY(-50%) scale(.94)}
.phrase-learning-nav-button:focus-visible{outline:2px solid rgba(67,85,150,.55);outline-offset:4px}
.phrase-learning-nav-button:disabled{opacity:.24;cursor:default;pointer-events:none;box-shadow:none}
.phrase-learning-hero{padding:30px 32px 28px;border-radius:24px;color:var(--learning-ink);background:rgba(255,255,255,.8);border:1px solid var(--learning-line);box-shadow:0 1px 2px rgba(15,23,42,.03),0 18px 48px rgba(15,23,42,.06);backdrop-filter:blur(24px)}
.phrase-learning-hero b{overflow-wrap:anywhere;color:var(--learning-ink);font-size:clamp(30px,5vw,44px);line-height:1.12;font-weight:820;letter-spacing:-.035em}
.phrase-learning-kicker{display:inline-flex!important;width:auto;align-items:center;margin:0 0 16px!important;padding:7px 10px;border-radius:999px;background:var(--learning-soft);color:var(--learning-blue)!important;font-size:11px!important;line-height:1.2!important;font-weight:800!important;letter-spacing:.07em}
.key-word-hero .phrase-learning-meaning{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid var(--learning-line);color:#4d586d;font-size:16px;line-height:1.65;font-weight:600}
.phrase-learning-meaning small{color:#8a92a2;font-size:11px;line-height:1.4;font-weight:750;letter-spacing:.07em;white-space:nowrap}
.phrase-learning-meaning strong{color:#4c5669;font-size:16px;font-weight:650}
.phrase-learning-notes{overflow-wrap:anywhere;padding:26px 30px;border-radius:22px;background:rgba(255,255,255,.76);border:1px solid var(--learning-line);box-shadow:0 1px 2px rgba(15,23,42,.025),0 16px 42px rgba(15,23,42,.045);backdrop-filter:blur(20px)}
.phrase-learning-notes h3{margin:30px 0 12px;padding-top:24px;border-top:1px solid var(--learning-line);color:#273148;font-size:15px;line-height:1.45;font-weight:820;letter-spacing:.01em}
.phrase-learning-notes h3:first-child{margin-top:0;padding-top:0;border-top:0}
.phrase-learning-notes>p{margin:10px 0;color:#3f485b;font-size:16px;line-height:1.8;font-weight:540}
.phrase-learning-notes ul{display:grid;gap:8px;margin:12px 0;padding-left:21px;color:#3f485b;font-size:16px;line-height:1.72;font-weight:560}
.phrase-learning-quote{display:grid;gap:7px;margin:12px 0;padding:14px 16px;border-radius:13px;background:rgba(243,245,250,.82);border:1px solid rgba(24,32,51,.07)}
.phrase-learning-quote p{margin:0;color:#273148;font-size:16px;line-height:1.65;font-weight:670}
.phrase-learning-quote p[lang="zh-CN"]{color:#6a7283;font-size:15px;font-weight:540}
.phrase-learning-quote p[lang="en-GB"]+p[lang="zh-CN"]{margin-top:2px;padding-top:7px;border-top:1px solid rgba(24,32,51,.065)}
.irregular-verbs{--iv-ink:#183c39;--iv-accent:#286f69;--iv-soft:#eaf5f3;--iv-line:rgba(24,60,57,.1)}
.irregular-verb-intro{color:#fff;background:linear-gradient(135deg,#183c39,#286f69);border:1px solid rgba(255,255,255,.1);box-shadow:0 16px 42px rgba(24,60,57,.14)}
.irregular-verb-intro .key-words-mark{background:rgba(255,255,255,.14);color:#fff}
.irregular-verb-intro p{color:rgba(255,255,255,.72)}
.irregular-verb-intro em{color:rgba(255,255,255,.72);font-size:16px}
.irregular-verb-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.irregular-verb-note{display:grid;align-content:start;gap:6px;min-height:104px;padding:15px 16px;border:1px solid var(--iv-line);border-radius:18px;background:rgba(255,255,255,.76);box-shadow:0 10px 28px rgba(15,23,42,.035)}
.irregular-verb-note b{color:var(--iv-accent);font-size:13px;line-height:1.35;font-weight:850}
.irregular-verb-note p{margin:0;color:#596966;font-size:14px;line-height:1.65;font-weight:560}
.irregular-verb-note-pronunciation{border-left:3px solid #e9a348}
.irregular-verb-toolbar{position:sticky;top:8px;z-index:3;display:grid;grid-template-columns:minmax(230px,.8fr) minmax(0,1.4fr) auto;align-items:center;gap:10px;padding:11px;border:1px solid var(--iv-line);border-radius:18px;background:rgba(250,252,252,.94);box-shadow:0 10px 30px rgba(15,23,42,.07);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.irregular-verb-search{display:flex;align-items:center;gap:9px;height:42px;padding:0 13px;border:1px solid rgba(24,60,57,.1);border-radius:12px;background:#fff;color:#87938f}
.irregular-verb-search:focus-within{border-color:rgba(40,111,105,.42);box-shadow:0 0 0 3px rgba(40,111,105,.08)}
.irregular-verb-search>span{font-size:20px;line-height:1}
.irregular-verb-search input{min-width:0;flex:1;height:100%;border:0;outline:0;background:transparent;color:#1f3735;font-size:15px;font-weight:620}
.irregular-verb-search input::placeholder{color:#9aa5a2;font-weight:520}
.irregular-verb-filters{display:flex;align-items:center;gap:6px;min-width:0;overflow-x:auto;scrollbar-width:none}
.irregular-verb-filters::-webkit-scrollbar{display:none}
.irregular-verb-chip{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 11px;border:1px solid transparent;border-radius:11px;background:var(--iv-soft);color:#536963;font-size:13px;font-weight:780;white-space:nowrap}
.irregular-verb-chip small{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:rgba(255,255,255,.72);color:#778985;font-size:10px;font-weight:760}
.irregular-verb-chip.is-active{background:var(--iv-ink);color:#fff}
.irregular-verb-chip.is-active small{background:rgba(255,255,255,.15);color:#fff}
.irregular-verb-result-count{margin:0;color:#71807d;font-size:12px;font-weight:700;white-space:nowrap}
.irregular-verb-groups{display:grid;gap:14px}
.irregular-verb-group{overflow:hidden;border:1px solid var(--iv-line);border-radius:20px;background:rgba(255,255,255,.78);box-shadow:0 12px 34px rgba(15,23,42,.045)}
.irregular-verb-group-head{display:flex;align-items:center;gap:13px;padding:16px 18px;border-bottom:1px solid var(--iv-line);background:linear-gradient(90deg,rgba(234,245,243,.88),rgba(255,255,255,.7))}
.irregular-verb-group-head>span{display:flex;align-items:center;justify-content:center;min-width:48px;height:36px;padding:0 10px;border-radius:11px;background:var(--iv-ink);color:#fff;font-size:13px;font-weight:850;letter-spacing:.06em}
.irregular-verb-group-head div{min-width:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.irregular-verb-group-head b{color:#243b39;font-size:16px;line-height:1.4;font-weight:800}
.irregular-verb-group-head small{color:#7b8a87;font-size:12px;font-weight:650}
.irregular-verb-table-wrap{overflow-x:auto}
.irregular-verb-table{width:100%;border-collapse:collapse;table-layout:fixed;color:#314744}
.irregular-verb-table th{padding:11px 16px;background:#f3f8f7;color:#71817d;font-size:12px;line-height:1.3;font-weight:760;text-align:left;letter-spacing:.03em}
.irregular-verb-table td{padding:11px 16px;border-top:1px solid rgba(24,60,57,.075);font-size:15px;line-height:1.45;font-weight:560;vertical-align:top;overflow-wrap:anywhere}
.irregular-verb-table th:nth-child(-n+3),.irregular-verb-table td:nth-child(-n+3){width:22%}
.irregular-verb-table th:last-child,.irregular-verb-table td:last-child{width:34%}
.irregular-verb-table tbody tr:nth-child(even){background:rgba(241,247,246,.55)}
.irregular-verb-table td strong{color:#172f2d;font-weight:820}
.irregular-verb-empty{padding:48px 20px;border:1px solid var(--iv-line);border-radius:20px;background:rgba(255,255,255,.72);color:#7a8885;font-size:15px;font-weight:650;text-align:center}
.irregular-verb-source{margin:0;padding:2px 4px;color:#8b9794;font-size:12px;line-height:1.5;font-weight:600;text-align:right}
.phrase-catalog,.phrase-detail{--phrase-ink:#17242d;--phrase-accent:#14766f;--phrase-soft:#eef6f4;--phrase-muted:#6e7982;--phrase-line:rgba(23,36,45,.09)}
.phrase-intro{color:var(--phrase-ink);background:rgba(255,255,255,.78);border:1px solid var(--phrase-line);box-shadow:0 1px 2px rgba(15,23,42,.03),0 18px 48px rgba(15,23,42,.055);backdrop-filter:blur(22px)}
.phrase-intro .key-words-mark{background:var(--phrase-ink);color:#fff}
.phrase-intro p{color:var(--phrase-muted)}
.phrase-intro em{color:#7d878e}
.phrase-catalog-heading{display:flex;align-items:center;gap:12px;padding:8px 2px 2px;color:var(--phrase-ink)}
.phrase-catalog-heading::after{content:"";height:1px;flex:1;background:var(--phrase-line)}
.phrase-catalog-heading b{font-size:13px;font-weight:800;letter-spacing:.06em}
.phrase-catalog-heading span{order:3;display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:24px;padding:0 8px;border-radius:999px;background:var(--phrase-soft);color:var(--phrase-accent);font-size:11px;font-weight:800}
.phrase-topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.phrase-topic-card{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr auto;gap:11px 8px;min-height:132px;padding:17px;text-align:left;border-radius:18px;background:rgba(255,255,255,.72);border:1px solid var(--phrase-line);box-shadow:0 1px 2px rgba(15,23,42,.025),0 10px 28px rgba(15,23,42,.035);backdrop-filter:blur(18px);transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease}
.phrase-topic-number{grid-column:1;grid-row:1;display:block;width:auto;height:auto;border:0;border-radius:0;background:transparent;color:var(--phrase-accent);font-size:12px;line-height:1;font-weight:850;letter-spacing:.08em}
.phrase-topic-copy{grid-column:1/-1;grid-row:2;min-width:0;align-self:start}
.phrase-topic-copy b{display:block;overflow-wrap:anywhere;color:var(--phrase-ink);font-size:16px;line-height:1.38;font-weight:850;letter-spacing:-.01em}
.phrase-topic-copy em{display:block;margin-top:5px;color:#7a848d;font-size:12px;line-height:1.45;font-style:normal;font-weight:560}
.phrase-topic-card small{grid-column:1/-1;grid-row:3;align-self:end;padding-top:10px;border-top:1px solid var(--phrase-line);color:#8a939b;font-size:11px;line-height:1.2;font-weight:650}
.phrase-topic-card-appendix{background:rgba(250,248,244,.8);border-color:rgba(116,92,54,.12)}
.phrase-topic-card-appendix .phrase-topic-number{color:#8b6b3e}
.phrase-topic-card-appendix small{border-color:rgba(116,92,54,.11)}
.phrase-section-hero,.phrase-detail-hero{color:var(--phrase-ink);background:rgba(255,255,255,.8);border:1px solid var(--phrase-line);box-shadow:0 1px 2px rgba(15,23,42,.03),0 18px 48px rgba(15,23,42,.055);backdrop-filter:blur(22px)}
.phrase-section-kicker{display:inline-flex!important;width:auto;align-items:center;margin:0 0 14px!important;padding:6px 9px;border-radius:999px;background:var(--phrase-soft);color:var(--phrase-accent)!important;font-size:10px!important;line-height:1.2!important;font-weight:850!important;letter-spacing:.12em}
.phrase-section-hero b{color:var(--phrase-ink);font-size:clamp(26px,4vw,34px);line-height:1.18;letter-spacing:-.025em}
.phrase-section-hero em{margin-top:7px;color:#7a848d;font-size:14px;font-weight:600}
.key-word-hero .phrase-section-count{display:inline-flex;width:auto;margin-top:18px;padding-top:0;color:#7a848d;font-size:12px;font-weight:700}
.phrase-search{position:sticky;top:8px;z-index:2;display:flex;align-items:center;gap:11px;height:50px;padding:0 16px;border-radius:15px;background:rgba(255,255,255,.9);border:1px solid var(--phrase-line);box-shadow:0 8px 28px rgba(15,23,42,.055);backdrop-filter:blur(24px)}
.phrase-search-icon{display:flex;align-items:center;justify-content:center;width:21px;height:21px;color:#7e898f}
.phrase-search-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.phrase-search input{min-width:0;flex:1;height:100%;border:0;outline:0;background:transparent;color:var(--phrase-ink);font-size:15px;font-weight:600}
.phrase-search input::placeholder{color:#9aa2a8;font-weight:520}
.phrase-search:focus-within{border-color:rgba(20,118,111,.35);box-shadow:0 0 0 3px rgba(20,118,111,.08),0 10px 30px rgba(15,23,42,.06)}
.phrase-entry-card{overflow:hidden;border-radius:18px;background:rgba(255,255,255,.72);border:1px solid var(--phrase-line);box-shadow:0 1px 2px rgba(15,23,42,.025),0 12px 32px rgba(15,23,42,.04);backdrop-filter:blur(18px)}
.phrase-entry-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:14px;min-height:72px;padding:13px 18px}
.phrase-entry-index{color:#9aa2a8;font-size:11px;line-height:1;font-weight:750;letter-spacing:.06em;font-variant-numeric:tabular-nums}
.phrase-entry-row .key-word-row-copy b{color:var(--phrase-ink);font-size:16px;line-height:1.35;font-weight:780;letter-spacing:-.01em}
.phrase-entry-row .key-word-row-copy em{margin-top:5px;color:#737e86;font-size:13px;line-height:1.45;font-weight:540}
.phrase-entry-row .key-word-row-arrow{color:#a8b0b5;font-size:20px;font-weight:400}
.phrase-entry-row:focus-visible{outline:2px solid rgba(20,118,111,.5);outline-offset:-3px}
.phrase-empty-search{padding:34px 18px;text-align:center;color:#89939a;font-size:14px;font-weight:620}
.phrase-pagination{border-radius:15px;background:rgba(255,255,255,.74);border:1px solid var(--phrase-line);box-shadow:0 1px 2px rgba(15,23,42,.025),0 10px 28px rgba(15,23,42,.035)}
.phrase-pagination button{border-radius:10px;background:var(--phrase-ink);font-weight:750}
.phrase-detail{width:min(100%,940px);margin:0 auto;gap:12px}
.phrase-detail-hero{padding:30px 32px 28px;border-radius:24px}
.phrase-detail-hero b{overflow-wrap:anywhere;color:var(--phrase-ink);font-size:clamp(30px,5vw,44px);line-height:1.14;font-weight:820;letter-spacing:-.035em}
.phrase-detail-hero em{color:#66727b;font-size:14px;font-weight:600}
.key-word-hero .phrase-source-meta{display:inline-flex;width:auto;margin-top:20px;padding-top:15px;border-top:1px solid var(--phrase-line);color:#8a939a;font-size:11px;line-height:1.4;font-weight:680;letter-spacing:.03em}
.phrase-detail-content{display:grid;gap:12px}
.phrase-content-card{padding:22px 24px;border-radius:18px;background:rgba(255,255,255,.76);border:1px solid var(--phrase-line);box-shadow:0 1px 2px rgba(15,23,42,.025),0 12px 34px rgba(15,23,42,.04);backdrop-filter:blur(18px)}
.phrase-content-card h3{margin:0 0 13px;color:#7b858d;font-size:11px;line-height:1.3;font-weight:800;letter-spacing:.09em}
.phrase-content-card>p,.phrase-detail-line{margin:0;color:#35424b;font-size:16px;line-height:1.75;font-weight:560}
.phrase-detail-line+.phrase-detail-line{margin-top:10px}
.phrase-detail-line>span{display:inline-flex;align-items:center;justify-content:center;width:23px;height:23px;margin-right:8px;border-radius:50%;background:var(--phrase-soft);color:var(--phrase-accent);font-size:12px;font-weight:850;vertical-align:middle}
.phrase-detail-hint{padding:11px 13px;border-radius:11px;background:#f7f4ed;color:#725f43!important;font-size:13px!important}
.phrase-meaning-card{background:var(--phrase-ink);border-color:transparent;box-shadow:0 14px 38px rgba(23,36,45,.12)}
.phrase-meaning-card h3{color:rgba(255,255,255,.55)}
.phrase-meaning-card>p{color:#fff;font-size:18px;line-height:1.65;font-weight:650}
.phrase-example-card>p{font-size:16px;line-height:1.8}
.phrase-example-card>p+p{margin-top:11px}
.phrase-example-en{color:var(--phrase-ink)!important;font-weight:670!important}
.phrase-example-zh{padding-top:10px;border-top:1px solid var(--phrase-line);color:#6f7a82!important;font-size:15px!important;font-weight:520!important}
.phrase-spelling-card{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:15px;padding:20px 22px;border-radius:18px;background:rgba(255,255,255,.76);border:1px solid var(--phrase-line);box-shadow:0 1px 2px rgba(15,23,42,.025),0 12px 34px rgba(15,23,42,.04);backdrop-filter:blur(18px)}
.phrase-spelling-card div{min-width:0;display:grid;gap:6px;text-align:center}
.phrase-spelling-card span{color:#8a939a;font-size:10px;font-weight:750;letter-spacing:.06em}
.phrase-spelling-card b{overflow-wrap:anywhere;color:var(--phrase-ink);font-size:22px;font-weight:820}
.phrase-spelling-card i{color:var(--phrase-accent);font-size:19px;font-style:normal;font-weight:700}
.changnan-piece{display:grid;gap:14px}
.changnan-section{padding:18px;border-radius:24px;background:rgba(255,255,255,.78);border:1px solid rgba(15,23,42,.06);box-shadow:0 12px 28px rgba(15,23,42,.05)}
.changnan-section h3{margin:0 0 12px;color:#111827;font-size:13px;font-weight:950}
.changnan-section > p{margin:0;color:#111827;font-size:15px;line-height:1.75;font-weight:650}
.changnan-section-model{background:#111;border:0;color:#fff}
.changnan-section-model h3{color:#fff}
.changnan-section-model > p{color:rgba(255,255,255,.9)}
.changnan-alternatives{margin-top:16px;padding-top:15px;border-top:1px solid rgba(255,255,255,.16)}
.changnan-alternatives b{display:block;margin-bottom:7px;color:rgba(255,255,255,.62);font-size:12px;font-weight:900;letter-spacing:.04em}
.changnan-alternatives p{margin:0;color:rgba(255,255,255,.82);font-size:14px;line-height:1.72;font-weight:620}
.changnan-original{margin:0;color:#111827;font-size:16px;line-height:2.15;font-weight:650}
.changnan-mark{display:inline;max-width:100%}
.changnan-mark b{display:inline-block;max-width:100%;font-weight:800;border:1.6px solid #c24141;border-radius:10px;padding:1px 7px;background:rgba(194,65,65,.08);vertical-align:baseline;box-decoration-break:slice;-webkit-box-decoration-break:slice}
.changnan-mark i{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;margin:0 3px 0 4px;border-radius:50%;background:#c24141;color:#fff;font-size:10px;font-style:normal;font-weight:900;vertical-align:middle}
.changnan-mark em{margin-right:6px;color:#c24141;font-size:11px;font-style:normal;font-weight:800}
.changnan-notes{display:grid;gap:12px;margin:16px 0 0;padding:0;list-style:none}
.changnan-notes li{display:flex;gap:10px;align-items:flex-start}
.changnan-notes li > span{flex:0 0 22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#c24141;color:#fff;font-size:11px;font-weight:900}
.changnan-notes strong{display:block;margin-bottom:4px;color:#111827;font-size:13px;font-weight:900}
.changnan-notes p{margin:0 0 4px;color:#5f6672;font-size:12px;line-height:1.55;font-weight:650}
.changnan-row-pending{opacity:.62}
@media(hover:hover){
  .kelan-hub-card:hover{background:#fff}
  .phrase-topic-card:hover{background:rgba(255,255,255,.94);border-color:rgba(20,118,111,.2);box-shadow:0 1px 2px rgba(15,23,42,.025),0 15px 36px rgba(15,23,42,.06);transform:translateY(-1px)}
  .phrase-learning-card:hover{background:rgba(255,255,255,.94);border-color:rgba(67,85,150,.18);box-shadow:0 1px 2px rgba(15,23,42,.025),0 14px 34px rgba(15,23,42,.06);transform:translateY(-1px)}
  .phrase-learning-nav-button:not(:disabled):hover{background:#fff;border-color:rgba(67,85,150,.28);box-shadow:0 14px 38px rgba(15,23,42,.15)}
  .irregular-verb-chip:hover{border-color:rgba(40,111,105,.18)}
  .irregular-verb-table tbody tr:hover{background:rgba(226,241,238,.72)}
}
.key-word-usage{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-top:1px solid rgba(15,23,42,.06)}
.key-word-usage:first-of-type{border-top:0;padding-top:0}
.key-word-usage i{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex:0 0 24px;border-radius:9px;background:#111;color:#fff;font-size:11px;font-style:normal;font-weight:950}
.key-word-usage div{min-width:0;flex:1;display:grid;gap:6px}
.key-word-usage-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;gap:4px 8px}
.key-word-phrase{display:inline;color:#111827;font-size:14px;line-height:1.5;font-weight:850}
.key-word-star{display:inline-block;margin-right:.28em;color:#c2410c;line-height:1;vertical-align:-.08em}
.key-word-star svg{display:inline-block;vertical-align:middle}
.key-word-gloss{color:#111827;font-size:13px;line-height:1.5;font-style:normal;font-weight:750}
.key-word-note{margin:0;color:#5f6672;font-size:12px;line-height:1.55;font-weight:650}
.key-word-usage.is-key-usage .key-word-phrase{color:#111827}
.key-word-ex{margin:2px 0 0;padding:8px 10px;border-radius:12px;background:rgba(17,24,39,.045)}
.key-word-usage .key-word-ex em{display:block;color:#374151;font-size:12px;line-height:1.55;font-style:italic;font-weight:700}
.key-word-ex small{display:block;margin-top:4px;color:#8a8a8e;font-size:11px;line-height:1.5;font-weight:650}
.key-word-empty-usage{margin:0;color:#8a8a8e;font-size:13px;line-height:1.55;font-weight:650}
.key-word-login-btn{margin-top:16px;min-height:40px;padding:0 18px;border-radius:999px;background:#111;color:#fff;font-size:13px;font-weight:900}
.key-word-empty.empty-state{margin-top:28px}
.key-word-pagination{display:grid;grid-template-columns:minmax(84px,auto) 1fr minmax(84px,auto);align-items:center;gap:10px;padding:11px;border-radius:18px;background:rgba(255,255,255,.72);border:1px solid rgba(15,23,42,.06);box-shadow:0 10px 24px rgba(15,23,42,.05)}
.key-word-pagination button{min-height:38px;padding:0 13px;border-radius:12px;background:#111;color:#fff;font-size:11px;font-weight:900}
.key-word-pagination button:disabled{opacity:.25;pointer-events:none}
.key-word-pagination span{text-align:center;color:#747b87;font-size:11px;line-height:1.4;font-weight:750}
.key-word-pagination span b{color:#111827;font-size:13px;font-weight:950}
.hide-today-card[data-current-tab="keyWords"] .today-action-row{display:none!important}
.hide-today-card[data-current-tab="keyWords"] .content{padding-top:8px!important}
@media(hover:hover){
  .key-word-row:hover{background:rgba(255,255,255,.42)}
  .phrase-entry-row:hover{background:rgba(238,246,244,.72)}
  .key-word-index-chip:hover{background:#fff}
}
@media(max-width:560px){
  .kelan-hub-grid{grid-template-columns:1fr}
  .kelan-hub-card{min-height:122px}
  .kelan-hub-card-irregular{grid-column:auto}
  .phrase-topic-grid{grid-template-columns:1fr}
  .phrase-topic-card{min-height:116px}
  .phrase-entry-row{grid-template-columns:34px minmax(0,1fr) auto;gap:10px;padding:12px 14px}
  .phrase-content-card{padding:18px}
  .phrase-learning-grid{grid-template-columns:1fr}
  .phrase-learning-card{min-height:104px;padding:14px}
  .phrase-learning-notes{padding:17px}
  .phrase-learning-nav-button{width:40px;height:40px;font-size:19px}
  .key-word-hero{padding:18px 16px}
  .phrase-detail-hero{padding:22px 18px}
  .key-word-hero b{font-size:28px}
  .key-word-row{min-height:58px;padding:11px 16px}
  .key-word-pagination{grid-template-columns:1fr 1fr}
  .key-word-pagination span{grid-column:1/-1;grid-row:1}
  .key-word-pagination button{grid-row:2}
}

@media(max-width:820px){
  .irregular-verb-notes{grid-template-columns:1fr}
  .irregular-verb-note{min-height:0}
  .irregular-verb-toolbar{position:static;grid-template-columns:1fr;gap:9px}
  .irregular-verb-filters{padding-bottom:1px}
  .irregular-verb-result-count{padding:0 3px}
  .irregular-verb-group-head{align-items:flex-start;padding:14px}
  .irregular-verb-group-head div{display:grid;gap:3px}
  .irregular-verb-table-wrap{overflow:visible;padding:9px}
  .irregular-verb-table,.irregular-verb-table tbody{display:block}
  .irregular-verb-table thead{display:none}
  .irregular-verb-table tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-bottom:8px;overflow:hidden;border:1px solid rgba(24,60,57,.09);border-radius:14px;background:#fff}
  .irregular-verb-table tr:last-child{margin-bottom:0}
  .irregular-verb-table td,.irregular-verb-table td:nth-child(-n+3),.irregular-verb-table td:last-child{display:grid;gap:4px;width:auto;padding:11px 10px;border:0;border-right:1px solid rgba(24,60,57,.075);font-size:14px}
  .irregular-verb-table td:nth-child(3){border-right:0}
  .irregular-verb-table td:last-child{grid-column:1/-1;border-top:1px solid rgba(24,60,57,.075);border-right:0;background:rgba(240,247,245,.7)}
  .irregular-verb-table td::before{content:attr(data-label);color:#85918e;font-size:10px;line-height:1.2;font-weight:740;letter-spacing:.04em}
  .irregular-verb-table tbody tr:nth-child(even){background:#fff}
}

.detail-photo-btn:active {
  transform: scale(.96);
  opacity: .75;
}

.detail-days {
  font-size: 24px !important;
  line-height: 1.35 !important;
}

@media(max-width: 390px) {
  .header {
    padding-top: max(30px, calc(16px + env(safe-area-inset-top))) !important;
  }

  .dashboard-card {
    padding: 15px 17px !important;
  }

  .year-num {
    font-size: 32px !important;
  }
}


/* ===== Compact countdown cards ===== */
.count-card {
  min-height: 0 !important;
  padding: 16px 18px !important;
  border-radius: 22px !important;
  margin-bottom: 12px !important;
  align-items: center !important;
}

.count-icon-box {
  width: 52px !important;
  height: 52px !important;
  border-radius: 16px !important;
  margin-right: 14px !important;
}

.count-icon {
  font-size: 31px !important;
}

.count-info {
  min-height: 0 !important;
}

.count-title-row {
  margin-bottom: 5px !important;
}

.count-title {
  font-size: 19px !important;
  line-height: 1.15 !important;
}

.count-date,
.count-date-btn {
  font-size: 12.5px !important;
  line-height: 1.25 !important;
}

.tag-row {
  margin-top: 8px !important;
  gap: 6px !important;
}

.tag {
  font-size: 10.5px !important;
  padding: 4px 8px !important;
}

.count-number-box {
  min-width: 70px !important;
}

.count-number {
  font-size: 38px !important;
  margin-bottom: 3px !important;
}

.count-unit {
  font-size: 12px !important;
}

.progress-line,
.progress-inner {
  display: none !important;
}

@media(max-width: 390px) {
  .count-card {
    padding: 15px 16px !important;
  }

  .count-icon-box {
    width: 50px !important;
    height: 50px !important;
  }

  .count-number {
    font-size: 36px !important;
  }
}


/* ===== Form alignment refinement ===== */
.form-row {
  grid-template-columns: 148px minmax(0, 1fr) !important;
  column-gap: 14px !important;
  align-items: center !important;
}

.row-label {
  text-align: left !important;
}

.row-input,
.row-select,
.row-value,
.money-amount-input {
  text-align: center !important;
  text-align-last: center !important;
  justify-content: center !important;
}

.row-input::placeholder {
  text-align: center !important;
}

select.row-select,
.money-currency-select {
  text-align: center !important;
  text-align-last: center !important;
}

.form-row input[type="date"],
.form-row input[type="time"],
.form-row input[type="text"],
.form-row input[type="number"] {
  text-align: center !important;
}

.money-input-wrap {
  grid-template-columns: minmax(0, 1fr) 72px !important;
}

.money-input-wrap .money-amount-input {
  text-align: center !important;
}

@media(max-width: 390px) {
  .form-row {
    grid-template-columns: 128px minmax(0, 1fr) !important;
    column-gap: 10px !important;
  }

  .row-label {
    width: 128px !important;
    white-space: normal !important;
    line-height: 1.2 !important;
  }

  .money-input-wrap {
    grid-template-columns: minmax(0, 1fr) 64px !important;
  }
}


/* ===== Currency conversion fixes ===== */
.currency-clickable {
  cursor: pointer;
  position: relative;
}

.currency-clickable:active {
  transform: scale(.992);
  opacity: .9;
}

.currency-rate-note {
  margin: -4px 4px 12px;
  color: var(--text-sub);
  font-size: 11px;
  line-height: 1.45;
  font-weight: 750;
  text-align: center;
}

.subscription-tags span:nth-child(2) {
  background: rgba(0,0,0,.07);
  color: var(--text-main);
}


/* ===== Course grades board ===== */
.grades-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 14px;
}

.grades-hero div {
  background: var(--card-bg);
  border-radius: 20px;
  padding: 16px;
  box-shadow: 0 10px 26px rgba(0,0,0,.052);
  border: 1px solid rgba(255,255,255,.62);
}

.grades-hero span,
.grades-hero em {
  display: block;
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 850;
  font-style: normal;
}

.grades-hero b {
  display: block;
  margin: 8px 0 5px;
  color: var(--text-main);
  font-size: 28px;
  font-weight: 950;
  line-height: 1;
}

.grade-course-card {
  background: var(--card-bg);
  border-radius: 24px;
  padding: 18px;
  margin-bottom: 14px;
  box-shadow: 0 12px 32px rgba(15,23,42,.048);
  border: 1px solid rgba(255,255,255,.62);
}

.grade-course-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.grade-course-top b {
  display: block;
  color: var(--text-main);
  font-size: 20px;
  font-weight: 950;
  line-height: 1.2;
}

.grade-course-top span {
  display: block;
  margin-top: 7px;
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 800;
}

.grade-course-top strong {
  color: var(--text-main);
  font-size: 34px;
  font-weight: 950;
  line-height: 1;
}

.grade-weight-bar {
  height: 8px;
  background: var(--tag-bg);
  border-radius: 999px;
  overflow: hidden;
  margin: 16px 0 14px;
}

.grade-weight-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--primary);
}

.grade-items {
  display: grid;
  gap: 9px;
}

.grade-item {
  background: var(--tag-bg);
  border-radius: 16px;
  padding: 13px;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 10px;
  align-items: start;
}

.grade-item b {
  display: block;
  color: var(--text-main);
  font-size: 15px;
  font-weight: 950;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.grade-item span {
  display: block;
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 800;
  margin-top: 5px;
}

.grade-item strong {
  color: var(--text-main);
  font-size: 22px;
  font-weight: 950;
}

.grade-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.grade-actions button {
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 900;
}

.grade-actions button[data-delete-grade] {
  color: #ff3b30;
}

.grade-live-preview {
  background: var(--primary);
  color: var(--primary-text);
  border-radius: 22px;
  height: 58px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 17px;
  font-weight: 950;
  margin: -8px 0 14px;
  box-shadow: 0 14px 34px rgba(0,0,0,.10);
}

.grade-form-tip {
  margin: -2px 4px 18px;
  color: var(--text-sub);
  font-size: 12px;
  line-height: 1.55;
  font-weight: 750;
  text-align: center;
}

@media(max-width: 390px) {
  .grades-hero {
    grid-template-columns: 1fr 1fr;
  }

  .grade-course-top strong {
    font-size: 30px;
  }
}


/* ===== Course grades table-style redesign ===== */
.grade-rule-note {
  background: var(--card-bg);
  border-radius: 18px;
  padding: 13px 15px;
  margin: -2px 0 14px;
  color: var(--text-sub);
  font-size: 12px;
  line-height: 1.55;
  font-weight: 800;
  text-align: center;
  border: 1px solid rgba(255,255,255,.64);
  box-shadow: 0 8px 22px rgba(0,0,0,.035);
}

.table-grades-hero {
  margin-bottom: 12px !important;
}

.grade-table-card {
  background: var(--card-bg);
  border-radius: 24px;
  overflow: hidden;
  margin-bottom: 16px;
  box-shadow: 0 12px 32px rgba(15,23,42,.048);
  border: 1px solid rgba(0,0,0,.08);
}

.grade-table-title {
  padding: 18px 16px;
  text-align: center;
  color: var(--text-main);
  font-size: 20px;
  font-weight: 950;
  border-bottom: 1px solid rgba(0,0,0,.12);
}

.grade-table-head,
.grade-table-row {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) .55fr .65fr;
  align-items: center;
}

.grade-table-head {
  background: rgba(0,0,0,.035);
  border-bottom: 1px solid rgba(0,0,0,.10);
}

.grade-table-head span {
  padding: 10px 8px;
  color: var(--text-sub);
  text-align: center;
  font-size: 11px;
  font-weight: 900;
}

.grade-table-row {
  position: relative;
  min-height: 58px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.grade-table-row > div:first-child {
  padding: 12px 10px;
  text-align: center;
  min-width: 0;
}

.grade-table-row b {
  display: block;
  color: var(--text-main);
  font-size: 14px;
  line-height: 1.25;
  font-weight: 900;
  word-break: break-word;
}

.grade-table-row em {
  display: block;
  margin-top: 4px;
  color: var(--text-sub);
  font-size: 12px;
  font-style: normal;
  font-weight: 850;
}

.grade-table-row strong {
  text-align: center;
  color: var(--text-main);
  font-size: 16px;
  font-weight: 950;
}

.grade-row-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  gap: 18px;
  padding: 0 0 10px;
}

.grade-row-actions button {
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 900;
}

.grade-row-actions button[data-delete-grade] {
  color: #ff3b30;
}

.grade-table-total {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) 1.2fr;
  align-items: center;
  border-top: 1px solid rgba(0,0,0,.12);
  background: rgba(0,0,0,.025);
}

.grade-table-total span,
.grade-table-total b {
  padding: 15px 12px;
  color: var(--text-main);
  text-align: center;
  font-size: 18px;
  font-weight: 950;
}

.grade-table-total span {
  border-right: 1px solid rgba(0,0,0,.12);
}

.grade-table-foot {
  padding: 10px 12px 13px;
  text-align: center;
  color: var(--text-sub);
  font-size: 12px;
  font-weight: 850;
}

.grade-warning {
  margin: 0 14px 14px;
  padding: 10px;
  background: #fff1f1;
  color: #ff3b30;
  border-radius: 14px;
  text-align: center;
  font-size: 12px;
  font-weight: 900;
}

.grade-live-preview {
  background: var(--primary) !important;
}

.grade-form-tip {
  max-width: 92%;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media(max-width: 390px) {
  .grade-table-head,
  .grade-table-row {
    grid-template-columns: minmax(0, 1.45fr) .55fr .7fr;
  }

  .grade-table-title {
    font-size: 18px;
  }

  .grade-table-row b {
    font-size: 13px;
  }

  .grade-table-row strong {
    font-size: 15px;
  }
}


/* ===== Fix grade add form usability ===== */
.grade-form-card .row-input {
  text-align: center !important;
  text-align-last: center !important;
}

.grade-live-preview {
  margin-top: -6px !important;
}

.grade-form-tip {
  background: var(--card-bg);
  border-radius: 18px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.62);
  box-shadow: 0 8px 22px rgba(0,0,0,.035);
}


/* ===== Countdown detail photo fix ===== */
.detail-photo-btn {
  pointer-events: auto !important;
  position: relative;
  z-index: 20;
  touch-action: manipulation;
}


/* ===== Keyline Days UI Upgrade: clean app shell ===== */
:root{color-scheme:light}
body{background:transparent}
.page-container{isolation:isolate}
@media (max-width:899px){
  .page-container{isolation:auto!important;}
}
.bg-orb{opacity:.55;filter:blur(18px)}
.main-view{padding:0 18px}
.header{padding:max(34px,env(safe-area-inset-top) + 22px) 0 12px;gap:12px}
.header-top{align-items:flex-start;gap:12px}
.header-title-row{gap:10px;padding-top:0}
.header-title{font-size:28px;letter-spacing:-.9px;font-weight:900}
.header-subtitle{font-size:13px;line-height:1.35;margin-top:6px;color:var(--text-sub);font-weight:650}
.switch-tab-btn{height:30px;padding:0 12px;background:rgba(255,255,255,.72);border:1px solid rgba(0,0,0,.055);box-shadow:none}
.settings-btn{width:48px;height:34px;border-radius:999px;background:rgba(255,255,255,.76);border:1px solid rgba(0,0,0,.06);box-shadow:0 8px 24px rgba(16,24,40,.06);font-size:13px;font-weight:900;flex-shrink:0}
.utility-hidden,#themeBtn{display:none!important}
.dashboard-card{border-radius:24px;padding:17px 17px 16px;background:rgba(255,255,255,.76);border:1px solid rgba(0,0,0,.055);box-shadow:0 18px 45px rgba(15,23,42,.07)}
.dashboard-date{font-size:15px;letter-spacing:-.2px}.dashboard-label,.year-text{font-weight:850}.year-num{font-size:28px;letter-spacing:-1px}.year-progress-bar{height:8px;margin-top:15px;background:rgba(0,0,0,.06)}
.header-actions{gap:0}.primary-btn{width:100%;height:48px;border-radius:18px;box-shadow:0 14px 34px rgba(17,17,17,.16);font-size:16px;letter-spacing:-.2px}.btn-plus{font-size:22px;margin-right:7px}
.category-scroll{margin:0 -18px 0;padding-left:18px}.category-row{gap:8px;padding:0 18px 2px 0}.category-pill{height:34px;padding:0 14px;background:rgba(255,255,255,.66);border:1px solid rgba(0,0,0,.05);box-shadow:none}.category-pill-active{background:var(--primary);border-color:var(--primary);box-shadow:0 9px 20px rgba(0,0,0,.12)}
.schedule-view-switch{background:rgba(255,255,255,.58);border:1px solid rgba(0,0,0,.055);padding:4px;border-radius:999px;width:max-content}.schedule-mode-btn{height:30px;box-shadow:none;background:transparent}.schedule-mode-active{background:var(--primary);color:var(--primary-text)}
.list-container{padding-bottom:48px}.count-card,.checklist-card,.festival-card,.subscription-card,.grade-course-card,.calendar-panel,.schedule-container{border-radius:22px;background:rgba(255,255,255,.78);border:1px solid rgba(0,0,0,.055);box-shadow:0 14px 34px rgba(15,23,42,.06);backdrop-filter:blur(22px)}
.count-card,.checklist-card,.festival-card{padding:16px;margin-bottom:11px}.count-icon-box{width:46px;height:46px;border-radius:16px;background:rgba(0,0,0,.045)}.count-title{font-size:16px;letter-spacing:-.2px}.count-number{font-size:28px;letter-spacing:-1px}.tag{font-size:10.5px;background:rgba(0,0,0,.045)}
.mask{background:rgba(15,23,42,.34);backdrop-filter:blur(14px);padding:18px}.tab-picker-panel,.backup-panel,.emoji-panel,.settings-panel,.board-manager-panel{width:min(92%,460px);max-height:84dvh;background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.75);border-radius:28px;box-shadow:0 24px 70px rgba(15,23,42,.23)}
.tab-picker-panel{padding:18px}.tab-picker-title,.emoji-header{font-size:17px;margin-bottom:12px}.tab-picker-item{border-radius:18px;background:#f5f6f8;padding:13px 12px}.tab-picker-active{background:#111}.tab-picker-icon{border-radius:14px}
.settings-panel{padding:18px;overflow:hidden}.settings-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}.settings-title{display:block;font-size:20px;color:#111;font-weight:950;letter-spacing:-.4px}.settings-subtitle{display:block;margin-top:4px;font-size:12px;color:#777;font-weight:700}.settings-close{width:32px;height:32px;border-radius:50%;background:#f1f2f4;color:#111;font-size:22px;line-height:32px;font-weight:700}.settings-list{display:flex;flex-direction:column;gap:10px}.settings-item{width:100%;display:flex;align-items:center;gap:12px;padding:13px;border-radius:20px;background:#f6f7f9;text-align:left}.settings-icon{width:40px;height:40px;border-radius:15px;background:#fff;display:flex;align-items:center;justify-content:center;font-weight:950;font-size:19px;color:#111;box-shadow:0 8px 18px rgba(15,23,42,.05)}.settings-text{flex:1;min-width:0}.settings-text b{display:block;color:#111;font-size:15px;font-weight:950;margin-bottom:3px}.settings-text em{display:block;color:#777;font-size:12px;font-style:normal;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.settings-item strong{color:#111;font-size:12px;font-weight:950;background:#fff;border-radius:999px;padding:7px 10px}
.add-page{background:transparent;padding:0 18px}.add-nav{padding-top:max(38px,env(safe-area-inset-top) + 24px);height:84px}.form-card{border-radius:22px;background:rgba(255,255,255,.78);border:1px solid rgba(0,0,0,.055);box-shadow:0 14px 34px rgba(15,23,42,.055);padding:4px 17px}.save-btn{height:48px;border-radius:18px;margin-bottom:48px}
@media(max-width:360px){.main-view{padding:0 14px}.category-scroll{margin:0 -14px;padding-left:14px}.header-title{font-size:26px}.settings-btn{width:45px}.primary-btn{height:46px}}

/* ===== 全页面滚动修正：不再让卡片列表单独滚动 ===== */
html,
body {
  min-height: 100% !important;
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.page-container {
  min-height: 100dvh !important;
  height: auto !important;
  overflow: visible !important;
}

.main-view {
  min-height: 100dvh !important;
  height: auto !important;
  overflow: visible !important;
}

.content {
  flex: none !important;
  min-height: auto !important;
  position: relative !important;
}

.tab-panel,
.tab-panel.active,
.list-container {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.list-container {
  padding-bottom: calc(34px + env(safe-area-inset-bottom)) !important;
}

.category-scroll,
.schedule-view-switch {
  position: sticky;
  top: 0;
  z-index: 8;
  padding-top: 6px;
  padding-bottom: 8px;
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,0));
  backdrop-filter: blur(10px);
}

/* Course grades v2 */
.grade-course-card {
  -webkit-user-select: none;
  user-select: none;
}
.grade-table-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  text-align: left;
}
.grade-table-title span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.grade-table-title em {
  flex: none;
  font-size: 11px;
  color: var(--text-sub);
  font-style: normal;
  font-weight: 850;
  background: rgba(0,0,0,.045);
  border-radius: 999px;
  padding: 5px 9px;
}
.grade-course-empty {
  padding: 18px 14px;
  text-align: center;
  color: var(--text-sub);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.5;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.grade-add-grid {
  display: grid;
  grid-template-columns: minmax(0,1.2fr) .68fr .68fr auto;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
}
.grade-add-grid .row-input {
  min-width: 0;
  height: 42px;
  padding: 0 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(0,0,0,.08);
  font-size: 13px;
  font-weight: 850;
}
.grade-live-preview.compact {
  margin: 10px 0 0;
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 12px;
}
.draft-grade-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.draft-grade-item {
  display: grid;
  grid-template-columns: 28px minmax(0,1fr) 64px 64px auto;
  align-items: center;
  gap: 7px;
  padding: 9px;
  border-radius: 16px;
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(0,0,0,.07);
}
.draft-grade-name,
.draft-grade-mini {
  min-width: 0;
  height: 36px;
  border: 0;
  outline: none;
  background: rgba(0,0,0,.035);
  border-radius: 12px;
  padding: 0 9px;
  color: var(--text-main);
  font-size: 12px;
  font-weight: 850;
}
.draft-grade-mini { text-align: center; }
@media (max-width: 420px) {
  .grade-add-grid {
    grid-template-columns: 1fr 1fr;
  }
  .grade-add-grid #newGradeName,
  .grade-add-grid #addGradeItemBtn {
    grid-column: 1 / -1;
  }
  .draft-grade-item {
    grid-template-columns: 24px minmax(0,1fr) 54px 54px;
  }
  .draft-grade-item .draft-subitem-delete {
    grid-column: 2 / -1;
    justify-self: end;
  }
}


/* ===== 2026-05 header simplification + grade form fix ===== */
.today-action-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 164px;
  gap:10px;
  align-items:stretch;
}
.compact-today-card{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:14px 16px !important;
  min-height:64px;
}
.compact-today-card .dashboard-label{margin-bottom:4px}
.compact-today-card .dashboard-date{
  display:block;
  max-width:100%;
  font-size:16px !important;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.hidden-year-widget,.hidden-year-progress,.year-widget,.year-progress-bar{display:none!important}
.quick-add-btn{
  width:100%;
  height:auto !important;
  min-height:64px;
  border-radius:24px !important;
  flex:none !important;
  padding:0 14px;
  white-space:nowrap;
}
.header-actions.utility-hidden{display:none!important}

/* Fix: course score add row should never overflow the form card */
.grade-add-grid{
  grid-template-columns:minmax(0,1fr) minmax(78px,.48fr) minmax(78px,.48fr) !important;
  gap:8px !important;
}
.grade-add-grid #addGradeItemBtn{
  grid-column:1 / -1;
  width:100%;
  height:40px;
}
.grade-add-grid .row-input{
  width:100%;
  box-sizing:border-box;
}
.draft-grade-item{
  grid-template-columns:24px minmax(0,1fr) 58px 58px !important;
}
.draft-grade-item .draft-subitem-delete{
  grid-column:2 / -1;
  justify-self:end;
  padding:6px 10px;
}
@media(max-width:420px){
  .today-action-row{grid-template-columns:minmax(0,1fr) 142px;gap:8px}
  .quick-add-btn{font-size:15px;min-height:60px;border-radius:22px!important}
  .compact-today-card{min-height:60px;padding:13px 14px!important}
  .compact-today-card .dashboard-date{font-size:15px!important}
  .grade-add-grid{grid-template-columns:1fr 1fr!important}
  .grade-add-grid #newGradeName{grid-column:1 / -1}
}
@media(max-width:360px){
  .today-action-row{grid-template-columns:1fr;}
  .quick-add-btn{min-height:52px}
}

/* ===== 2026-05 refinement: cleaner today row + grade form ===== */
.today-action-row{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(118px,148px) !important;
  gap:8px !important;
  align-items:stretch !important;
  padding:7px !important;
  border-radius:26px !important;
  background:rgba(255,255,255,.58) !important;
  border:1px solid rgba(0,0,0,.055) !important;
  box-shadow:0 14px 34px rgba(15,23,42,.055) !important;
  backdrop-filter:blur(22px) !important;
}
.compact-today-card{
  min-height:54px !important;
  padding:10px 12px !important;
  border-radius:20px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
.compact-today-card .dashboard-label{
  font-size:11px !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:var(--text-sub) !important;
  margin-bottom:4px !important;
  font-weight:900 !important;
}
.compact-today-card .dashboard-date{
  font-size:17px !important;
  line-height:1.15 !important;
  letter-spacing:-.3px !important;
  font-weight:950 !important;
}
.quick-add-btn{
  min-height:54px !important;
  height:100% !important;
  border-radius:20px !important;
  box-shadow:none !important;
  font-size:15px !important;
  letter-spacing:-.2px !important;
  padding:0 13px !important;
}
.quick-add-btn .btn-plus{
  font-size:20px !important;
  margin-right:5px !important;
}
.hidden-year-widget,.hidden-year-progress,.year-widget,.year-progress-bar{display:none!important}

.grade-form-card{
  overflow:hidden !important;
}
.grade-add-grid.grade-add-grid-clean,
.grade-add-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1.35fr) minmax(72px,.65fr) minmax(72px,.65fr) !important;
  gap:8px !important;
  align-items:stretch !important;
  margin-top:10px !important;
}
.grade-add-grid #addGradeItemBtn{
  grid-column:1 / -1 !important;
  width:100% !important;
  height:42px !important;
  border-radius:16px !important;
  box-shadow:none !important;
  font-size:14px !important;
}
.grade-add-grid .row-input{
  width:100% !important;
  min-width:0 !important;
  height:42px !important;
  padding:0 11px !important;
  border-radius:16px !important;
  background:rgba(0,0,0,.035) !important;
  border:1px solid rgba(0,0,0,.06) !important;
  font-size:13px !important;
  text-align:center !important;
}
.grade-add-grid #newGradeName{text-align:left !important;}
.grade-live-preview,
.grade-live-preview.compact{
  margin-top:8px !important;
  padding:10px 12px !important;
  min-height:0 !important;
  border-radius:16px !important;
  background:rgba(0,0,0,.045) !important;
  color:var(--text-sub) !important;
  box-shadow:none !important;
  font-size:12px !important;
  font-weight:900 !important;
  text-align:center !important;
}
.draft-empty-tip{
  padding:10px 2px 0 !important;
  font-size:12px !important;
  line-height:1.4 !important;
}
.draft-grade-list{gap:7px !important;margin-top:10px !important;}
.draft-grade-item{
  grid-template-columns:22px minmax(0,1fr) 56px 56px auto !important;
  gap:6px !important;
  padding:8px !important;
  border-radius:15px !important;
}
.draft-grade-name,.draft-grade-mini{
  height:34px !important;
  font-size:12px !important;
  border-radius:11px !important;
}
@media(max-width:420px){
  .today-action-row{grid-template-columns:minmax(0,1fr) minmax(108px,132px) !important;gap:7px !important;padding:6px !important;}
  .compact-today-card{min-height:52px !important;padding:9px 10px !important;}
  .compact-today-card .dashboard-date{font-size:15px !important;}
  .quick-add-btn{min-height:52px !important;border-radius:18px !important;font-size:14px !important;}
  .grade-add-grid.grade-add-grid-clean,
  .grade-add-grid{grid-template-columns:minmax(0,1fr) minmax(70px,.58fr) minmax(70px,.58fr) !important;gap:7px !important;}
  .grade-add-grid .row-input{height:40px !important;padding:0 9px !important;font-size:12px !important;}
  .draft-grade-item{grid-template-columns:20px minmax(0,1fr) 52px 52px !important;}
  .draft-grade-item .draft-subitem-delete{grid-column:2 / -1 !important;justify-self:end !important;padding:5px 9px !important;}
}
@media(max-width:350px){
  .today-action-row{grid-template-columns:1fr !important;}
  .quick-add-btn{min-height:46px !important;}
  .grade-add-grid.grade-add-grid-clean,
  .grade-add-grid{grid-template-columns:1fr 1fr !important;}
  .grade-add-grid #newGradeName{grid-column:1 / -1 !important;}
}

/* ===== 2026-05 minimal section header cleanup ===== */
.header{
  gap:10px !important;
}
.today-action-row{
  margin-top:2px !important;
  margin-bottom:2px !important;
}
.hide-today-card .compact-today-card{
  display:none !important;
}
.hide-today-card .today-action-row{
  display:flex !important;
  justify-content:flex-start !important;
  align-items:center !important;
  padding:0 !important;
  margin-top:4px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
.hide-today-card .quick-add-btn{
  width:auto !important;
  min-width:148px !important;
  min-height:42px !important;
  height:42px !important;
  padding:0 18px !important;
  border-radius:999px !important;
  box-shadow:0 10px 24px rgba(17,17,17,.11) !important;
  font-size:14px !important;
}
.hide-today-card[data-current-tab="calendar"] .today-action-row,
.hide-today-card[data-current-tab="festival"] .today-action-row{
  display:none !important;
}
.hide-today-card .content{
  padding-top:4px !important;
}
.hide-today-card[data-current-tab="checklist"] .content,
.hide-today-card[data-current-tab="grades"] .content{
  padding-top:10px !important;
}

/* cleaner cards for removed-today sections */
.hide-today-card .checklist-card,
.hide-today-card .festival-card,
.hide-today-card .grade-course-card,
.hide-today-card .calendar-panel{
  border-radius:24px !important;
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(15,23,42,.055) !important;
  box-shadow:0 10px 28px rgba(15,23,42,.045) !important;
}
.hide-today-card .checklist-card,
.hide-today-card .festival-card{
  padding:15px !important;
}
.hide-today-card .empty-state{
  margin-top:46px !important;
}

/* course grade add form: slimmer and calmer */
.grade-form-card{
  padding:16px !important;
  border-radius:24px !important;
}
.grade-form-card .checklist-form-title{
  font-size:16px !important;
  letter-spacing:-.2px !important;
  margin-bottom:12px !important;
}
.grade-add-grid.grade-add-grid-clean,
.grade-add-grid{
  grid-template-columns:minmax(0,1.2fr) minmax(66px,.52fr) minmax(66px,.52fr) !important;
  gap:7px !important;
}
.grade-add-grid #addGradeItemBtn{
  height:38px !important;
  border-radius:14px !important;
  font-size:13px !important;
  margin-top:0 !important;
}
.grade-live-preview,
.grade-live-preview.compact{
  margin-top:7px !important;
  padding:9px 10px !important;
  border-radius:14px !important;
  background:rgba(15,23,42,.04) !important;
  color:#6b7280 !important;
}
.draft-empty-tip{
  padding-top:8px !important;
  color:#8b8f98 !important;
}

/* compact top chrome */
.header-title{font-size:27px !important;}
.header-subtitle{margin-top:5px !important;}
.switch-tab-btn,.settings-btn{
  background:rgba(255,255,255,.62) !important;
  box-shadow:none !important;
}
.content{padding-top:4px !important;}

@media(max-width:420px){
  .hide-today-card .quick-add-btn{
    min-width:132px !important;
    height:40px !important;
    min-height:40px !important;
    font-size:13px !important;
    padding:0 15px !important;
  }
  .grade-add-grid.grade-add-grid-clean,
  .grade-add-grid{
    grid-template-columns:minmax(0,1fr) minmax(62px,.5fr) minmax(62px,.5fr) !important;
  }
  .grade-add-grid .row-input{
    height:38px !important;
    font-size:12px !important;
    padding:0 8px !important;
  }
}
@media(max-width:350px){
  .hide-today-card .today-action-row{display:block !important;}
  .hide-today-card .quick-add-btn{width:100% !important;}
  .grade-add-grid.grade-add-grid-clean,
  .grade-add-grid{grid-template-columns:1fr 1fr !important;}
  .grade-add-grid #newGradeName{grid-column:1 / -1 !important;}
}


/* Final no-cache/sync fixes */
#backupBtn,
#cloudSyncBtn{
  display:flex;
}
.header-actions.utility-hidden #backupBtn,
.header-actions.utility-hidden #cloudSyncBtn{
  display:flex;
}

/* Stable subscription action buttons: keep 编辑 / 删除 as real tappable buttons. */
.subscription-card .subscription-actions,
.card-actions.subscription-actions{
  grid-column:1 / -1 !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:8px !important;
  width:100% !important;
  margin-top:8px !important;
  padding-top:10px !important;
  border-top:1px solid rgba(0,0,0,.055) !important;
  align-items:center !important;
}
.subscription-card .mini-btn,
.subscription-card .subscription-action-btn,
.card-actions.subscription-actions .mini-btn{
  appearance:none !important;
  -webkit-appearance:none !important;
  min-width:0 !important;
  width:100% !important;
  min-height:38px !important;
  height:38px !important;
  padding:0 10px !important;
  border:1px solid rgba(0,0,0,.06) !important;
  border-radius:13px !important;
  background:var(--tag-bg) !important;
  color:var(--text-main) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:-.1px !important;
  box-shadow:0 6px 14px rgba(15,23,42,.045) !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
}
.subscription-card .subscription-action-btn.renew{
  background:var(--primary) !important;
  color:var(--primary-text) !important;
  border-color:transparent !important;
}
.subscription-card .subscription-action-btn.edit{
  background:rgba(255,255,255,.78) !important;
  color:var(--text-main) !important;
}
.subscription-card .subscription-action-btn.delete,
.subscription-card .mini-btn.delete{
  background:#fff1f1 !important;
  color:#ff3b30 !important;
  border-color:rgba(255,59,48,.12) !important;
}
.subscription-card .mini-btn:active,
.subscription-card .subscription-action-btn:active{
  transform:scale(.985) !important;
  opacity:.86 !important;
}
@media(max-width:360px){
  .subscription-card .subscription-actions,
  .card-actions.subscription-actions{
    gap:6px !important;
  }
  .subscription-card .mini-btn,
  .subscription-card .subscription-action-btn,
  .card-actions.subscription-actions .mini-btn{
    min-height:36px !important;
    height:36px !important;
    border-radius:12px !important;
    font-size:12px !important;
    padding:0 6px !important;
  }
}


/* ===== Fast modal scrolling fix: tab picker / emoji picker ===== */
#tabPickerMask,
#emojiMask {
  touch-action: none !important;
  overscroll-behavior: contain !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

#tabPickerMask .tab-picker-panel,
#emojiMask .emoji-panel {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y !important;
  overscroll-behavior: contain !important;
  transform: translateZ(0) !important;
  will-change: scroll-position !important;
  contain: content !important;
  max-height: calc(100dvh - 72px) !important;
}

#tabPickerMask .tab-picker-item,
#emojiMask .emoji-item {
  touch-action: manipulation !important;
}

#emojiMask .emoji-grid {
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 11px 5px !important;
}

#emojiMask .emoji-item {
  min-height: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}


/* ===== Desktop responsive layout: same mobile visual language, wider arrangement ===== */
.desktop-sidebar{display:none}
@media (min-width: 900px){
  html,body{
    min-height:100%;
    overflow:auto !important;
  }
  .page-container{
    min-height:100vh !important;
    height:auto !important;
    overflow:visible !important;
  }
  .main-view{
    width:min(1280px, calc(100vw - 48px)) !important;
    max-width:none !important;
    min-height:100vh !important;
    margin:0 auto !important;
    padding:28px 0 44px !important;
    display:grid !important;
    grid-template-columns:250px minmax(0,1fr) !important;
    grid-template-rows:auto 1fr !important;
    column-gap:24px !important;
    align-items:start !important;
    overflow:visible !important;
  }
  .desktop-sidebar{
    display:flex !important;
    position:sticky !important;
    top:24px !important;
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    min-height:calc(100vh - 48px) !important;
    flex-direction:column !important;
    gap:18px !important;
    padding:18px !important;
    border-radius:30px !important;
    background:rgba(255,255,255,.62) !important;
    border:1px solid rgba(255,255,255,.72) !important;
    box-shadow:0 18px 54px rgba(15,23,42,.075) !important;
    backdrop-filter:blur(24px) !important;
    -webkit-backdrop-filter:blur(24px) !important;
    z-index:10 !important;
  }
  .desktop-brand{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    padding:4px 2px 10px !important;
  }
  .desktop-logo{
    width:46px !important;
    height:46px !important;
    border-radius:16px !important;
    object-fit:cover !important;
    box-shadow:0 10px 24px rgba(15,23,42,.08) !important;
  }
  .desktop-brand b{
    display:block !important;
    font-size:18px !important;
    font-weight:950 !important;
    letter-spacing:-.5px !important;
    color:var(--text-main) !important;
  }
  .desktop-brand span{
    display:block !important;
    margin-top:3px !important;
    color:var(--text-sub) !important;
    font-size:12px !important;
    font-weight:750 !important;
    white-space:nowrap !important;
  }
  .desktop-nav{
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
  }
  .desktop-nav-item{
    width:100% !important;
    min-height:46px !important;
    display:flex !important;
    align-items:center !important;
    gap:11px !important;
    padding:0 13px !important;
    border-radius:17px !important;
    background:rgba(255,255,255,.56) !important;
    border:1px solid rgba(15,23,42,.04) !important;
    color:var(--text-main) !important;
    text-align:left !important;
    box-shadow:none !important;
    cursor:pointer !important;
    transition:transform .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease !important;
  }
  .desktop-nav-item:hover{
    transform:translateY(-1px) !important;
    background:rgba(255,255,255,.84) !important;
    box-shadow:0 10px 24px rgba(15,23,42,.055) !important;
  }
  .desktop-nav-item:active{transform:scale(.985) !important;}
  .desktop-nav-item span{
    width:28px !important;
    height:28px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:11px !important;
    background:var(--tag-bg) !important;
    font-size:16px !important;
    flex-shrink:0 !important;
  }
  .desktop-nav-item b{
    font-size:14px !important;
    font-weight:950 !important;
  }
  .desktop-nav-active{
    background:var(--primary) !important;
    color:var(--primary-text) !important;
    box-shadow:0 14px 32px rgba(0,0,0,.12) !important;
  }
  .desktop-nav-active span{
    background:rgba(255,255,255,.2) !important;
  }
  .desktop-sidebar-note{
    margin-top:auto !important;
    padding:12px !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.5) !important;
    color:var(--text-sub) !important;
    font-size:12px !important;
    line-height:1.55 !important;
    font-weight:700 !important;
  }
  .header{
    grid-column:2 !important;
    grid-row:1 !important;
    padding:0 0 16px !important;
    gap:12px !important;
    position:relative !important;
    z-index:8 !important;
  }
  .content{
    grid-column:2 !important;
    grid-row:2 !important;
    padding-top:0 !important;
    min-width:0 !important;
  }
  .header-top{
    align-items:flex-start !important;
    padding:16px 18px !important;
    border-radius:28px !important;
    background:rgba(255,255,255,.55) !important;
    border:1px solid rgba(255,255,255,.7) !important;
    box-shadow:0 16px 42px rgba(15,23,42,.055) !important;
    backdrop-filter:blur(22px) !important;
    -webkit-backdrop-filter:blur(22px) !important;
  }
  .header-title-row{padding-right:0 !important;}
  .header-title{font-size:38px !important;letter-spacing:-.055em !important;}
  .header-subtitle{font-size:14px !important;}
  .switch-tab-btn{display:none !important;}
  .settings-btn{
    width:64px !important;
    height:36px !important;
    align-self:flex-start !important;
  }
  .today-action-row{
    max-width:none !important;
    grid-template-columns:minmax(0,1fr) 184px !important;
  }
  .hide-today-card .today-action-row{
    display:flex !important;
  }
  .category-scroll,.schedule-view-switch{
    position:relative !important;
    top:auto !important;
    background:transparent !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    padding-top:0 !important;
  }
  .category-row{display:flex !important;flex-wrap:wrap !important;}
  .list-container{
    padding-bottom:32px !important;
    overflow:visible !important;
  }
  #countdownList,#checklistList,#festivalList,#subscriptionList{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
    align-items:start !important;
  }
  #countdownList > .empty-state,
  #checklistList > .empty-state,
  #festivalList > .empty-state,
  #subscriptionList > .empty-state,
  #subscriptionList > .subscription-hero,
  #subscriptionList > .currency-rate-note,
  #subscriptionList > .subscription-next-card,
  #festivalList > .festival-hero{
    grid-column:1 / -1 !important;
  }
  .count-card,.checklist-card,.festival-card,.subscription-card{
    margin-bottom:0 !important;
    height:100% !important;
  }
  .calendar-panel,.schedule-container{
    max-width:none !important;
  }
  .calendar-panel{padding:24px !important;}
  .calendar-day{min-height:68px !important;}
  .add-page{
    top:50% !important;
    bottom:auto !important;
    left:calc(50% + 137px) !important;
    width:min(560px, calc(100vw - 340px)) !important;
    max-width:560px !important;
    max-height:86vh !important;
    height:auto !important;
    transform:translate(-50%,-50%) !important;
    border-radius:30px !important;
    padding:0 22px !important;
    background:var(--main-bg) !important;
    border:1px solid rgba(255,255,255,.72) !important;
    box-shadow:0 28px 90px rgba(15,23,42,.22) !important;
    overflow-y:auto !important;
  }
  .add-nav{padding-top:22px !important;height:70px !important;}
  .add-hero{margin-top:8px !important;margin-bottom:18px !important;}
  .save-btn{margin-bottom:24px !important;}
  .mask{backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
}
@media (min-width:1180px){
  #countdownList,#checklistList,#festivalList,#subscriptionList{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  #subscriptionList > .subscription-hero,
  #subscriptionList > .currency-rate-note,
  #subscriptionList > .subscription-next-card,
  #festivalList > .festival-hero{
    grid-column:1 / -1 !important;
  }
}
@media (min-width:900px) and (max-width:1050px){
  .main-view{
    width:min(100vw - 32px, 1000px) !important;
    grid-template-columns:218px minmax(0,1fr) !important;
    column-gap:18px !important;
  }
  .desktop-sidebar{padding:14px !important;border-radius:26px !important;}
  .desktop-brand span{display:none !important;}
  #countdownList,#checklistList,#festivalList,#subscriptionList{
    grid-template-columns:1fr !important;
  }
  .add-page{
    left:calc(50% + 118px) !important;
    width:min(540px, calc(100vw - 288px)) !important;
  }
}

/* Language setting: compact, centered selector inside settings */
.settings-language-item{
  cursor:default!important;
  align-items:center!important;
}
.settings-language-item .settings-text{
  min-width:0!important;
}
.settings-select{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:128px!important;
  max-width:168px!important;
  height:40px!important;
  min-height:40px!important;
  border:0!important;
  outline:0!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#111!important;
  font-size:15px!important;
  font-weight:950!important;
  line-height:40px!important;
  text-align:center!important;
  text-align-last:center!important;
  padding:0 28px 0 18px!important;
  box-shadow:0 8px 20px rgba(15,23,42,.055)!important;
  appearance:auto!important;
  -webkit-appearance:menulist!important;
}
.settings-select:focus{
  box-shadow:0 0 0 2px rgba(0,0,0,.08),0 8px 20px rgba(15,23,42,.055)!important;
}
.settings-select option{
  text-align:center!important;
}
@media(max-width:380px){
  .settings-select{
    width:auto!important;
    min-width:136px!important;
    max-width:160px!important;
    height:38px!important;
    min-height:38px!important;
    line-height:38px!important;
    font-size:14px!important;
    padding-left:10px!important;
    padding-right:22px!important;
  }
  .settings-language-item{gap:9px!important;}
}

/* Stable desktop shell: left navigation stays in its column; right side scrolls naturally. */
@media (min-width:900px){
  html,body{height:100%;overflow:hidden!important;}
  .page-container{height:100vh!important;overflow:hidden!important;}
  .main-view{
    width:min(1320px, calc(100vw - 48px))!important;
    max-width:none!important;
    height:100vh!important;
    min-height:0!important;
    padding:24px 0!important;
    display:grid!important;
    grid-template-columns:250px minmax(0,1fr)!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    column-gap:24px!important;
    row-gap:14px!important;
    overflow:hidden!important;
    align-items:stretch!important;
  }
  .desktop-sidebar{
    grid-column:1!important;
    grid-row:1 / 3!important;
    position:sticky!important;
    top:0!important;
    height:calc(100vh - 48px)!important;
    min-height:0!important;
    overflow:hidden!important;
    align-self:start!important;
  }
  .header{grid-column:2!important;grid-row:1!important;min-height:0!important;margin:0!important;padding:0!important;}
  .content{
    grid-column:2!important;
    grid-row:2!important;
    min-height:0!important;
    height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding-right:4px!important;
  }
  .tab-panel.active{display:block!important;height:auto!important;min-height:0!important;overflow:visible!important;}
  .list-container{height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;padding-bottom:44px!important;}

  #countdownList,#checklistList,#festivalList,#subscriptionList{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:14px!important;
    align-content:start!important;
    align-items:start!important;
    margin-top:0!important;
    padding-top:0!important;
  }
  #countdownList > .empty-state,
  #checklistList > .empty-state,
  #festivalList > .festival-hero,
  #subscriptionList > .subscription-hero,
  #subscriptionList > .currency-rate-note,
  #subscriptionList > .subscription-next-card{
    grid-column:1 / -1!important;
  }
  .count-card,.checklist-card,.festival-card,.subscription-card{height:auto!important;min-height:0!important;margin-bottom:0!important;}

  .festival-region-switch{
    width:100%!important;
    max-width:none!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px!important;
    margin:0 0 18px!important;
  }
  #festivalList > .festival-region-switch{grid-column:1 / -1!important;}
  .festival-region-switch button{width:100%!important;min-width:0!important;height:48px!important;border-radius:999px!important;}
}
@media (min-width:900px) and (max-width:1179px){
  .main-view{grid-template-columns:236px minmax(0,1fr)!important;column-gap:20px!important;width:min(1120px, calc(100vw - 40px))!important;}
  #countdownList,#checklistList,#festivalList,#subscriptionList{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (min-width:900px) and (max-width:1050px){
  .main-view{grid-template-columns:218px minmax(0,1fr)!important;column-gap:18px!important;width:calc(100vw - 32px)!important;}
  #countdownList,#checklistList,#festivalList,#subscriptionList{grid-template-columns:1fr!important;}
}

/* ===== Calendar day detail modal ===== */
.calendar-detail-panel{width:min(92%,460px);max-height:84dvh;background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.75);border-radius:28px;padding:18px;overflow:hidden;box-shadow:0 24px 70px rgba(15,23,42,.23);display:flex;flex-direction:column;color:#111}.calendar-detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:14px}.calendar-detail-title{display:block;font-size:19px;font-weight:900;line-height:1.25}.calendar-detail-sub{display:block;margin-top:5px;font-size:12px;color:#777;font-weight:700}.calendar-detail-body{overflow-y:auto;display:flex;flex-direction:column;gap:14px;padding:2px 2px 4px;min-height:140px}.calendar-detail-section-title{font-size:13px;font-weight:900;color:#777;margin:2px 0 8px}.calendar-detail-item{width:100%;display:flex;align-items:center;gap:11px;background:#f5f5f7;border-radius:18px;padding:12px;margin-bottom:9px;text-align:left}.calendar-detail-item:active{transform:scale(.985)}.calendar-detail-icon{width:42px;height:42px;border-radius:14px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}.calendar-detail-info{min-width:0;flex:1}.calendar-detail-info b{display:block;font-size:15px;font-weight:900;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.calendar-detail-info span{display:block;font-size:12px;color:#777;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.calendar-detail-badge{font-size:11px;font-weight:900;color:#777;background:#fff;border-radius:999px;padding:5px 8px;flex-shrink:0}.calendar-detail-empty{min-height:190px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#999}.calendar-detail-empty div{width:72px;height:72px;border-radius:50%;background:#f5f5f7;display:flex;align-items:center;justify-content:center;font-size:34px;margin-bottom:13px}.calendar-detail-empty b{font-size:17px;font-weight:900;color:#111;margin-bottom:6px}.calendar-detail-empty span{font-size:13px;color:#777}.calendar-detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.calendar-detail-primary,.calendar-detail-secondary{height:42px;border-radius:15px;font-size:14px;font-weight:900}.calendar-detail-primary{background:#111;color:#fff}.calendar-detail-secondary{background:#f1f1f4;color:#111}@media(max-width:360px){.calendar-detail-panel{padding:15px;border-radius:24px}.calendar-detail-actions{grid-template-columns:1fr}.calendar-detail-item{padding:10px}.calendar-detail-badge{display:none}}


/* Navigation reorder */
.desktop-nav-item,
.tab-picker-item{
  touch-action: manipulation;
  user-select: none;
}
.desktop-nav.nav-reorder-active .desktop-nav-item,
.tab-picker-panel.nav-reorder-active .tab-picker-item{
  cursor: grabbing;
  transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
}
.desktop-nav-item.nav-dragging,
.tab-picker-item.nav-dragging{
  opacity: .92;
  transform: scale(.985);
  box-shadow: 0 18px 38px rgba(0,0,0,.18);
  z-index: 20;
}
.desktop-nav-item::after,
.tab-picker-item::after{
  content: "⋮⋮";
  margin-left: auto;
  color: rgba(0,0,0,.24);
  font-weight: 900;
  letter-spacing: -2px;
  opacity: 0;
  transition: opacity .15s ease;
}
.desktop-nav:hover .desktop-nav-item::after,
.tab-picker-panel:hover .tab-picker-item::after,
.desktop-nav.nav-reorder-active .desktop-nav-item::after,
.tab-picker-panel.nav-reorder-active .tab-picker-item::after{
  opacity: 1;
}
.desktop-nav-active::after{
  color: rgba(255,255,255,.38);
}

/* Improved navigation drag sorting */
.desktop-nav-item,
.tab-picker-item{
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
}
.desktop-nav.nav-reorder-active,
.tab-picker-panel.nav-reorder-active{
  cursor: grabbing;
}
.desktop-nav.nav-reorder-active .desktop-nav-item,
.tab-picker-panel.nav-reorder-active .tab-picker-item{
  transition: transform .18s cubic-bezier(.2,.8,.2,1), opacity .18s ease, box-shadow .18s ease;
}
.desktop-nav-item.nav-drag-source,
.tab-picker-item.nav-drag-source{
  opacity: .18 !important;
  transform: scale(.98) !important;
}
.nav-drag-ghost{
  position: fixed !important;
  z-index: 99999 !important;
  pointer-events: none !important;
  margin: 0 !important;
  opacity: .98 !important;
  transform: scale(1.025) rotate(.4deg) !important;
  box-shadow: 0 22px 50px rgba(0,0,0,.24) !important;
  transition: none !important;
}
.nav-drop-line{
  height: 6px;
  border-radius: 999px;
  background: #111;
  margin: 8px 10px 14px;
  box-shadow: 0 6px 14px rgba(0,0,0,.22);
  flex: 0 0 6px;
  animation: navDropLineIn .14s ease-out both;
}
.tab-picker-panel .nav-drop-line{
  margin: 7px 8px 13px;
}
@keyframes navDropLineIn{
  from{opacity:0;transform:scaleX(.68)}
  to{opacity:1;transform:scaleX(1)}
}

/* Smoother navigation drag interaction */
.desktop-nav-item,
.tab-picker-item{
  touch-action: none;
  cursor: grab;
  will-change: transform;
}
.desktop-nav.nav-reorder-active,
.tab-picker-panel.nav-reorder-active{
  overscroll-behavior: contain;
}
.nav-drag-ghost{
  will-change: transform;
  transform: translate3d(0,0,0) scale(1.025) !important;
  border-radius: inherit !important;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.nav-drop-line{
  pointer-events: none;
  height: 7px;
  flex-basis: 7px;
  transition: margin .1s ease, opacity .1s ease, transform .1s ease;
}

/* Mobile modal scroll lock fix */
body.modal-scroll-locked{
  position: fixed !important;
  width: 100% !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
}
/* The root element stays in normal flow (only body is pinned). Putting <html>
 * into position:fixed breaks root-background propagation on iOS, exposing the
 * black system canvas in the status-bar safe area when a modal opens. */
html.modal-scroll-locked{
  overflow: hidden !important;
  overscroll-behavior: none !important;
}
body.modal-scroll-locked .page-container,
body.modal-scroll-locked .main-view,
body.modal-scroll-locked .content,
body.modal-scroll-locked .list-container{
  overscroll-behavior: none !important;
}
.mask:not(.hidden),
.detail-overlay:not(.hidden){
  overscroll-behavior: contain !important;
  touch-action: none !important;
}
.mask:not(.hidden) .tab-picker-panel,
.mask:not(.hidden) .emoji-panel,
.mask:not(.hidden) .backup-panel,
.mask:not(.hidden) .settings-panel,
.mask:not(.hidden) .board-manager-panel,
.mask:not(.hidden) .calendar-detail-body,
.mask:not(.hidden) .calendar-detail-panel{
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  touch-action: pan-y !important;
}
#tabPickerMask .tab-picker-panel:not(.nav-reorder-active) .tab-picker-item{
  touch-action: none !important;
}
#tabPickerMask .tab-picker-panel.nav-reorder-active .tab-picker-item{
  touch-action: none !important;
}

/* Drag refinement: keep ghost size fixed and prevent accidental mobile reorder */
.nav-drag-ghost{
  box-sizing: border-box !important;
  width: var(--nav-ghost-w, auto) !important;
  height: var(--nav-ghost-h, auto) !important;
  min-width: var(--nav-ghost-w, auto) !important;
  max-width: var(--nav-ghost-w, auto) !important;
  min-height: var(--nav-ghost-h, auto) !important;
  max-height: var(--nav-ghost-h, auto) !important;
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  overflow: hidden !important;
}


/* v61: mobile tab picker selected item readability fix */
#tabPickerMask .tab-picker-item.tab-picker-active,
.tab-picker-panel .tab-picker-item.tab-picker-active{
  background: var(--primary, #111) !important;
  color: var(--primary-text, #fff) !important;
}
#tabPickerMask .tab-picker-item.tab-picker-active .tab-picker-text b,
#tabPickerMask .tab-picker-item.tab-picker-active .tab-picker-text em,
#tabPickerMask .tab-picker-item.tab-picker-active .tab-picker-check,
.tab-picker-panel .tab-picker-item.tab-picker-active .tab-picker-text b,
.tab-picker-panel .tab-picker-item.tab-picker-active .tab-picker-text em,
.tab-picker-panel .tab-picker-item.tab-picker-active .tab-picker-check{
  color: var(--primary-text, #fff) !important;
  opacity: 1 !important;
}
#tabPickerMask .tab-picker-item.tab-picker-active .tab-picker-icon,
.tab-picker-panel .tab-picker-item.tab-picker-active .tab-picker-icon{
  background: rgba(255,255,255,.16) !important;
}
#tabPickerMask .tab-picker-item.tab-picker-active::after,
.tab-picker-panel .tab-picker-item.tab-picker-active::after{
  color: rgba(255,255,255,.55) !important;
}

/* v64 calendar month/year picker */
.calendar-title-btn{
  appearance:none;
  border:0;
  background:transparent;
  cursor:pointer;
  padding:6px 14px;
  border-radius:999px;
  transition:background .15s ease, transform .15s ease;
}
.calendar-title-btn:active{transform:scale(.98);background:rgba(0,0,0,.05)}
.calendar-title-btn::after{content:' ▾';font-size:.72em;color:var(--text-sub);font-weight:900;vertical-align:middle}
.calendar-jump-modal{position:fixed;inset:0;z-index:1200;background:rgba(0,0,0,.42);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:22px}
.calendar-jump-card{width:min(92vw,390px);background:rgba(255,255,255,.98);border-radius:24px;padding:20px;box-shadow:0 24px 60px rgba(0,0,0,.22);color:#111}
.calendar-jump-title{text-align:center;font-size:20px;font-weight:950;margin-bottom:16px;letter-spacing:-.4px}
.calendar-jump-row{display:flex;align-items:center;justify-content:space-between;background:#f3f4f6;border-radius:16px;padding:12px 14px;margin-bottom:14px;font-weight:900}
.calendar-jump-row select{border:0;background:#fff;border-radius:12px;padding:8px 12px;font-weight:900;outline:0;min-width:128px;text-align:center}
.calendar-jump-months{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}
.calendar-jump-month{height:42px;border-radius:14px;background:#f3f4f6;color:#111;font-size:14px;font-weight:900;display:flex;align-items:center;justify-content:center}
.calendar-jump-month.active{background:#111;color:#fff;box-shadow:0 10px 20px rgba(0,0,0,.16)}
.calendar-jump-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.calendar-jump-actions button{height:42px;border-radius:14px;background:#f3f4f6;color:#111;font-size:14px;font-weight:900}
.calendar-jump-actions button:last-child{background:#111;color:#fff}

/* Translation training */
.translation-hero{
  max-width:980px;margin:0 auto 18px;padding:34px 22px;text-align:center;border-radius:30px;
  background:linear-gradient(135deg,rgba(244,242,255,.9),rgba(238,253,255,.85));box-shadow:0 18px 45px rgba(20,24,40,.06);
}
.translation-icon{width:64px;height:64px;margin:0 auto 14px;border-radius:20px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:32px;box-shadow:0 10px 28px rgba(0,0,0,.08)}
.translation-hero h2{margin:0;font-size:34px;font-weight:950;letter-spacing:-1px;color:#101828}
.translation-hero p{margin:12px auto 22px;max-width:760px;color:#667085;font-size:16px;font-weight:800;line-height:1.7}
.translation-select-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:18px}
.translation-select-row select{min-width:250px;border:1px solid rgba(17,17,17,.12);background:#fff;border-radius:16px;padding:14px 16px;font-weight:900;font-size:15px;color:#111;box-shadow:0 8px 20px rgba(0,0,0,.06)}
.translation-mode-row{display:inline-flex;gap:6px;padding:6px;border-radius:18px;background:rgba(16,24,40,.08)}
.translation-mode-row button{border:0;background:transparent;border-radius:14px;padding:11px 26px;font-weight:950;color:#667085}
.translation-mode-row button.active{background:#fff;color:#111;box-shadow:0 8px 18px rgba(0,0,0,.08)}
.translation-practice-card,.translation-library-card{max-width:980px;margin:0 auto 18px;padding:28px;border-radius:28px;background:rgba(255,255,255,.92);box-shadow:0 18px 46px rgba(20,24,40,.07);border:1px solid rgba(17,17,17,.05)}
.translation-section-label{display:flex;align-items:center;gap:10px;margin:8px 0 14px;color:#5544f5;font-size:15px;font-weight:950}
.translation-section-label i{width:10px;height:10px;border-radius:50%;background:#5544f5;display:block}
.translation-source{font-size:20px;line-height:1.9;font-weight:800;color:#101828;letter-spacing:.02em;margin-bottom:16px}
.translation-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
.translation-meta span{padding:6px 10px;border-radius:999px;background:#f2f4f7;color:#667085;font-size:12px;font-weight:900}
.translation-answer{width:100%;min-height:180px;border:1px solid rgba(17,17,17,.12);border-radius:20px;padding:18px 20px;font-size:18px;line-height:1.75;font-weight:700;resize:vertical;box-sizing:border-box;background:#fff;outline:none;color:#101828}
.translation-answer:focus{border-color:#5b43ff;box-shadow:0 0 0 4px rgba(91,67,255,.12)}
.translation-actions{display:flex;gap:12px;justify-content:flex-end;align-items:center;flex-wrap:wrap;margin-top:16px}
.translation-actions button,.translation-library-card button{border:1px solid rgba(17,17,17,.12);background:#fff;border-radius:16px;padding:13px 18px;font-weight:950;color:#111;box-shadow:0 8px 18px rgba(0,0,0,.05)}
.translation-actions button.primary{background:#5b43ff;color:#fff;border-color:#5b43ff;box-shadow:0 14px 26px rgba(91,67,255,.26)}
.translation-actions button.secondary{background:#f8fafc;color:#344054}
.translation-reference{margin-top:18px;padding:18px;border-radius:18px;background:#f8fafc;color:#344054;line-height:1.75;font-weight:750}
.translation-reference b{display:block;color:#111;margin-bottom:8px;font-size:16px}.translation-reference p{margin:0 0 8px;font-size:16px}.translation-reference em{color:#667085;font-style:normal;font-size:13px}
.translation-library-card{display:flex;justify-content:space-between;align-items:center;gap:14px}.translation-library-card div{display:flex;flex-direction:column;gap:4px}.translation-library-card b{font-size:18px;font-weight:950}.translation-library-card span{color:#667085;font-size:13px;font-weight:800}
@media(max-width:760px){.translation-hero{margin:0 0 14px;padding:28px 16px;border-radius:26px}.translation-hero h2{font-size:28px}.translation-select-row select{width:100%;min-width:0}.translation-practice-card,.translation-library-card{margin:0 0 14px;padding:20px;border-radius:24px}.translation-source{font-size:18px}.translation-actions{justify-content:stretch}.translation-actions button{flex:1}.translation-library-card{align-items:stretch;flex-direction:column}.translation-library-card button{width:100%}}

/* Translation training v70: category list mode */
.translation-hero-compact{padding-bottom:30px}
.translation-single-select select{min-width:min(520px,100%)}
.translation-list-summary{max-width:980px;margin-bottom:18px}
.translation-list-item{margin-bottom:20px}
.translation-item-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid rgba(17,17,17,.06)}
.translation-item-head b{font-size:20px;font-weight:950;color:#101828}
.translation-item-head span{padding:7px 10px;border-radius:999px;background:#eef2ff;color:#4f46e5;font-size:12px;font-weight:950}
.translation-list-item .translation-source{font-size:19px;line-height:1.85}
.translation-list-item .translation-answer{min-height:130px;font-size:16px;line-height:1.7}
@media(max-width:760px){.translation-item-head{align-items:flex-start;flex-direction:column}.translation-item-head b{font-size:18px}.translation-list-item .translation-source{font-size:17px}.translation-list-item .translation-answer{min-height:120px}}

.translation-reference.hidden{display:none!important}
.translation-actions button.secondary{background:#f8fafc;color:#344054}

/* sync stability panel */
.cloud-menu-mask.hidden{display:none!important}
.cloud-menu-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:10px}
.cloud-menu-head h3{margin-bottom:6px!important}
.cloud-menu-head p{margin-bottom:0!important}
.cloud-menu-head button{width:34px;height:34px;border-radius:999px;background:#f1f1f4;color:#111;font-size:22px;font-weight:900;line-height:1;flex-shrink:0}
.cloud-menu-user{display:grid;gap:6px}
.cloud-menu-user b{font-size:14px;font-weight:950;color:#111}
.cloud-menu-user span{display:block;color:#646b76;font-size:12px;font-weight:800}
.cloud-sync-diagnostic-card{word-break:normal}
.cloud-sync-diagnostic-card span{line-height:1.38}
.cloud-sync-diagnostic-card .cloud-status-error{color:#b91c1c}
.cloud-sync-short-note{margin:0 0 12px;color:#646b76;font-size:13px;font-weight:700;line-height:1.45}
.sync-status-card{gap:4px;margin-bottom:10px}
.cloud-menu-actions button:disabled{opacity:.42;cursor:not-allowed;filter:grayscale(.3)}
.cloud-menu-actions button:not(:disabled):active{transform:scale(.985)}
/* Design System v3: keep cloud sync typography neutral without overriding every
 * descendant. Component-specific tracking is handled in css/ui-polish.css. */
#app{letter-spacing:-0.006em}



/* v103: restore v98 IELTS practice UI */
/* Translation training */
.translation-hero{
  max-width:980px;margin:0 auto 18px;padding:34px 22px;text-align:center;border-radius:30px;
  background:linear-gradient(135deg,rgba(244,242,255,.9),rgba(238,253,255,.85));box-shadow:0 18px 45px rgba(20,24,40,.06);
}
.translation-icon{width:64px;height:64px;margin:0 auto 14px;border-radius:20px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:32px;box-shadow:0 10px 28px rgba(0,0,0,.08)}
.translation-hero h2{margin:0;font-size:34px;font-weight:950;letter-spacing:-1px;color:#101828}
.translation-hero p{margin:12px auto 22px;max-width:760px;color:#667085;font-size:16px;font-weight:800;line-height:1.7}
.translation-select-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:18px}
.translation-select-row select{min-width:250px;border:1px solid rgba(17,17,17,.12);background:#fff;border-radius:16px;padding:14px 16px;font-weight:900;font-size:15px;color:#111;box-shadow:0 8px 20px rgba(0,0,0,.06)}
.translation-mode-row{display:inline-flex;gap:6px;padding:6px;border-radius:18px;background:rgba(16,24,40,.08)}
.translation-mode-row button{border:0;background:transparent;border-radius:14px;padding:11px 26px;font-weight:950;color:#667085}
.translation-mode-row button.active{background:#fff;color:#111;box-shadow:0 8px 18px rgba(0,0,0,.08)}
.translation-practice-card,.translation-library-card{max-width:980px;margin:0 auto 18px;padding:28px;border-radius:28px;background:rgba(255,255,255,.92);box-shadow:0 18px 46px rgba(20,24,40,.07);border:1px solid rgba(17,17,17,.05)}
.translation-section-label{display:flex;align-items:center;gap:10px;margin:8px 0 14px;color:#5544f5;font-size:15px;font-weight:950}
.translation-section-label i{width:10px;height:10px;border-radius:50%;background:#5544f5;display:block}
.translation-source{font-size:20px;line-height:1.9;font-weight:800;color:#101828;letter-spacing:.02em;margin-bottom:16px}
.translation-meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
.translation-meta span{padding:6px 10px;border-radius:999px;background:#f2f4f7;color:#667085;font-size:12px;font-weight:900}
.translation-answer{width:100%;min-height:180px;border:1px solid rgba(17,17,17,.12);border-radius:20px;padding:18px 20px;font-size:18px;line-height:1.75;font-weight:700;resize:vertical;box-sizing:border-box;background:#fff;outline:none;color:#101828}
.translation-answer:focus{border-color:#5b43ff;box-shadow:0 0 0 4px rgba(91,67,255,.12)}
.translation-actions{display:flex;gap:12px;justify-content:flex-end;align-items:center;flex-wrap:wrap;margin-top:16px}
.translation-actions button,.translation-library-card button{border:1px solid rgba(17,17,17,.12);background:#fff;border-radius:16px;padding:13px 18px;font-weight:950;color:#111;box-shadow:0 8px 18px rgba(0,0,0,.05)}
.translation-actions button.primary{background:#5b43ff;color:#fff;border-color:#5b43ff;box-shadow:0 14px 26px rgba(91,67,255,.26)}
.translation-actions button.secondary{background:#f8fafc;color:#344054}
.translation-reference{margin-top:18px;padding:18px;border-radius:18px;background:#f8fafc;color:#344054;line-height:1.75;font-weight:750}
.translation-reference b{display:block;color:#111;margin-bottom:8px;font-size:16px}.translation-reference p{margin:0 0 8px;font-size:16px}.translation-reference em{color:#667085;font-style:normal;font-size:13px}
.translation-library-card{display:flex;justify-content:space-between;align-items:center;gap:14px}.translation-library-card div{display:flex;flex-direction:column;gap:4px}.translation-library-card b{font-size:18px;font-weight:950}.translation-library-card span{color:#667085;font-size:13px;font-weight:800}
@media(max-width:760px){.translation-hero{margin:0 0 14px;padding:28px 16px;border-radius:26px}.translation-hero h2{font-size:28px}.translation-select-row select{width:100%;min-width:0}.translation-practice-card,.translation-library-card{margin:0 0 14px;padding:20px;border-radius:24px}.translation-source{font-size:18px}.translation-actions{justify-content:stretch}.translation-actions button{flex:1}.translation-library-card{align-items:stretch;flex-direction:column}.translation-library-card button{width:100%}}

/* Translation training v70: category list mode */
.translation-hero-compact{padding-bottom:30px}
.translation-single-select select{min-width:min(520px,100%)}
.translation-list-summary{max-width:980px;margin-bottom:18px}
.translation-list-item{margin-bottom:20px}
.translation-item-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid rgba(17,17,17,.06)}
.translation-item-head b{font-size:20px;font-weight:950;color:#101828}
.translation-item-head span{padding:7px 10px;border-radius:999px;background:#eef2ff;color:#4f46e5;font-size:12px;font-weight:950}
.translation-list-item .translation-source{font-size:19px;line-height:1.85}
.translation-list-item .translation-answer{min-height:130px;font-size:16px;line-height:1.7}
@media(max-width:760px){.translation-item-head{align-items:flex-start;flex-direction:column}.translation-item-head b{font-size:18px}.translation-list-item .translation-source{font-size:17px}.translation-list-item .translation-answer{min-height:120px}}

.translation-reference.hidden{display:none!important}
.translation-actions button.secondary{background:#f8fafc;color:#344054}

/* v72 IELTS practice hub */
.ielts-practice-hero{padding-bottom:32px!important;}
.ielts-practice-switch{display:inline-flex;gap:8px;background:#e9eef5;border:1px solid rgba(16,24,40,.08);border-radius:24px;padding:6px;margin:22px auto 6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.ielts-mode-btn{border:0;border-radius:18px;padding:12px 24px;font-weight:900;font-size:16px;background:transparent;color:#667085;cursor:pointer;transition:.18s ease;white-space:nowrap}
.ielts-mode-btn.active{background:#fff;color:#101828;box-shadow:0 10px 24px rgba(16,24,40,.12)}
.ielts-listening-card{max-width:880px;margin:24px auto;background:rgba(255,255,255,.9);border:1px solid rgba(16,24,40,.08);border-radius:28px;padding:30px;box-shadow:0 20px 60px rgba(16,24,40,.08);display:grid;gap:18px;align-items:center}
.ielts-listening-card b{font-size:26px;display:block;margin-bottom:8px}.ielts-listening-card span,.ielts-listening-card p{color:#667085;font-weight:700;line-height:1.7}.ielts-listening-card .primary{justify-self:start;border:0;border-radius:18px;background:#111;color:#fff;padding:15px 26px;font-weight:900;font-size:16px;cursor:pointer;box-shadow:0 12px 28px rgba(16,24,40,.16)}
@media(max-width:720px){.ielts-practice-switch{width:100%;display:grid;grid-template-columns:1fr 1fr}.ielts-mode-btn{padding:11px 10px}.ielts-listening-card{margin:16px 0;border-radius:22px;padding:22px}.ielts-listening-card .primary{width:100%;}}



/* v103 IELTS-only refinements */
#translationTrainingPanel .translation-hero{background:linear-gradient(135deg,#eef2ff 0%,#f8fafc 52%,#fff 100%);border:1px solid rgba(16,24,40,.06);box-shadow:0 22px 58px rgba(16,24,40,.08);}
#translationTrainingPanel .translation-icon{color:inherit;}
#translationTrainingPanel .translation-practice-card,#translationTrainingPanel .translation-library-card,#translationTrainingPanel .ielts-listening-card{backdrop-filter:blur(14px);}
#translationTrainingPanel .translation-source{background:transparent;padding:0;}
#translationTrainingPanel .translation-actions button{cursor:pointer;}


.ielts-hero-pro{background:linear-gradient(135deg,#eef2ff 0%,#f7fbff 48%,#ecfeff 100%)!important;border:1px solid rgba(79,70,229,.10)!important;box-shadow:0 24px 70px rgba(79,70,229,.10)!important}.ielts-kicker{display:inline-flex;margin:0 auto 10px;padding:7px 12px;border-radius:999px;background:rgba(79,70,229,.10);color:#4f46e5;font-size:12px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.ielts-question-card{border:1px solid rgba(79,70,229,.08);box-shadow:0 18px 44px rgba(31,41,55,.07)}.ielts-question-card .translation-item-head small{display:block;color:#667085;font-weight:900;margin-bottom:4px;letter-spacing:.05em;text-transform:uppercase}.ielts-progress-card{border-left:6px solid #6366f1}.ielts-learning-note{margin:14px 0;padding:14px 16px;border-radius:16px;background:#fff;border:1px solid rgba(16,24,40,.06)}.ielts-learning-note b{margin-top:8px}.ielts-learning-note p{color:#475467;font-weight:750}.ielts-routine{padding:16px;border-radius:18px;background:#f8fafc;border:1px solid rgba(16,24,40,.06)}.ielts-routine b{font-size:16px!important}.ielts-routine span{display:block;margin-top:6px}.translation-single-select{align-items:center}.translation-single-select select{box-shadow:0 12px 24px rgba(79,70,229,.08)}
.cloud-conflict-note{position:fixed;right:18px;bottom:80px;z-index:9999;border-radius:18px;background:#111827;color:#fff;padding:12px 14px;font-size:13px;font-weight:800;box-shadow:0 18px 40px rgba(0,0,0,.18)}

#translationCategorySelect option{font-weight:800;}
/* Google Drive login reminder, kept separate from the restored 1.6.5 UI. */
.cloud-login-prompt-mask{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.42);backdrop-filter:blur(10px);padding:20px;}
.cloud-login-prompt{width:min(92vw,390px);border-radius:24px;background:rgba(255,255,255,.98);box-shadow:0 24px 70px rgba(0,0,0,.24);padding:20px;display:grid;gap:14px;color:#111;}
.cloud-login-icon{width:48px;height:48px;border-radius:18px;background:#111;color:#fff;display:grid;place-items:center;font-size:24px;box-shadow:0 12px 26px rgba(0,0,0,.16);}
.cloud-login-copy{display:grid;gap:7px;}
.cloud-login-copy b{font-size:20px;font-weight:950;line-height:1.2;}
.cloud-login-copy span{font-size:13px;font-weight:750;line-height:1.55;color:#777;}
.cloud-login-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.cloud-login-actions button{height:44px;border-radius:16px;background:#111;color:#fff;font-size:14px;font-weight:950;}
.cloud-login-actions button.secondary{background:#f2f2f4;color:#333;}
.cloud-login-actions button:disabled{opacity:.58;}
@media(max-width:640px){.cloud-login-actions{grid-template-columns:1fr;}}

/* IELTS sentence translation fullscreen challenge */
.ielts-summary-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;}
.ielts-summary-actions button{min-height:42px;border-radius:16px;padding:0 16px;font-size:14px;font-weight:950;}
.ielts-summary-actions button.primary{background:#111;color:#fff;box-shadow:0 12px 26px rgba(15,23,42,.14);}
.ielts-summary-actions button:disabled{opacity:.42;box-shadow:none;}
body.ielts-fullscreen-open{overflow:hidden!important;}
.ielts-translation-fullscreen{
  position:fixed;inset:0;z-index:30000;min-height:100dvh;width:100vw;
  background:#fff;
  background-color:#fff;
  background-image:none;
  color:#17212b;display:flex;align-items:stretch;justify-content:center;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  padding:max(16px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));
}
.ielts-translation-fullscreen__shell{width:min(1180px,100%);min-height:100%;display:grid;grid-template-rows:auto 1fr auto;gap:14px;}
.ielts-translation-fullscreen__topbar{height:54px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;}
.ielts-translation-fullscreen__exit,.ielts-translation-fullscreen__check,.ielts-translation-fullscreen__next,.ielts-translation-fullscreen__reset{
  border:0;border-radius:999px;font-weight:950;letter-spacing:0;background:#fff;color:#17212b;box-shadow:0 12px 26px rgba(15,23,42,.10);
}
.ielts-translation-fullscreen__exit{height:42px;padding:0 18px;}
.ielts-translation-fullscreen__progress{justify-self:center;font-size:15px;font-weight:950;color:#516170;background:rgba(255,255,255,.68);border:1px solid rgba(23,33,43,.08);border-radius:999px;padding:9px 14px;}
.ielts-translation-fullscreen__status{justify-self:end;font-size:14px;font-weight:950;color:#64748b;background:rgba(255,255,255,.72);border:1px solid rgba(23,33,43,.08);border-radius:999px;padding:9px 14px;}
.ielts-translation-fullscreen__status.is-correct{color:#047857;background:#d1fae5;border-color:rgba(16,185,129,.24);}
.ielts-translation-fullscreen__status.is-wrong{color:#dc2626;background:#fee2e2;border-color:rgba(239,68,68,.20);}
.ielts-translation-fullscreen__main{display:grid;align-content:center;justify-items:center;gap:28px;padding:10px 76px 0;}
.ielts-translation-fullscreen__prompt{max-width:980px;text-align:center;font-size:clamp(28px,4.2vw,56px);line-height:1.25;font-weight:650;color:#334155;}
.ielts-translation-fullscreen__answer{width:min(1040px,100%);min-height:152px;display:flex;align-items:flex-end;justify-content:center;align-content:flex-end;gap:18px 24px;flex-wrap:wrap;padding:10px 10px 4px;cursor:text;border-radius:28px;}
.ielts-translation-fullscreen__answer:focus{outline:0;box-shadow:0 0 0 5px rgba(14,165,233,.08);}
.ielts-translation-fullscreen__word{position:relative;width:calc(var(--line-ch,7) * .68em);min-width:58px;max-width:92vw;display:grid;grid-template-rows:auto 5px;justify-items:center;gap:8px;color:#1f2937;font-size:56px;}
.ielts-translation-fullscreen__word-hint{display:none!important;}
.ielts-translation-fullscreen__word-text{min-height:46px;display:grid;place-items:end center;font-size:1em;line-height:1;font-weight:950;white-space:nowrap;max-width:none;overflow:visible;text-overflow:clip;}
.ielts-translation-fullscreen__word-line{width:100%;height:3px;border-radius:999px;background:#b8c4cf;box-shadow:0 1px 0 rgba(255,255,255,.7);}
.ielts-translation-fullscreen__word--active .ielts-translation-fullscreen__word-line{height:4px;background:#0ea5e9;box-shadow:0 0 0 4px rgba(14,165,233,.12);}
.ielts-translation-fullscreen__word-caret{position:absolute;right:-13px;top:18px;width:24px;height:24px;border-radius:999px;background:#0ea5e9;box-shadow:0 8px 18px rgba(14,165,233,.28),0 0 0 5px rgba(14,165,233,.10);}
.ielts-translation-fullscreen__word-caret:before{content:"";position:absolute;left:11px;top:5px;width:2px;height:14px;border-radius:999px;background:#fff;}
.ielts-translation-fullscreen__word-caret:after{content:"";position:absolute;left:7px;top:8px;width:10px;height:2px;border-radius:999px;background:#fff;}
.ielts-translation-fullscreen__word--correct{color:#047857;}
.ielts-translation-fullscreen__word--correct .ielts-translation-fullscreen__word-line{background:#10b981;}
.ielts-translation-fullscreen__word--wrong{color:#dc2626;}
.ielts-translation-fullscreen__word--wrong .ielts-translation-fullscreen__word-line{background:#ef4444;}
.ielts-translation-fullscreen__word--missing{color:#b77900;}
.ielts-translation-fullscreen__word--missing .ielts-translation-fullscreen__word-text{color:#b77900;}
.ielts-translation-fullscreen__word--missing .ielts-translation-fullscreen__word-line{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,.13);}
.ielts-translation-fullscreen__word--extra .ielts-translation-fullscreen__word-text{text-decoration:line-through;text-decoration-thickness:3px;}
.ielts-translation-fullscreen__input{
  position:absolute;left:50%;top:50%;width:1px;min-height:1px;height:1px;resize:none;border:0;border-radius:0;background:transparent;
  box-shadow:none;padding:0;color:transparent;font-size:16px;line-height:1;outline:none;opacity:.01;caret-color:transparent;
}
.ielts-translation-fullscreen__input:focus{outline:none;}
.ielts-translation-fullscreen__feedback{min-height:48px;text-align:center;font-size:17px;font-weight:900;line-height:1.55;color:#64748b;}
.detail-photo-missing-note{position:absolute;left:24px;right:24px;bottom:88px;z-index:3;border-radius:16px;padding:10px 12px;background:rgba(255,255,255,.18);color:#fff;font-size:13px;font-weight:850;line-height:1.45;text-align:center;text-shadow:0 1px 5px rgba(0,0,0,.32);backdrop-filter:blur(12px);}
.ielts-translation-fullscreen__feedback.is-correct{color:#047857;}
.ielts-translation-fullscreen__feedback.is-wrong{color:#dc2626;}
.ielts-translation-fullscreen__feedback b{font-weight:950;}
.ielts-translation-fullscreen__bottom{display:flex;align-items:center;justify-content:center;gap:12px;padding-bottom:6px;}
.ielts-translation-fullscreen__check{height:52px;padding:0 30px;background:#111;color:#fff;font-size:16px;box-shadow:0 16px 34px rgba(15,23,42,.18);}
.ielts-translation-fullscreen__next,.ielts-translation-fullscreen__reset{height:48px;padding:0 22px;font-size:15px;}
.ielts-translation-fullscreen__next:disabled,.ielts-translation-fullscreen__nav:disabled{opacity:.28;pointer-events:none;}
.ielts-translation-fullscreen__nav{
  position:fixed;top:50%;transform:translateY(-50%);z-index:2;width:58px;height:96px;border:0;border-radius:999px;background:rgba(255,255,255,.74);backdrop-filter:blur(14px);
  color:#17212b;font-size:58px;line-height:1;font-weight:300;box-shadow:0 16px 36px rgba(15,23,42,.12);
}
.ielts-translation-fullscreen__nav--left{left:max(16px,env(safe-area-inset-left));}
.ielts-translation-fullscreen__nav--right{right:max(16px,env(safe-area-inset-right));}
@media(max-width:760px){
  .ielts-summary-actions{width:100%;justify-content:stretch;}
  .ielts-summary-actions button{flex:1;}
  .ielts-translation-fullscreen{padding:12px;}
  .ielts-translation-fullscreen__topbar{height:auto;grid-template-columns:auto auto;justify-content:space-between;}
  .ielts-translation-fullscreen__progress{grid-column:1/3;grid-row:2;justify-self:center;}
  .ielts-translation-fullscreen__main{gap:20px;padding:8px 38px 0;}
  .ielts-translation-fullscreen__prompt{font-size:clamp(24px,8vw,38px);}
  .ielts-translation-fullscreen__answer{gap:14px 16px;min-height:110px;}
  .ielts-translation-fullscreen__word{min-width:48px;gap:7px;grid-template-rows:auto 5px;font-size:40px;}
  .ielts-translation-fullscreen__word-hint{height:20px;font-size:14px;}
  .ielts-translation-fullscreen__word-text{min-height:38px;}
  .ielts-translation-fullscreen__word-caret{top:14px;width:21px;height:21px;right:-11px;}
  .ielts-translation-fullscreen__word-caret:before{left:10px;top:4px;height:13px;}
  .ielts-translation-fullscreen__word-caret:after{left:6px;top:7px;width:9px;}
  .ielts-translation-fullscreen__bottom{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
  .ielts-translation-fullscreen__check{grid-column:1/3;width:100%;}
  .ielts-translation-fullscreen__next,.ielts-translation-fullscreen__reset{width:100%;}
  .ielts-translation-fullscreen__nav{width:40px;height:72px;font-size:42px;}
  .ielts-translation-fullscreen__nav--left{left:6px;}
  .ielts-translation-fullscreen__nav--right{right:6px;}
}
@media(max-width:560px){
  .ielts-translation-fullscreen{padding:max(10px,env(safe-area-inset-top)) 8px max(10px,env(safe-area-inset-bottom));}
  .ielts-translation-fullscreen__shell{width:100%;gap:10px;}
  .ielts-translation-fullscreen__topbar{grid-template-columns:auto auto auto;gap:6px;}
  .ielts-translation-fullscreen__exit{height:40px;padding:0 14px;font-size:14px;}
  .ielts-translation-fullscreen__progress{grid-column:auto;grid-row:auto;font-size:13px;padding:8px 11px;}
  .ielts-translation-fullscreen__status{max-width:94px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;padding:8px 10px;}
  .ielts-translation-fullscreen__main{align-content:start;gap:22px;padding:10px 38px 0;}
  .ielts-translation-fullscreen__prompt{max-width:calc(100vw - 76px);font-size:clamp(24px,7.4vw,34px);line-height:1.18;}
  .ielts-translation-fullscreen__answer{width:calc(100vw - 92px);min-height:120px;gap:28px 14px;padding:4px 0 8px;justify-content:center;align-content:flex-start;}
  .ielts-translation-fullscreen__word{
    min-width:42px;
    width:min(calc(var(--line-ch,7) * .66em), calc(100vw - 112px));
    max-width:calc(100vw - 112px);
    grid-template-rows:auto 5px;
    gap:7px;
    font-size:clamp(22px, calc((100vw - 112px) / max(var(--line-ch,7), 1) * 1.28), 34px);
  }
  .ielts-translation-fullscreen__word-hint{height:18px;max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:clamp(12px,3.5vw,15px);}
  .ielts-translation-fullscreen__word-text{min-height:34px;max-width:100%;overflow:visible;}
  .ielts-translation-fullscreen__word-caret{right:-8px;top:12px;width:18px;height:18px;}
  .ielts-translation-fullscreen__word-caret:before{left:8px;top:4px;height:11px;}
  .ielts-translation-fullscreen__word-caret:after{left:5px;top:7px;width:8px;}
  .ielts-translation-fullscreen__feedback{min-height:36px;font-size:14px;padding:0 8px;}
  .ielts-translation-fullscreen__bottom{padding:4px 38px 4px;grid-template-columns:1fr 1fr;}
  .ielts-translation-fullscreen__check{height:46px;font-size:15px;}
  .ielts-translation-fullscreen__next,.ielts-translation-fullscreen__reset{height:42px;font-size:13px;padding:0 12px;}
  .ielts-translation-fullscreen__nav{width:34px;height:68px;font-size:40px;background:rgba(255,255,255,.68);}
  .ielts-translation-fullscreen__nav--left{left:4px;}
  .ielts-translation-fullscreen__nav--right{right:4px;}
}
@media(orientation:landscape) and (max-height:560px){
  .ielts-translation-fullscreen__shell{gap:8px;}
  .ielts-translation-fullscreen__topbar{height:42px;}
  .ielts-translation-fullscreen__main{gap:14px;padding-top:0;}
  .ielts-translation-fullscreen__prompt{font-size:clamp(22px,4vw,34px);}
  .ielts-translation-fullscreen__answer{min-height:78px;gap:10px 18px;}
  .ielts-translation-fullscreen__word{grid-template-rows:auto 4px;font-size:42px;}
  .ielts-translation-fullscreen__word-hint{height:18px;font-size:13px;}
  .ielts-translation-fullscreen__word-text{min-height:30px;}
  .ielts-translation-fullscreen__word-caret{top:12px;}
  .ielts-translation-fullscreen__feedback{min-height:30px;font-size:14px;}
  .ielts-translation-fullscreen__bottom button{height:42px;}
}

/* v1.7.14 luxury theme system */
.bg-orb{display:none!important;}
.page-container{
  background:var(--main-bg);
  isolation:isolate;
  --card-border:rgba(255,255,255,.62);
  --card-shadow:0 18px 48px rgba(20,24,35,.10);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.50);
  --ambient-layer:linear-gradient(120deg,rgba(255,255,255,.18),transparent 34%,rgba(255,255,255,.14) 62%,transparent);
  --sparkle-layer:radial-gradient(circle at 18% 24%,rgba(255,255,255,.72) 0 1px,transparent 2px),radial-gradient(circle at 76% 18%,rgba(255,255,255,.50) 0 1px,transparent 2px),radial-gradient(circle at 62% 78%,rgba(255,255,255,.46) 0 1px,transparent 2px);
  --flow-opacity:.42;
  --sparkle-opacity:.13;
  --theme-accent-soft:rgba(255,255,255,.52);
  --theme-line:rgba(15,23,42,.08);
  --primary-gradient:linear-gradient(135deg,var(--primary),var(--primary));
  --primary-shadow:rgba(15,23,42,.16);
}
.page-container::before,
.page-container::after{
  content:"";
  position:fixed;
  inset:-24%;
  z-index:0;
  pointer-events:none;
}
.page-container::before{
  background:var(--ambient-layer);
  opacity:var(--flow-opacity);
  transform:translate3d(-2%,0,0) rotate(.001deg);
  animation:keylineThemeFlow 18s ease-in-out infinite alternate;
}
.page-container::after{
  background:var(--sparkle-layer);
  background-size:260px 260px,320px 320px,380px 380px;
  opacity:var(--sparkle-opacity);
  mix-blend-mode:screen;
  transform:translate3d(0,0,0);
  animation:keylineThemeSparkle 8s linear infinite;
}
.main-view{z-index:1;}
.add-page{z-index:50;}
/* Design System v3: dropped the old global forced tracking reset so
 * headings can carry refined negative tracking. Base tracking is set softly on
 * the container; component tracking is controlled locally in ui-polish.css. */
.page-container{letter-spacing:-0.006em;}
.dashboard-card,
.count-card,
.checklist-card,
.festival-card,
.calendar-panel,
.timeline-card,
.form-card,
.settings-panel,
.settings-card,
.subscription-card,
.subscription-summary-card,
.subscription-next-card,
.grade-course-card,
.translation-library-card,
.translation-practice-card,
.ielts-practice-hero,
.ielts-translation-summary{
  background:var(--card-bg)!important;
  border:1px solid var(--card-border)!important;
  box-shadow:var(--card-shadow),var(--card-inner-shadow)!important;
  backdrop-filter:blur(22px) saturate(1.18);
}
.switch-tab-btn,
.secondary-btn,
.category-pill,
.schedule-mode-btn,
.calendar-nav-btn,
.theme-btn,
.count-icon-box,
.festival-icon-box,
.empty-illustration,
.tag,
.year-progress-bar,
.progress-line,
.checklist-progress,
.check-dot,
.subitem-input,
.draft-subitem{
  background:var(--tag-bg)!important;
}
.primary-btn,
.category-pill-active,
.schedule-mode-active,
.save-btn,
.subitem-add-btn,
.checked,
.year-progress-inner,
.progress-inner,
.check-dot-done{
  background:var(--primary-gradient)!important;
  color:var(--primary-text)!important;
  box-shadow:0 14px 30px var(--primary-shadow)!important;
}
.count-card,
.checklist-card,
.festival-card,
.dashboard-card{
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease;
}
.count-card:hover,
.checklist-card:hover,
.festival-card:hover,
.dashboard-card:not(.kd-no-lift):hover{
  transform:translateY(-2px);
  border-color:var(--theme-accent-soft)!important;
}
.settings-label,
.dashboard-label,
.count-date,
.count-unit,
.tag,
.festival-date,
.festival-tag,
.header-subtitle,
.year-text{
  color:var(--text-sub)!important;
}
.schedule-container,
.schedule-header-row,
.schedule-row,
.schedule-cell,
.past-toggle-row{
  border-color:var(--theme-line)!important;
}
.calendar-day{background:rgba(255,255,255,.34)!important;border:1px solid var(--theme-line);}
.calendar-day.today{background:var(--primary-gradient)!important;color:var(--primary-text)!important;}
.timeline-dot{background:var(--primary)!important;box-shadow:0 0 0 5px var(--tag-bg)!important;}
.festival-hero{
  background:linear-gradient(135deg,var(--primary),rgba(17,24,39,.94))!important;
  border:1px solid rgba(255,255,255,.16);
}
.mask,.detail-overlay{z-index:999;}

.page-container.theme-black{
  --main-bg:radial-gradient(circle at 22% 18%,rgba(82,90,105,.30),transparent 34%),linear-gradient(145deg,#080a0f 0%,#171b21 52%,#06070a 100%);
  --card-bg:rgba(22,25,31,.76);
  --text-main:#f8fafc;
  --text-sub:#a9b2bd;
  --primary:#f8fafc;
  --primary-text:#101114;
  --tag-bg:rgba(255,255,255,.10);
  --card-border:rgba(255,255,255,.12);
  --card-shadow:0 22px 54px rgba(0,0,0,.34);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.10);
  --primary-gradient:linear-gradient(135deg,#ffffff,#cbd5e1);
  --primary-shadow:rgba(255,255,255,.10);
  --ambient-layer:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.08) 28%,transparent 44%,rgba(148,163,184,.12) 64%,transparent 82%);
  --sparkle-layer:radial-gradient(circle at 18% 28%,rgba(255,255,255,.88) 0 1px,transparent 2px),radial-gradient(circle at 76% 16%,rgba(203,213,225,.62) 0 1px,transparent 2px),radial-gradient(circle at 46% 74%,rgba(255,255,255,.45) 0 1px,transparent 2px);
  --flow-opacity:.58;
  --sparkle-opacity:.22;
  --theme-line:rgba(255,255,255,.13);
  --theme-accent-soft:rgba(255,255,255,.24);
}
.page-container.theme-cream{
  --main-bg:radial-gradient(circle at 26% 14%,rgba(255,255,255,.78),transparent 34%),linear-gradient(145deg,#fffaf2 0%,#f8efe2 56%,#ead9c0 100%);
  --card-bg:rgba(255,252,247,.86);
  --text-main:#2b241e;
  --text-sub:#927a67;
  --primary:#6e4d33;
  --primary-text:#fffdf8;
  --tag-bg:rgba(111,78,50,.09);
  --card-border:rgba(255,255,255,.68);
  --card-shadow:0 18px 44px rgba(108,78,43,.13);
  --primary-gradient:linear-gradient(135deg,#6e4d33,#a67c52);
  --primary-shadow:rgba(111,78,50,.22);
  --ambient-layer:linear-gradient(120deg,rgba(255,255,255,.58),transparent 34%,rgba(214,179,128,.20) 65%,transparent),repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0 1px,transparent 1px 28px);
  --sparkle-layer:radial-gradient(circle at 30% 20%,rgba(255,255,255,.84) 0 1px,transparent 2px),radial-gradient(circle at 72% 72%,rgba(204,157,96,.28) 0 1px,transparent 2px);
  --flow-opacity:.50;
  --sparkle-opacity:.16;
}
.page-container.theme-pink{
  --main-bg:radial-gradient(circle at 24% 16%,rgba(255,255,255,.88),transparent 35%),linear-gradient(145deg,#fff5f8 0%,#fff 42%,#ffd9e5 100%);
  --card-bg:rgba(255,255,255,.88);
  --text-main:#3b1f2a;
  --text-sub:#ae7589;
  --primary:#df5f8d;
  --primary-text:#fff;
  --tag-bg:rgba(255,214,229,.58);
  --card-border:rgba(255,255,255,.76);
  --card-shadow:0 20px 48px rgba(214,92,135,.14);
  --primary-gradient:linear-gradient(135deg,#ff7aa8,#db4f81);
  --primary-shadow:rgba(219,79,129,.22);
  --ambient-layer:radial-gradient(ellipse at 20% 22%,rgba(255,183,208,.36),transparent 32%),radial-gradient(ellipse at 80% 20%,rgba(255,255,255,.54),transparent 28%),linear-gradient(115deg,transparent,rgba(255,255,255,.34),transparent);
  --sparkle-layer:radial-gradient(circle at 20% 18%,rgba(255,255,255,.82) 0 1px,transparent 2px),radial-gradient(circle at 42% 70%,rgba(255,135,174,.36) 0 2px,transparent 3px),radial-gradient(circle at 78% 34%,rgba(255,255,255,.70) 0 1px,transparent 2px);
  --flow-opacity:.62;
  --sparkle-opacity:.20;
}
.page-container.theme-blue{
  --main-bg:radial-gradient(circle at 18% 18%,rgba(255,255,255,.86),transparent 34%),linear-gradient(145deg,#eef8ff 0%,#fbfdff 52%,#cfe7ff 100%);
  --card-bg:rgba(255,255,255,.84);
  --text-main:#10243d;
  --text-sub:#6381a3;
  --primary:#1d65c1;
  --primary-text:#fff;
  --tag-bg:rgba(210,230,255,.62);
  --card-border:rgba(255,255,255,.72);
  --card-shadow:0 20px 48px rgba(53,116,184,.13);
  --primary-gradient:linear-gradient(135deg,#1d65c1,#4aa3ff);
  --primary-shadow:rgba(29,101,193,.20);
  --ambient-layer:linear-gradient(110deg,rgba(255,255,255,.40),transparent 28%,rgba(88,166,255,.18) 50%,transparent 78%),repeating-linear-gradient(165deg,rgba(29,101,193,.06) 0 2px,transparent 2px 42px);
  --sparkle-layer:radial-gradient(circle at 22% 22%,rgba(255,255,255,.86) 0 1px,transparent 2px),radial-gradient(circle at 78% 28%,rgba(74,163,255,.34) 0 1px,transparent 2px),radial-gradient(circle at 54% 82%,rgba(255,255,255,.62) 0 1px,transparent 2px);
  --flow-opacity:.58;
  --sparkle-opacity:.18;
}
.page-container.theme-purple{
  --main-bg:radial-gradient(circle at 22% 14%,rgba(255,255,255,.86),transparent 34%),linear-gradient(145deg,#faf7ff 0%,#fff 48%,#e8dcff 100%);
  --card-bg:rgba(255,255,255,.86);
  --text-main:#271f38;
  --text-sub:#7f6f9d;
  --primary:#7c5cc8;
  --primary-text:#fff;
  --tag-bg:rgba(232,222,255,.66);
  --card-border:rgba(255,255,255,.76);
  --card-shadow:0 20px 48px rgba(124,92,200,.13);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.58);
  --primary-gradient:linear-gradient(135deg,#8b6de3,#c4a8ff);
  --primary-shadow:rgba(124,92,200,.20);
  --ambient-layer:radial-gradient(ellipse at 22% 24%,rgba(196,168,255,.30),transparent 32%),radial-gradient(ellipse at 80% 18%,rgba(255,255,255,.58),transparent 30%),linear-gradient(120deg,transparent,rgba(255,255,255,.36),transparent 76%);
  --sparkle-layer:radial-gradient(circle at 22% 22%,rgba(255,255,255,.88) 0 1px,transparent 2px),radial-gradient(circle at 68% 28%,rgba(196,168,255,.42) 0 1px,transparent 2px),radial-gradient(circle at 44% 78%,rgba(255,255,255,.62) 0 1px,transparent 2px);
  --flow-opacity:.58;
  --sparkle-opacity:.16;
  --theme-line:rgba(124,92,200,.10);
  --theme-accent-soft:rgba(196,168,255,.36);
}
.page-container.theme-forest{
  --main-bg:radial-gradient(circle at 20% 12%,rgba(229,255,235,.56),transparent 32%),linear-gradient(145deg,#edf8ef 0%,#f8fff8 45%,#bcdcc2 100%);
  --card-bg:rgba(255,255,255,.84);
  --text-main:#123022;
  --text-sub:#637d68;
  --primary:#1d6a43;
  --primary-text:#fff;
  --tag-bg:rgba(210,237,213,.64);
  --card-border:rgba(255,255,255,.72);
  --card-shadow:0 20px 48px rgba(38,104,62,.14);
  --primary-gradient:linear-gradient(135deg,#0f5132,#3ca56b);
  --primary-shadow:rgba(29,106,67,.22);
  --ambient-layer:repeating-linear-gradient(135deg,rgba(29,106,67,.06) 0 2px,transparent 2px 32px),radial-gradient(ellipse at 24% 26%,rgba(91,184,121,.24),transparent 30%),linear-gradient(115deg,transparent,rgba(255,255,255,.30),transparent);
  --sparkle-layer:radial-gradient(circle at 25% 24%,rgba(255,255,255,.76) 0 1px,transparent 2px),radial-gradient(circle at 70% 70%,rgba(100,204,131,.35) 0 1px,transparent 2px);
  --flow-opacity:.56;
  --sparkle-opacity:.13;
}
.page-container.theme-diamond{
  --main-bg:linear-gradient(145deg,#f9fbff 0%,#ffffff 42%,#dbe5f0 100%);
  --card-bg:rgba(255,255,255,.78);
  --text-main:#182231;
  --text-sub:#718096;
  --primary:#1f2937;
  --primary-text:#fff;
  --tag-bg:rgba(226,232,240,.62);
  --card-border:rgba(255,255,255,.90);
  --card-shadow:0 20px 48px rgba(71,85,105,.14);
  --primary-gradient:linear-gradient(135deg,#111827,#64748b);
  --primary-shadow:rgba(71,85,105,.22);
  --ambient-layer:linear-gradient(135deg,rgba(255,255,255,.80),transparent 24%,rgba(148,163,184,.18) 45%,transparent 62%,rgba(255,255,255,.68) 82%),repeating-linear-gradient(45deg,rgba(148,163,184,.12) 0 1px,transparent 1px 34px),repeating-linear-gradient(135deg,rgba(255,255,255,.52) 0 1px,transparent 1px 38px);
  --sparkle-layer:radial-gradient(circle at 18% 20%,rgba(255,255,255,.98) 0 1px,transparent 2px),radial-gradient(circle at 54% 30%,rgba(255,255,255,.90) 0 2px,transparent 3px),radial-gradient(circle at 82% 66%,rgba(255,255,255,.80) 0 1px,transparent 2px),radial-gradient(circle at 35% 84%,rgba(186,203,224,.50) 0 1px,transparent 2px);
  --flow-opacity:.66;
  --sparkle-opacity:.32;
}
.page-container.theme-sunset{
  --main-bg:radial-gradient(circle at 22% 14%,rgba(255,255,255,.76),transparent 32%),linear-gradient(145deg,#fff7ed 0%,#fff1f2 48%,#ffc2a4 100%);
  --card-bg:rgba(255,255,255,.84);
  --text-main:#3c1f17;
  --text-sub:#a46e5b;
  --primary:#e0583d;
  --primary-text:#fff;
  --tag-bg:rgba(255,220,204,.62);
  --card-border:rgba(255,255,255,.74);
  --card-shadow:0 20px 48px rgba(224,88,61,.14);
  --primary-gradient:linear-gradient(135deg,#f97316,#e11d48);
  --primary-shadow:rgba(225,29,72,.20);
  --ambient-layer:linear-gradient(120deg,rgba(255,255,255,.44),transparent 28%,rgba(251,146,60,.22) 52%,rgba(244,114,182,.15) 72%,transparent),repeating-linear-gradient(0deg,rgba(255,255,255,.22) 0 1px,transparent 1px 40px);
  --sparkle-layer:radial-gradient(circle at 24% 20%,rgba(255,255,255,.86) 0 1px,transparent 2px),radial-gradient(circle at 76% 24%,rgba(251,146,60,.42) 0 1px,transparent 2px),radial-gradient(circle at 62% 78%,rgba(244,114,182,.30) 0 1px,transparent 2px);
  --flow-opacity:.64;
  --sparkle-opacity:.17;
}
.page-container.theme-mint{
  --main-bg:radial-gradient(circle at 24% 14%,rgba(255,255,255,.84),transparent 34%),linear-gradient(145deg,#f0fffb 0%,#ffffff 46%,#bceee1 100%);
  --card-bg:rgba(255,255,255,.82);
  --text-main:#10352f;
  --text-sub:#5f8982;
  --primary:#0f8f7a;
  --primary-text:#fff;
  --tag-bg:rgba(205,245,236,.68);
  --card-border:rgba(255,255,255,.74);
  --card-shadow:0 20px 48px rgba(15,143,122,.13);
  --primary-gradient:linear-gradient(135deg,#0f766e,#22c1a6);
  --primary-shadow:rgba(15,143,122,.20);
  --ambient-layer:linear-gradient(115deg,rgba(255,255,255,.52),transparent 28%,rgba(45,212,191,.18) 56%,transparent 78%),repeating-linear-gradient(90deg,rgba(15,143,122,.06) 0 2px,transparent 2px 34px);
  --sparkle-layer:radial-gradient(circle at 20% 24%,rgba(255,255,255,.86) 0 1px,transparent 2px),radial-gradient(circle at 76% 20%,rgba(45,212,191,.40) 0 1px,transparent 2px),radial-gradient(circle at 52% 82%,rgba(255,255,255,.54) 0 1px,transparent 2px);
  --flow-opacity:.56;
  --sparkle-opacity:.15;
}
.page-container.theme-black .calendar-day{background:rgba(255,255,255,.08)!important;}
.page-container.theme-black .event-dot{background:#fff!important;}
.page-container.theme-black .past-color{color:#77808c!important;}
.page-container.theme-black .backup-panel,
.page-container.theme-black .tab-picker-panel,
.page-container.theme-black .emoji-panel{background:rgba(17,24,39,.96)!important;color:#f8fafc!important;}
.page-container.theme-black .backup-title,
.page-container.theme-black .tab-picker-title,
.page-container.theme-black .emoji-header,
.page-container.theme-black .tab-picker-text b{color:#f8fafc!important;}
.page-container.theme-black .backup-desc,
.page-container.theme-black .restore-textarea,
.page-container.theme-black .backup-code-box,
.page-container.theme-black .tab-picker-item{background:rgba(255,255,255,.10)!important;color:#cbd5e1!important;}

@keyframes keylineThemeFlow{
  0%{transform:translate3d(-3%,-1%,0) scale(1) rotate(.001deg);}
  50%{transform:translate3d(2%,1%,0) scale(1.03) rotate(.001deg);}
  100%{transform:translate3d(4%,-2%,0) scale(1.06) rotate(.001deg);}
}
@keyframes keylineThemeSparkle{
  0%{transform:translate3d(0,0,0);opacity:var(--sparkle-opacity);filter:brightness(.86);}
  50%{transform:translate3d(2%,-1%,0);opacity:var(--sparkle-opacity);filter:brightness(1.34);}
  100%{transform:translate3d(4%,-2%,0);opacity:var(--sparkle-opacity);filter:brightness(.86);}
}
@media(prefers-reduced-motion:reduce){
  .page-container::before,
  .page-container::after{animation:none!important;}
  .count-card,
  .checklist-card,
  .festival-card,
  .dashboard-card{transition:none!important;}
}

/* theme material polish foundation */
.page-container{
  --theme-pattern-layer:linear-gradient(120deg,rgba(255,255,255,.18),transparent 34%,rgba(255,255,255,.14) 62%,transparent);
  --theme-symbol-layer:radial-gradient(circle at 18% 24%,rgba(255,255,255,.62) 0 1px,transparent 2px),radial-gradient(circle at 76% 18%,rgba(255,255,255,.46) 0 1px,transparent 2px),radial-gradient(circle at 62% 78%,rgba(255,255,255,.42) 0 1px,transparent 2px);
  --theme-texture-layer:radial-gradient(circle at 1px 1px,rgb(255 255 255 / var(--theme-noise-opacity)) 0 1px,transparent 1px 7px);
  --theme-highlight-layer:radial-gradient(circle at 82% 10%,rgba(255,255,255,.28),transparent 28%);
  --theme-noise-opacity:.08;
  --theme-symbol-opacity:.18;
  --theme-pattern-opacity:.52;
  --theme-card-glow:0 0 0 rgba(255,255,255,0);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.24),transparent 42%,rgba(255,255,255,.10)),radial-gradient(circle at 1px 1px,rgb(255 255 255 / var(--theme-noise-opacity)) 0 1px,transparent 1px 8px);
  --theme-pattern-duration:30s;
  --theme-symbol-duration:28s;
}

.page-container::before{
  inset:-22%;
  background:var(--theme-pattern-layer),var(--ambient-layer),var(--theme-texture-layer);
  background-repeat:no-repeat;
  background-size:100% 100%;
  opacity:var(--theme-pattern-opacity);
  mix-blend-mode:normal;
  animation:keylineThemePatternShift var(--theme-pattern-duration) ease-in-out infinite alternate;
}
.page-container::after{
  inset:-18%;
  background:var(--theme-symbol-layer),var(--sparkle-layer),var(--theme-highlight-layer);
  background-repeat:no-repeat;
  background-size:100% 100%;
  opacity:var(--theme-symbol-opacity);
  mix-blend-mode:screen;
  filter:saturate(1.08);
  animation:keylineThemeSymbolDrift var(--theme-symbol-duration) linear infinite;
}

.dashboard-card,
.count-card,
.checklist-card,
.festival-card,
.calendar-panel,
.timeline-card,
.form-card,
.settings-panel,
.settings-card,
.subscription-card,
.subscription-summary-card,
.subscription-next-card,
.grade-course-card,
.translation-library-card,
.translation-practice-card,
.ielts-practice-hero,
.ielts-translation-summary,
.schedule-container,
.today-action-row{
  background-color:var(--card-bg)!important;
  background-image:var(--theme-card-texture)!important;
  background-blend-mode:soft-light,normal;
  border-color:var(--card-border)!important;
  box-shadow:var(--card-shadow),var(--theme-card-glow),var(--card-inner-shadow)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.2);
  backdrop-filter:blur(22px) saturate(1.2);
}

.tab-picker-panel,
.backup-panel,
.emoji-panel,
.settings-panel{
  background-color:rgba(255,255,255,.96)!important;
  background-image:var(--theme-card-texture)!important;
  border:1px solid var(--card-border)!important;
  box-shadow:0 24px 70px rgba(15,23,42,.20),var(--theme-card-glow)!important;
}

.switch-tab-btn,
.secondary-btn,
.category-pill,
.schedule-mode-btn,
.calendar-nav-btn,
.theme-btn,
.settings-btn,
.count-icon-box,
.festival-icon-box,
.empty-illustration,
.tag,
.year-progress-bar,
.progress-line,
.checklist-progress,
.check-dot,
.subitem-input,
.draft-subitem{
  border:1px solid var(--theme-line)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42)!important;
}

.primary-btn,
.category-pill-active,
.schedule-mode-active,
.save-btn,
.subitem-add-btn,
.checked,
.year-progress-inner,
.progress-inner,
.check-dot-done{
  background:var(--primary-gradient)!important;
  box-shadow:0 14px 30px var(--primary-shadow),inset 0 1px 0 rgba(255,255,255,.22)!important;
}
.primary-btn:active,
.secondary-btn:active,
.switch-tab-btn:active,
.theme-btn:active,
.category-pill:active,
.schedule-mode-btn:active,
.settings-btn:active,
.settings-item:active,
.count-card:active,
.festival-card:active,
.checklist-card:active,
.save-btn:active{
  transform:scale(.985);
  filter:saturate(1.05);
}
.count-card:hover,
.checklist-card:hover,
.festival-card:hover,
.dashboard-card:hover,
.calendar-panel:hover,
.timeline-card:hover{
  box-shadow:var(--card-shadow),var(--theme-card-glow),0 0 0 1px var(--theme-accent-soft),var(--card-inner-shadow)!important;
}
.calendar-day{border-color:var(--theme-line)!important;}
.event-dot{background:var(--primary)!important;}
.schedule-dot{background:var(--text-sub)!important;}
.calendar-day.today .event-dot,
.calendar-day.today .schedule-dot{background:var(--primary-text)!important;}
.timeline-left::after{background:var(--theme-line)!important;}

.page-container.theme-cream{
  --main-bg:radial-gradient(circle at 18% 8%,rgba(255,255,255,.94),transparent 33%),radial-gradient(circle at 76% 18%,rgba(255,244,217,.58),transparent 29%),radial-gradient(circle at 42% 86%,rgba(224,193,145,.22),transparent 35%),linear-gradient(145deg,#fffbf5 0%,#f8efe2 58%,#eadbc9 100%);
  --card-bg:rgba(255,252,247,.87);
  --text-main:#2a241d;
  --text-sub:#8f7864;
  --primary:#6d4c31;
  --primary-text:#fffdf8;
  --tag-bg:rgba(111,78,50,.085);
  --card-border:rgba(255,255,255,.74);
  --card-shadow:0 18px 44px rgba(110,78,44,.12);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.70),inset 0 -1px 0 rgba(214,179,128,.10);
  --primary-gradient:linear-gradient(135deg,#6d4c31,#b58b5c);
  --primary-shadow:rgba(111,78,50,.22);
  --theme-line:rgba(111,78,50,.09);
  --theme-accent-soft:rgba(214,179,128,.34);
  --theme-pattern-layer:repeating-linear-gradient(0deg,rgba(118,82,47,.028) 0 1px,transparent 1px 14px),repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 1px,transparent 1px 22px);
  --ambient-layer:radial-gradient(circle at 24% 18%,rgba(255,255,255,.78),transparent 26%),radial-gradient(circle at 72% 70%,rgba(224,190,135,.20),transparent 34%),linear-gradient(120deg,rgba(255,255,255,.38),transparent 42%,rgba(238,216,181,.18),transparent 78%);
  --theme-symbol-layer:radial-gradient(circle at 17% 23%,rgba(255,255,255,.70) 0 7px,rgba(255,255,255,.18) 18px,transparent 34px),radial-gradient(circle at 75% 16%,rgba(255,248,229,.58) 0 5px,rgba(217,178,118,.13) 17px,transparent 31px),radial-gradient(circle at 68% 76%,rgba(255,255,255,.45) 0 4px,transparent 25px);
  --sparkle-layer:radial-gradient(circle at 31% 20%,rgba(255,255,255,.82) 0 1px,transparent 2px),radial-gradient(circle at 72% 72%,rgba(204,157,96,.28) 0 1px,transparent 2px);
  --theme-highlight-layer:linear-gradient(118deg,transparent 10%,rgba(255,255,255,.34) 34%,transparent 49%,rgba(217,178,118,.11) 72%,transparent 88%);
  --theme-noise-opacity:.11;
  --theme-pattern-opacity:.46;
  --theme-symbol-opacity:.20;
  --theme-card-glow:0 0 26px rgba(235,213,176,.20);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.34),transparent 43%,rgba(238,216,181,.12)),repeating-linear-gradient(0deg,rgba(111,78,50,.018) 0 1px,transparent 1px 10px);
}

.page-container.theme-pink{
  --main-bg:radial-gradient(circle at 22% 11%,rgba(255,255,255,.92),transparent 34%),radial-gradient(circle at 82% 18%,rgba(255,215,228,.50),transparent 31%),radial-gradient(circle at 36% 88%,rgba(255,180,205,.28),transparent 36%),linear-gradient(145deg,#fff7fa 0%,#fff 44%,#ffdce8 100%);
  --card-bg:rgba(255,255,255,.88);
  --text-main:#3a202a;
  --text-sub:#a97084;
  --primary:#df5b89;
  --primary-text:#fff;
  --tag-bg:rgba(255,216,229,.60);
  --card-border:rgba(255,255,255,.78);
  --card-shadow:0 20px 48px rgba(214,92,135,.13);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.68),inset 0 -1px 0 rgba(255,139,178,.08);
  --primary-gradient:linear-gradient(135deg,#ff86ae,#df4e82);
  --primary-shadow:rgba(219,79,129,.22);
  --theme-line:rgba(219,79,129,.10);
  --theme-accent-soft:rgba(255,151,186,.36);
  --theme-pattern-layer:radial-gradient(ellipse at 18% 20%,rgba(255,190,211,.30),transparent 26%),radial-gradient(ellipse at 82% 24%,rgba(255,255,255,.48),transparent 28%),linear-gradient(118deg,transparent 12%,rgba(255,255,255,.26),transparent 52%);
  --ambient-layer:radial-gradient(ellipse at 20% 22%,rgba(255,183,208,.36),transparent 32%),radial-gradient(ellipse at 80% 20%,rgba(255,255,255,.54),transparent 28%),radial-gradient(ellipse at 58% 82%,rgba(255,215,226,.26),transparent 36%);
  --theme-symbol-layer:radial-gradient(ellipse 18px 9px at 16% 28%,rgba(255,139,178,.30) 0 54%,transparent 64%),radial-gradient(ellipse 16px 8px at 35% 16%,rgba(255,220,231,.58) 0 54%,transparent 64%),radial-gradient(ellipse 20px 10px at 72% 25%,rgba(255,155,189,.26) 0 54%,transparent 64%),radial-gradient(ellipse 14px 8px at 84% 58%,rgba(255,255,255,.48) 0 52%,transparent 64%),radial-gradient(ellipse 17px 9px at 48% 76%,rgba(255,145,181,.22) 0 54%,transparent 66%),radial-gradient(ellipse 13px 7px at 24% 82%,rgba(255,236,242,.60) 0 52%,transparent 64%);
  --sparkle-layer:radial-gradient(circle at 20% 18%,rgba(255,255,255,.82) 0 1px,transparent 2px),radial-gradient(circle at 42% 70%,rgba(255,135,174,.36) 0 2px,transparent 3px),radial-gradient(circle at 78% 34%,rgba(255,255,255,.70) 0 1px,transparent 2px);
  --theme-highlight-layer:linear-gradient(126deg,transparent 16%,rgba(255,255,255,.28) 39%,transparent 55%,rgba(255,151,186,.13) 76%,transparent 90%);
  --theme-noise-opacity:.07;
  --theme-pattern-opacity:.58;
  --theme-symbol-opacity:.30;
  --theme-card-glow:0 0 28px rgba(255,143,179,.18);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.32),transparent 44%,rgba(255,173,201,.11)),radial-gradient(circle at 18% 14%,rgba(255,200,218,.16),transparent 28%);
  --theme-symbol-duration:32s;
}

.page-container.theme-blue{
  --main-bg:radial-gradient(circle at 18% 14%,rgba(255,255,255,.90),transparent 33%),radial-gradient(circle at 82% 20%,rgba(180,221,255,.44),transparent 32%),radial-gradient(circle at 44% 88%,rgba(97,176,255,.18),transparent 38%),linear-gradient(145deg,#eef9ff 0%,#fbfdff 52%,#cfe8ff 100%);
  --card-bg:rgba(255,255,255,.84);
  --text-main:#10243d;
  --text-sub:#5f7f9f;
  --primary:#1d64bd;
  --primary-text:#fff;
  --tag-bg:rgba(210,232,255,.64);
  --card-border:rgba(255,255,255,.76);
  --card-shadow:0 20px 48px rgba(53,116,184,.12);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.70),inset 0 -1px 0 rgba(74,163,255,.09);
  --primary-gradient:linear-gradient(135deg,#1d65c1,#58b2ff);
  --primary-shadow:rgba(29,101,193,.20);
  --theme-line:rgba(29,101,193,.10);
  --theme-accent-soft:rgba(112,184,255,.34);
  --theme-pattern-layer:repeating-radial-gradient(ellipse at 50% -10%,transparent 0 20px,rgba(29,101,193,.052) 21px 22px,transparent 23px 48px),repeating-linear-gradient(165deg,rgba(29,101,193,.045) 0 1px,transparent 1px 38px);
  --ambient-layer:linear-gradient(108deg,rgba(255,255,255,.48),transparent 27%,rgba(88,166,255,.17) 50%,transparent 76%),radial-gradient(ellipse at 82% 12%,rgba(213,239,255,.42),transparent 28%);
  --theme-symbol-layer:radial-gradient(circle at 18% 24%,rgba(255,255,255,.80) 0 1px,transparent 2px),radial-gradient(circle at 31% 70%,rgba(178,222,255,.42) 0 2px,transparent 3px),radial-gradient(circle at 72% 26%,rgba(255,255,255,.76) 0 1px,transparent 2px),radial-gradient(circle at 83% 72%,rgba(99,179,255,.30) 0 2px,transparent 3px),radial-gradient(circle at 52% 46%,rgba(255,255,255,.48) 0 1px,transparent 2px);
  --sparkle-layer:linear-gradient(112deg,transparent 12%,rgba(255,255,255,.30) 31%,transparent 43%,rgba(112,184,255,.14) 68%,transparent 84%);
  --theme-highlight-layer:linear-gradient(124deg,transparent 8%,rgba(255,255,255,.36) 27%,transparent 41%,rgba(74,163,255,.14) 64%,transparent 82%);
  --theme-noise-opacity:.08;
  --theme-pattern-opacity:.54;
  --theme-symbol-opacity:.23;
  --theme-card-glow:0 0 30px rgba(95,172,255,.17);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.34),transparent 42%,rgba(116,191,255,.10)),repeating-linear-gradient(165deg,rgba(29,101,193,.025) 0 1px,transparent 1px 24px);
}

.page-container.theme-purple{
  --main-bg:radial-gradient(circle at 20% 12%,rgba(255,255,255,.90),transparent 34%),radial-gradient(circle at 78% 18%,rgba(213,194,255,.46),transparent 32%),radial-gradient(circle at 44% 86%,rgba(166,135,235,.18),transparent 38%),linear-gradient(145deg,#fbf8ff 0%,#fff 48%,#e8ddff 100%);
  --card-bg:rgba(255,255,255,.86);
  --text-main:#271f38;
  --text-sub:#7c6d98;
  --primary:#7b5cc8;
  --primary-text:#fff;
  --tag-bg:rgba(232,222,255,.66);
  --card-border:rgba(255,255,255,.78);
  --card-shadow:0 20px 48px rgba(124,92,200,.12);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.68),inset 0 -1px 0 rgba(160,127,234,.09);
  --primary-gradient:linear-gradient(135deg,#8265dc,#c5aaff);
  --primary-shadow:rgba(124,92,200,.20);
  --theme-line:rgba(124,92,200,.10);
  --theme-accent-soft:rgba(196,168,255,.36);
  --theme-pattern-layer:repeating-linear-gradient(124deg,rgba(124,92,200,.044) 0 1px,transparent 1px 30px),linear-gradient(34deg,transparent 16%,rgba(255,255,255,.32) 39%,transparent 58%);
  --ambient-layer:radial-gradient(ellipse at 22% 24%,rgba(196,168,255,.30),transparent 32%),radial-gradient(ellipse at 80% 18%,rgba(255,255,255,.58),transparent 30%),radial-gradient(ellipse at 56% 78%,rgba(177,151,241,.18),transparent 36%);
  --theme-symbol-layer:radial-gradient(circle at 18% 22%,rgba(255,255,255,.90) 0 1px,transparent 2px),radial-gradient(circle at 30% 68%,rgba(196,168,255,.44) 0 1px,transparent 2px),radial-gradient(circle at 68% 28%,rgba(255,255,255,.78) 0 1px,transparent 2px),radial-gradient(circle at 82% 70%,rgba(181,152,246,.34) 0 2px,transparent 3px),radial-gradient(circle at 48% 42%,rgba(255,255,255,.54) 0 1px,transparent 2px),radial-gradient(circle at 58% 86%,rgba(196,168,255,.34) 0 1px,transparent 2px);
  --sparkle-layer:radial-gradient(circle at 22% 22%,rgba(255,255,255,.88) 0 1px,transparent 2px),radial-gradient(circle at 68% 28%,rgba(196,168,255,.42) 0 1px,transparent 2px),radial-gradient(circle at 44% 78%,rgba(255,255,255,.62) 0 1px,transparent 2px);
  --theme-highlight-layer:linear-gradient(118deg,transparent 14%,rgba(255,255,255,.31) 38%,transparent 54%,rgba(196,168,255,.16) 74%,transparent 88%);
  --theme-noise-opacity:.07;
  --theme-pattern-opacity:.55;
  --theme-symbol-opacity:.25;
  --theme-card-glow:0 0 30px rgba(177,151,241,.18);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.34),transparent 43%,rgba(196,168,255,.11)),repeating-linear-gradient(124deg,rgba(124,92,200,.018) 0 1px,transparent 1px 22px);
}

.page-container.theme-forest{
  --main-bg:radial-gradient(circle at 20% 10%,rgba(232,255,236,.62),transparent 32%),radial-gradient(circle at 78% 18%,rgba(255,255,255,.58),transparent 28%),radial-gradient(circle at 40% 84%,rgba(91,156,111,.22),transparent 36%),linear-gradient(145deg,#eef8ef 0%,#fbfffa 46%,#bedfc5 100%);
  --card-bg:rgba(255,255,255,.84);
  --text-main:#123022;
  --text-sub:#607c67;
  --primary:#1d6a43;
  --primary-text:#fff;
  --tag-bg:rgba(211,237,214,.64);
  --card-border:rgba(255,255,255,.74);
  --card-shadow:0 20px 48px rgba(38,104,62,.13);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.68),inset 0 -1px 0 rgba(60,165,107,.08);
  --primary-gradient:linear-gradient(135deg,#145c38,#45a96f);
  --primary-shadow:rgba(29,106,67,.22);
  --theme-line:rgba(29,106,67,.10);
  --theme-accent-soft:rgba(91,184,121,.34);
  --theme-pattern-layer:repeating-linear-gradient(136deg,rgba(29,106,67,.048) 0 1px,transparent 1px 32px),repeating-linear-gradient(76deg,rgba(255,255,255,.16) 0 1px,transparent 1px 46px);
  --ambient-layer:radial-gradient(circle at 18% 24%,rgba(255,255,255,.48),transparent 16%),radial-gradient(circle at 33% 18%,rgba(119,188,137,.20),transparent 14%),radial-gradient(circle at 72% 30%,rgba(255,255,255,.38),transparent 18%),radial-gradient(ellipse at 24% 26%,rgba(91,184,121,.22),transparent 31%);
  --theme-symbol-layer:radial-gradient(ellipse 22px 11px at 18% 24%,rgba(72,132,86,.16) 0 56%,transparent 68%),radial-gradient(ellipse 18px 9px at 78% 20%,rgba(255,255,255,.34) 0 56%,transparent 68%),radial-gradient(ellipse 24px 12px at 72% 72%,rgba(82,151,94,.14) 0 56%,transparent 68%),radial-gradient(ellipse 17px 9px at 36% 80%,rgba(120,194,140,.18) 0 56%,transparent 68%);
  --sparkle-layer:radial-gradient(circle at 25% 24%,rgba(255,255,255,.70) 0 1px,transparent 2px),radial-gradient(circle at 70% 70%,rgba(100,204,131,.30) 0 1px,transparent 2px);
  --theme-highlight-layer:linear-gradient(120deg,transparent 10%,rgba(255,255,255,.34) 32%,transparent 47%,rgba(125,192,139,.14) 72%,transparent 88%);
  --theme-noise-opacity:.08;
  --theme-pattern-opacity:.55;
  --theme-symbol-opacity:.24;
  --theme-card-glow:0 0 28px rgba(91,184,121,.17);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.32),transparent 43%,rgba(120,194,140,.10)),repeating-linear-gradient(136deg,rgba(29,106,67,.018) 0 1px,transparent 1px 24px);
}

.page-container.theme-diamond{
  --main-bg:radial-gradient(circle at 18% 12%,rgba(255,255,255,.95),transparent 32%),radial-gradient(circle at 78% 20%,rgba(220,236,255,.52),transparent 32%),radial-gradient(circle at 48% 86%,rgba(163,180,201,.22),transparent 38%),linear-gradient(145deg,#fbfdff 0%,#fff 42%,#dbe6f1 100%);
  --card-bg:rgba(255,255,255,.80);
  --text-main:#182231;
  --text-sub:#6d7d92;
  --primary:#1f2937;
  --primary-text:#fff;
  --tag-bg:rgba(226,232,240,.64);
  --card-border:rgba(255,255,255,.95);
  --card-shadow:0 20px 48px rgba(71,85,105,.12);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.86),inset 0 -1px 0 rgba(148,163,184,.12);
  --primary-gradient:linear-gradient(135deg,#111827,#6b7c92);
  --primary-shadow:rgba(71,85,105,.22);
  --theme-line:rgba(71,85,105,.11);
  --theme-accent-soft:rgba(255,255,255,.62);
  --theme-pattern-layer:linear-gradient(45deg,transparent 0 24%,rgba(148,163,184,.13) 24% 25%,transparent 25% 49%,rgba(255,255,255,.42) 49% 50%,transparent 50% 100%),linear-gradient(135deg,transparent 0 22%,rgba(148,163,184,.12) 22% 23%,transparent 23% 54%,rgba(255,255,255,.36) 54% 55%,transparent 55% 100%),repeating-linear-gradient(45deg,rgba(148,163,184,.10) 0 1px,transparent 1px 42px),repeating-linear-gradient(135deg,rgba(255,255,255,.36) 0 1px,transparent 1px 46px);
  --ambient-layer:linear-gradient(135deg,rgba(255,255,255,.78),transparent 24%,rgba(148,163,184,.17) 45%,transparent 62%,rgba(255,255,255,.66) 82%),radial-gradient(circle at 76% 16%,rgba(225,239,255,.34),transparent 28%);
  --theme-symbol-layer:radial-gradient(circle at 17% 19%,rgba(255,255,255,.98) 0 1px,rgba(255,255,255,.45) 2px,transparent 8px),radial-gradient(circle at 54% 30%,rgba(255,255,255,.94) 0 2px,rgba(186,203,224,.34) 3px,transparent 11px),radial-gradient(circle at 82% 66%,rgba(255,255,255,.84) 0 1px,transparent 9px),radial-gradient(circle at 35% 84%,rgba(186,203,224,.50) 0 1px,transparent 8px),linear-gradient(52deg,transparent 17%,rgba(255,255,255,.28) 18%,transparent 22%),linear-gradient(128deg,transparent 62%,rgba(174,191,214,.16) 64%,transparent 68%);
  --sparkle-layer:radial-gradient(circle at 18% 20%,rgba(255,255,255,.98) 0 1px,transparent 2px),radial-gradient(circle at 54% 30%,rgba(255,255,255,.90) 0 2px,transparent 3px),radial-gradient(circle at 82% 66%,rgba(255,255,255,.80) 0 1px,transparent 2px),radial-gradient(circle at 35% 84%,rgba(186,203,224,.50) 0 1px,transparent 2px);
  --theme-highlight-layer:linear-gradient(118deg,transparent 10%,rgba(255,255,255,.50) 27%,transparent 39%,rgba(148,163,184,.18) 58%,transparent 78%);
  --theme-noise-opacity:.09;
  --theme-pattern-opacity:.62;
  --theme-symbol-opacity:.34;
  --theme-card-glow:0 0 36px rgba(180,198,220,.20),0 0 0 1px rgba(255,255,255,.32);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.44),transparent 39%,rgba(173,190,212,.11)),linear-gradient(45deg,transparent 0 48%,rgba(255,255,255,.22) 49%,transparent 51%),linear-gradient(135deg,transparent 0 55%,rgba(148,163,184,.09) 56%,transparent 58%);
  --theme-pattern-duration:38s;
  --theme-symbol-duration:24s;
}

.page-container.theme-sunset{
  --main-bg:radial-gradient(circle at 24% 13%,rgba(255,255,255,.78),transparent 31%),radial-gradient(circle at 74% 26%,rgba(255,188,118,.42),transparent 34%),radial-gradient(circle at 40% 92%,rgba(244,114,182,.22),transparent 40%),linear-gradient(145deg,#fff7ed 0%,#fff1f2 49%,#ffc6a8 100%);
  --card-bg:rgba(255,255,255,.84);
  --text-main:#3c1f17;
  --text-sub:#9e6a58;
  --primary:#e05b3c;
  --primary-text:#fff;
  --tag-bg:rgba(255,220,204,.64);
  --card-border:rgba(255,255,255,.76);
  --card-shadow:0 20px 48px rgba(224,88,61,.13);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.66),inset 0 -1px 0 rgba(251,146,60,.09);
  --primary-gradient:linear-gradient(135deg,#f47b20,#e14c6d);
  --primary-shadow:rgba(225,92,72,.20);
  --theme-line:rgba(224,88,61,.10);
  --theme-accent-soft:rgba(251,146,60,.34);
  --theme-pattern-layer:repeating-linear-gradient(0deg,rgba(255,255,255,.20) 0 1px,transparent 1px 34px),linear-gradient(180deg,transparent 0 34%,rgba(255,185,122,.18) 43%,transparent 54%,rgba(244,114,182,.11) 68%,transparent 82%);
  --ambient-layer:radial-gradient(circle at 74% 34%,rgba(255,181,95,.36),transparent 31%),radial-gradient(ellipse at 30% 28%,rgba(255,255,255,.50),transparent 28%),linear-gradient(120deg,rgba(255,255,255,.36),transparent 28%,rgba(251,146,60,.18) 52%,rgba(244,114,182,.13) 72%,transparent);
  --theme-symbol-layer:radial-gradient(circle at 24% 20%,rgba(255,255,255,.78) 0 1px,transparent 2px),radial-gradient(circle at 76% 24%,rgba(251,146,60,.40) 0 2px,transparent 4px),radial-gradient(circle at 62% 78%,rgba(244,114,182,.28) 0 2px,transparent 4px),radial-gradient(circle at 18% 70%,rgba(255,224,189,.34) 0 2px,transparent 4px);
  --sparkle-layer:radial-gradient(circle at 24% 20%,rgba(255,255,255,.86) 0 1px,transparent 2px),radial-gradient(circle at 76% 24%,rgba(251,146,60,.42) 0 1px,transparent 2px),radial-gradient(circle at 62% 78%,rgba(244,114,182,.30) 0 1px,transparent 2px);
  --theme-highlight-layer:linear-gradient(90deg,transparent 4%,rgba(255,255,255,.30) 28%,rgba(255,180,113,.16) 50%,transparent 82%);
  --theme-noise-opacity:.07;
  --theme-pattern-opacity:.62;
  --theme-symbol-opacity:.23;
  --theme-card-glow:0 0 30px rgba(251,146,60,.18);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.32),transparent 43%,rgba(251,146,60,.10)),repeating-linear-gradient(0deg,rgba(224,88,61,.018) 0 1px,transparent 1px 18px);
}

.page-container.theme-mint{
  --main-bg:radial-gradient(circle at 24% 12%,rgba(255,255,255,.90),transparent 34%),radial-gradient(circle at 82% 20%,rgba(181,245,229,.48),transparent 32%),radial-gradient(circle at 38% 88%,rgba(91,217,196,.20),transparent 38%),linear-gradient(145deg,#f0fffb 0%,#fff 47%,#bdf0e2 100%);
  --card-bg:rgba(255,255,255,.83);
  --text-main:#10352f;
  --text-sub:#5d857e;
  --primary:#0f8f7a;
  --primary-text:#fff;
  --tag-bg:rgba(205,245,236,.68);
  --card-border:rgba(255,255,255,.76);
  --card-shadow:0 20px 48px rgba(15,143,122,.12);
  --card-inner-shadow:inset 0 1px 0 rgba(255,255,255,.70),inset 0 -1px 0 rgba(34,193,166,.09);
  --primary-gradient:linear-gradient(135deg,#0f766e,#2ad3b3);
  --primary-shadow:rgba(15,143,122,.20);
  --theme-line:rgba(15,143,122,.10);
  --theme-accent-soft:rgba(45,212,191,.34);
  --theme-pattern-layer:linear-gradient(116deg,rgba(255,255,255,.50),transparent 27%,rgba(45,212,191,.16) 55%,transparent 78%),repeating-linear-gradient(105deg,rgba(15,143,122,.046) 0 1px,transparent 1px 34px);
  --ambient-layer:radial-gradient(ellipse at 20% 20%,rgba(255,255,255,.54),transparent 26%),radial-gradient(ellipse at 78% 24%,rgba(145,236,218,.28),transparent 32%),radial-gradient(ellipse at 52% 84%,rgba(205,245,236,.30),transparent 36%);
  --theme-symbol-layer:radial-gradient(circle at 18% 26%,rgba(255,255,255,.54) 0 4px,rgba(45,212,191,.16) 5px 6px,transparent 8px),radial-gradient(circle at 34% 72%,rgba(255,255,255,.46) 0 5px,rgba(45,212,191,.13) 6px 7px,transparent 10px),radial-gradient(circle at 72% 22%,rgba(255,255,255,.52) 0 3px,rgba(45,212,191,.14) 4px 5px,transparent 7px),radial-gradient(circle at 82% 68%,rgba(255,255,255,.45) 0 6px,rgba(45,212,191,.12) 7px 8px,transparent 11px),radial-gradient(circle at 52% 46%,rgba(255,255,255,.38) 0 3px,transparent 7px);
  --sparkle-layer:radial-gradient(circle at 20% 24%,rgba(255,255,255,.84) 0 1px,transparent 2px),radial-gradient(circle at 76% 20%,rgba(45,212,191,.38) 0 1px,transparent 2px),radial-gradient(circle at 52% 82%,rgba(255,255,255,.54) 0 1px,transparent 2px);
  --theme-highlight-layer:linear-gradient(120deg,transparent 12%,rgba(255,255,255,.34) 31%,transparent 48%,rgba(45,212,191,.13) 70%,transparent 86%);
  --theme-noise-opacity:.07;
  --theme-pattern-opacity:.56;
  --theme-symbol-opacity:.26;
  --theme-card-glow:0 0 30px rgba(45,212,191,.17);
  --theme-card-texture:linear-gradient(145deg,rgba(255,255,255,.34),transparent 43%,rgba(45,212,191,.10)),radial-gradient(circle at 18% 14%,rgba(205,245,236,.16),transparent 28%);
}

.hide-today-card .checklist-card,
.hide-today-card .festival-card,
.hide-today-card .grade-course-card,
.hide-today-card .calendar-panel{
  background-color:var(--card-bg)!important;
  background-image:var(--theme-card-texture)!important;
  background-blend-mode:soft-light,normal;
  border-color:var(--card-border)!important;
  box-shadow:var(--card-shadow),var(--theme-card-glow),var(--card-inner-shadow)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.2)!important;
  backdrop-filter:blur(22px) saturate(1.2)!important;
}
.today-action-row .compact-today-card.dashboard-card{
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

@keyframes keylineThemePatternShift{
  0%{transform:translate3d(-2%,-1%,0) scale(1) rotate(.001deg);}
  50%{transform:translate3d(1.5%,1%,0) scale(1.025) rotate(.001deg);}
  100%{transform:translate3d(3%,-1.5%,0) scale(1.05) rotate(.001deg);}
}
@keyframes keylineThemeSymbolDrift{
  0%{transform:translate3d(0,0,0);filter:saturate(1.02) brightness(.94);}
  50%{transform:translate3d(1.6%,-1%,0);filter:saturate(1.10) brightness(1.12);}
  100%{transform:translate3d(3%,-1.6%,0);filter:saturate(1.02) brightness(.94);}
}
@media(max-width:480px){
  .page-container::before{inset:-18%;}
  .page-container::after{inset:-14%;}
}
@media(prefers-reduced-motion:reduce){
  .page-container::before,
  .page-container::after{
    animation:none!important;
    transform:none!important;
    filter:none!important;
  }
  .count-card,
  .checklist-card,
  .festival-card,
  .dashboard-card,
  .calendar-panel,
  .timeline-card{transition:none!important;}
}

/* flowing gradient theme foundation */
.page-container{
  --flow-gradient-1:rgba(255,255,255,.64);
  --flow-gradient-2:rgba(255,255,255,.42);
  --flow-gradient-3:rgba(255,255,255,.30);
  --flow-gradient-4:rgba(255,255,255,.22);
  --flow-ambient-layer:linear-gradient(120deg,rgba(255,255,255,.18),transparent 34%,rgba(255,255,255,.14) 62%,transparent);
  --flow-symbol-layer:radial-gradient(circle at 18% 24%,rgba(255,255,255,.68) 0 1px,transparent 2px),radial-gradient(circle at 76% 18%,rgba(255,255,255,.48) 0 1px,transparent 2px);
  --flow-highlight-layer:linear-gradient(112deg,transparent 12%,rgba(255,255,255,.25) 34%,transparent 52%,rgba(255,255,255,.12) 72%,transparent 88%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.34),transparent 36%,rgba(255,255,255,.12) 62%,transparent 82%);
  --flow-speed-bg:34s;
  --flow-speed-symbol:44s;
  --flow-opacity-bg:.70;
  --flow-opacity-symbol:.24;
  --flow-blur-bg:18px;
  --flow-card-speed:26s;
  --flow-button-speed:14s;
}

.page-container::before{
  inset:-20%;
  z-index:0;
  pointer-events:none;
  background:
    var(--flow-ambient-layer),
    radial-gradient(circle at 20% 20%,var(--flow-gradient-1),transparent 34%),
    radial-gradient(circle at 80% 12%,var(--flow-gradient-2),transparent 32%),
    radial-gradient(circle at 18% 86%,var(--flow-gradient-3),transparent 36%),
    radial-gradient(circle at 88% 78%,var(--flow-gradient-4),transparent 34%);
  background-size:170% 170%,140% 140%,150% 150%,145% 145%,155% 155%;
  background-position:0 0,10% 20%,80% 10%,20% 90%,90% 80%;
  filter:blur(var(--flow-blur-bg)) saturate(1.06);
  opacity:var(--flow-opacity-bg);
  mix-blend-mode:normal;
  transform:translate3d(0,0,0);
  will-change:transform,background-position;
  animation:keylineFlowBackground var(--flow-speed-bg) ease-in-out infinite alternate;
}
.page-container::after{
  inset:-12%;
  z-index:0;
  pointer-events:none;
  background:var(--flow-symbol-layer),var(--flow-highlight-layer);
  background-size:360px 360px,130% 130%;
  background-position:0 0,0 0;
  filter:saturate(1.05);
  opacity:var(--flow-opacity-symbol);
  mix-blend-mode:screen;
  transform:translate3d(0,0,0);
  will-change:transform,background-position,opacity;
  animation:keylineFlowSymbols var(--flow-speed-symbol) linear infinite;
}
.main-view,
.desktop-shell,
.desktop-layout,
.desktop-nav,
.cloud-login-toast{
  position:relative;
  z-index:2;
}
.mask,
.detail-overlay{
  z-index:999;
}

.dashboard-card,
.count-card,
.checklist-card,
.festival-card,
.calendar-panel,
.timeline-card,
.form-card,
.settings-panel,
.settings-card,
.subscription-card,
.subscription-summary-card,
.subscription-next-card,
.grade-course-card,
.translation-library-card,
.translation-practice-card,
.ielts-practice-hero,
.ielts-translation-summary,
.schedule-container,
.today-action-row{
  background-color:var(--card-bg)!important;
  background-image:var(--flow-card-shine),var(--theme-card-texture)!important;
  background-size:220% 220%,auto!important;
  background-position:0 0,0 0;
  background-blend-mode:soft-light,normal;
}
.dashboard-card,
.calendar-panel,
.settings-panel,
.today-action-row,
.festival-hero{
  animation:keylineCardShine var(--flow-card-speed) ease-in-out infinite alternate;
}
.today-action-row .compact-today-card.dashboard-card{
  animation:none!important;
}

.primary-btn,
.theme-btn,
.view-btn.active,
.category-pill.active,
.category-pill-active,
.schedule-mode-active,
.save-btn,
.subitem-add-btn,
.backup-main-btn,
.restore-btn{
  background-size:220% 220%!important;
  background-position:0% 50%;
  animation:keylineButtonFlow var(--flow-button-speed) ease-in-out infinite alternate;
}

.page-container.theme-cream{
  --flow-gradient-1:rgba(255,255,255,.82);
  --flow-gradient-2:rgba(255,245,226,.58);
  --flow-gradient-3:rgba(240,218,186,.32);
  --flow-gradient-4:rgba(255,234,215,.24);
  --flow-ambient-layer:radial-gradient(circle at 12% 14%,rgba(255,255,255,.74),transparent 30%),linear-gradient(118deg,rgba(255,255,255,.35),transparent 34%,rgba(232,205,164,.16) 58%,transparent 82%);
  --flow-symbol-layer:radial-gradient(circle at 16% 24%,rgba(255,255,255,.78) 0 7px,rgba(255,248,232,.22) 18px,transparent 34px),radial-gradient(circle at 78% 20%,rgba(255,246,224,.58) 0 4px,transparent 22px),radial-gradient(circle at 64% 76%,rgba(223,190,142,.18) 0 5px,transparent 28px),radial-gradient(circle at 34% 62%,rgba(255,255,255,.50) 0 3px,transparent 18px);
  --flow-highlight-layer:linear-gradient(118deg,transparent 8%,rgba(255,255,255,.36) 30%,transparent 48%,rgba(226,195,149,.12) 74%,transparent 88%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.42),transparent 34%,rgba(238,216,181,.15) 62%,transparent 82%);
  --flow-opacity-bg:.78;
  --flow-opacity-symbol:.24;
  --flow-blur-bg:20px;
  --flow-speed-bg:38s;
  --flow-speed-symbol:52s;
  --flow-button-speed:16s;
}
.page-container.theme-pink{
  --flow-gradient-1:rgba(255,255,255,.80);
  --flow-gradient-2:rgba(255,194,216,.46);
  --flow-gradient-3:rgba(255,226,236,.42);
  --flow-gradient-4:rgba(255,139,178,.22);
  --flow-ambient-layer:radial-gradient(ellipse at 22% 18%,rgba(255,211,226,.34),transparent 34%),radial-gradient(ellipse at 82% 20%,rgba(255,255,255,.58),transparent 30%),linear-gradient(126deg,transparent 10%,rgba(255,255,255,.26) 38%,transparent 58%);
  --flow-symbol-layer:radial-gradient(18px 9px at 14% 26%,rgba(255,139,178,.26) 0 54%,transparent 66%),radial-gradient(16px 8px at 32% 14%,rgba(255,232,240,.58) 0 54%,transparent 66%),radial-gradient(20px 10px at 70% 24%,rgba(255,155,189,.24) 0 54%,transparent 68%),radial-gradient(15px 8px at 86% 58%,rgba(255,255,255,.48) 0 54%,transparent 66%),radial-gradient(17px 9px at 48% 76%,rgba(255,145,181,.20) 0 54%,transparent 68%),radial-gradient(13px 7px at 24% 84%,rgba(255,236,242,.58) 0 54%,transparent 66%),radial-gradient(15px 8px at 58% 38%,rgba(255,178,205,.18) 0 54%,transparent 66%),radial-gradient(12px 7px at 78% 84%,rgba(255,246,249,.50) 0 52%,transparent 66%);
  --flow-highlight-layer:linear-gradient(128deg,transparent 12%,rgba(255,255,255,.26) 36%,transparent 52%,rgba(255,151,186,.14) 78%,transparent 92%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.38),transparent 34%,rgba(255,173,201,.16) 62%,transparent 82%);
  --flow-opacity-bg:.78;
  --flow-opacity-symbol:.30;
  --flow-blur-bg:19px;
  --flow-speed-bg:34s;
  --flow-speed-symbol:46s;
  --flow-button-speed:15s;
}
.page-container.theme-blue{
  --flow-gradient-1:rgba(255,255,255,.78);
  --flow-gradient-2:rgba(173,220,255,.44);
  --flow-gradient-3:rgba(94,178,255,.22);
  --flow-gradient-4:rgba(219,241,255,.36);
  --flow-ambient-layer:repeating-linear-gradient(178deg,rgba(29,101,193,.045) 0 1px,transparent 1px 22px),linear-gradient(110deg,rgba(255,255,255,.42),transparent 28%,rgba(88,166,255,.16) 54%,transparent 82%);
  --flow-symbol-layer:repeating-radial-gradient(ellipse at 50% -10%,transparent 0 20px,rgba(29,101,193,.052) 21px 22px,transparent 23px 48px),radial-gradient(circle at 18% 24%,rgba(255,255,255,.72) 0 1px,transparent 2px),radial-gradient(circle at 34% 70%,rgba(178,222,255,.42) 0 2px,transparent 4px),radial-gradient(circle at 76% 26%,rgba(255,255,255,.68) 0 1px,transparent 2px),radial-gradient(circle at 84% 72%,rgba(99,179,255,.28) 0 2px,transparent 4px);
  --flow-highlight-layer:linear-gradient(112deg,transparent 10%,rgba(255,255,255,.34) 28%,transparent 42%,rgba(112,184,255,.13) 66%,transparent 84%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.38),transparent 34%,rgba(116,191,255,.14) 62%,transparent 82%);
  --flow-opacity-bg:.76;
  --flow-opacity-symbol:.26;
  --flow-blur-bg:18px;
  --flow-speed-bg:36s;
  --flow-speed-symbol:40s;
}
.page-container.theme-purple{
  --flow-gradient-1:rgba(255,255,255,.78);
  --flow-gradient-2:rgba(204,177,255,.45);
  --flow-gradient-3:rgba(238,216,255,.38);
  --flow-gradient-4:rgba(167,139,250,.22);
  --flow-ambient-layer:repeating-linear-gradient(124deg,rgba(124,92,200,.040) 0 1px,transparent 1px 30px),radial-gradient(ellipse at 22% 24%,rgba(196,168,255,.28),transparent 34%),radial-gradient(ellipse at 82% 18%,rgba(255,255,255,.56),transparent 30%);
  --flow-symbol-layer:radial-gradient(circle at 18% 22%,rgba(255,255,255,.82) 0 1px,transparent 2px),radial-gradient(circle at 30% 68%,rgba(196,168,255,.44) 0 1px,transparent 2px),radial-gradient(circle at 68% 28%,rgba(255,255,255,.74) 0 1px,transparent 2px),radial-gradient(circle at 82% 70%,rgba(181,152,246,.34) 0 2px,transparent 4px),radial-gradient(circle at 48% 42%,rgba(255,255,255,.52) 0 1px,transparent 2px),radial-gradient(circle at 58% 86%,rgba(196,168,255,.32) 0 1px,transparent 2px);
  --flow-highlight-layer:linear-gradient(118deg,transparent 12%,rgba(255,255,255,.30) 36%,transparent 52%,rgba(196,168,255,.15) 74%,transparent 90%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.38),transparent 34%,rgba(196,168,255,.15) 62%,transparent 82%);
  --flow-opacity-bg:.76;
  --flow-opacity-symbol:.27;
  --flow-blur-bg:19px;
  --flow-speed-bg:40s;
  --flow-speed-symbol:48s;
}
.page-container.theme-forest{
  --flow-gradient-1:rgba(255,255,255,.72);
  --flow-gradient-2:rgba(178,229,188,.38);
  --flow-gradient-3:rgba(92,168,111,.22);
  --flow-gradient-4:rgba(230,255,236,.42);
  --flow-ambient-layer:repeating-linear-gradient(136deg,rgba(29,106,67,.042) 0 1px,transparent 1px 34px),radial-gradient(circle at 20% 20%,rgba(255,255,255,.42),transparent 18%),radial-gradient(circle at 72% 28%,rgba(125,192,139,.20),transparent 24%);
  --flow-symbol-layer:radial-gradient(24px 12px at 16% 24%,rgba(72,132,86,.15) 0 56%,transparent 70%),radial-gradient(18px 9px at 78% 20%,rgba(255,255,255,.32) 0 56%,transparent 70%),radial-gradient(26px 13px at 72% 72%,rgba(82,151,94,.14) 0 56%,transparent 70%),radial-gradient(18px 9px at 36% 80%,rgba(120,194,140,.17) 0 56%,transparent 70%),radial-gradient(21px 10px at 52% 44%,rgba(58,128,78,.11) 0 56%,transparent 70%);
  --flow-highlight-layer:linear-gradient(120deg,transparent 10%,rgba(255,255,255,.34) 30%,transparent 48%,rgba(125,192,139,.13) 72%,transparent 88%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.36),transparent 34%,rgba(120,194,140,.14) 62%,transparent 82%);
  --flow-opacity-bg:.76;
  --flow-opacity-symbol:.26;
  --flow-blur-bg:18px;
  --flow-speed-bg:42s;
  --flow-speed-symbol:54s;
}
.page-container.theme-diamond{
  --flow-gradient-1:rgba(255,255,255,.86);
  --flow-gradient-2:rgba(216,235,255,.50);
  --flow-gradient-3:rgba(166,184,207,.26);
  --flow-gradient-4:rgba(245,249,255,.62);
  --flow-ambient-layer:linear-gradient(45deg,transparent 0 24%,rgba(148,163,184,.13) 24% 25%,transparent 25% 49%,rgba(255,255,255,.44) 49% 50%,transparent 50% 100%),linear-gradient(135deg,transparent 0 22%,rgba(148,163,184,.12) 22% 23%,transparent 23% 54%,rgba(255,255,255,.38) 54% 55%,transparent 55% 100%),linear-gradient(118deg,rgba(255,255,255,.52),transparent 34%,rgba(148,163,184,.16) 54%,transparent 74%);
  --flow-symbol-layer:radial-gradient(circle at 17% 19%,rgba(255,255,255,.96) 0 1px,rgba(255,255,255,.42) 2px,transparent 9px),radial-gradient(circle at 54% 30%,rgba(255,255,255,.90) 0 2px,rgba(186,203,224,.32) 3px,transparent 12px),radial-gradient(circle at 82% 66%,rgba(255,255,255,.78) 0 1px,transparent 9px),radial-gradient(circle at 35% 84%,rgba(186,203,224,.48) 0 1px,transparent 8px),linear-gradient(52deg,transparent 15%,rgba(255,255,255,.30) 18%,transparent 23%),linear-gradient(128deg,transparent 60%,rgba(174,191,214,.18) 64%,transparent 69%);
  --flow-highlight-layer:linear-gradient(112deg,transparent 4%,rgba(255,255,255,.50) 24%,transparent 38%,rgba(148,163,184,.18) 58%,transparent 78%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.56),transparent 32%,rgba(173,190,212,.16) 62%,transparent 82%);
  --flow-opacity-bg:.82;
  --flow-opacity-symbol:.38;
  --flow-blur-bg:16px;
  --flow-speed-bg:46s;
  --flow-speed-symbol:38s;
  --flow-card-speed:32s;
  --flow-button-speed:18s;
}
.page-container.theme-sunset{
  --flow-gradient-1:rgba(255,255,255,.68);
  --flow-gradient-2:rgba(255,187,112,.44);
  --flow-gradient-3:rgba(255,132,122,.24);
  --flow-gradient-4:rgba(255,220,170,.36);
  --flow-ambient-layer:radial-gradient(circle at 74% 34%,rgba(255,181,95,.36),transparent 31%),repeating-linear-gradient(0deg,rgba(255,255,255,.18) 0 1px,transparent 1px 34px),linear-gradient(120deg,rgba(255,255,255,.34),transparent 28%,rgba(251,146,60,.18) 52%,rgba(244,114,182,.12) 72%,transparent);
  --flow-symbol-layer:linear-gradient(180deg,transparent 0 34%,rgba(255,185,122,.18) 43%,transparent 54%,rgba(244,114,182,.10) 68%,transparent 82%),radial-gradient(circle at 24% 20%,rgba(255,255,255,.74) 0 1px,transparent 2px),radial-gradient(circle at 76% 24%,rgba(251,146,60,.38) 0 2px,transparent 4px),radial-gradient(circle at 62% 78%,rgba(244,114,182,.26) 0 2px,transparent 4px);
  --flow-highlight-layer:linear-gradient(90deg,transparent 4%,rgba(255,255,255,.30) 28%,rgba(255,180,113,.18) 50%,transparent 82%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.36),transparent 34%,rgba(251,146,60,.15) 62%,transparent 82%);
  --flow-opacity-bg:.80;
  --flow-opacity-symbol:.28;
  --flow-blur-bg:19px;
  --flow-speed-bg:38s;
  --flow-speed-symbol:48s;
}
.page-container.theme-mint{
  --flow-gradient-1:rgba(255,255,255,.76);
  --flow-gradient-2:rgba(160,241,222,.44);
  --flow-gradient-3:rgba(45,212,191,.22);
  --flow-gradient-4:rgba(218,252,245,.42);
  --flow-ambient-layer:radial-gradient(ellipse at 20% 20%,rgba(255,255,255,.52),transparent 26%),radial-gradient(ellipse at 78% 24%,rgba(145,236,218,.28),transparent 32%),linear-gradient(116deg,rgba(255,255,255,.46),transparent 27%,rgba(45,212,191,.15) 55%,transparent 78%);
  --flow-symbol-layer:radial-gradient(circle at 18% 26%,rgba(255,255,255,.52) 0 4px,rgba(45,212,191,.16) 5px 6px,transparent 9px),radial-gradient(circle at 34% 72%,rgba(255,255,255,.44) 0 5px,rgba(45,212,191,.13) 6px 7px,transparent 11px),radial-gradient(circle at 72% 22%,rgba(255,255,255,.50) 0 3px,rgba(45,212,191,.14) 4px 5px,transparent 8px),radial-gradient(circle at 82% 68%,rgba(255,255,255,.43) 0 6px,rgba(45,212,191,.12) 7px 8px,transparent 12px),radial-gradient(circle at 52% 46%,rgba(255,255,255,.36) 0 3px,transparent 8px);
  --flow-highlight-layer:linear-gradient(120deg,transparent 10%,rgba(255,255,255,.34) 31%,transparent 48%,rgba(45,212,191,.13) 70%,transparent 86%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.38),transparent 34%,rgba(45,212,191,.15) 62%,transparent 82%);
  --flow-opacity-bg:.78;
  --flow-opacity-symbol:.29;
  --flow-blur-bg:18px;
  --flow-speed-bg:36s;
  --flow-speed-symbol:42s;
}

@keyframes keylineFlowBackground{
  0%{
    transform:translate3d(-2%,-1%,0) scale(1) rotate(.001deg);
    background-position:0 0,10% 20%,80% 10%,20% 90%,90% 80%;
  }
  50%{
    transform:translate3d(2%,1.5%,0) scale(1.04) rotate(.001deg);
    background-position:40% 60%,30% 10%,70% 30%,10% 70%,80% 60%;
  }
  100%{
    transform:translate3d(1%,-2%,0) scale(1.02) rotate(.001deg);
    background-position:100% 100%,20% 80%,90% 25%,40% 70%,60% 90%;
  }
}
@keyframes keylineFlowSymbols{
  0%{
    transform:translate3d(0,0,0) rotate(.001deg);
    background-position:0 0,0 0;
  }
  100%{
    transform:translate3d(1.5%,-2%,0) rotate(.001deg);
    background-position:120px 180px,-160px 220px;
  }
}
@keyframes keylineCardShine{
  0%{background-position:0% 50%,0 0;}
  100%{background-position:100% 50%,0 0;}
}
@keyframes keylineButtonFlow{
  0%{background-position:0% 50%;}
  100%{background-position:100% 50%;}
}
@media(max-width:480px){
  .page-container::before{inset:-22%;filter:blur(14px) saturate(1.04);}
  .page-container::after{inset:-10%;}
  .calendar-panel,
  .settings-panel,
  .festival-hero{animation:none!important;}
}
@media(prefers-reduced-motion:reduce){
  .page-container::before,
  .page-container::after,
  .dashboard-card,
  .calendar-panel,
  .settings-panel,
  .today-action-row,
  .festival-hero,
  .primary-btn,
  .theme-btn,
  .view-btn.active,
  .category-pill.active,
  .category-pill-active,
  .schedule-mode-active,
  .save-btn,
  .subitem-add-btn,
  .backup-main-btn,
  .restore-btn{
    animation:none!important;
  }
}

/* v1.7.17 visible flowing theme repair */
html[class*="theme-"],
.page-container,
#app.page-container{
  --flow-opacity-bg:.88;
  --flow-opacity-symbol:.36;
  --flow-blur-bg:10px;
  --flow-speed-bg:18s;
  --flow-speed-symbol:26s;
  --flow-card-speed:18s;
  --flow-button-speed:8s;
  --flow-symbol-size:420px 420px,380px 380px,360px 360px,340px 340px,130% 130%;
  --flow-highlight-size:140% 140%;
}
.page-container::before,
.page-container::after{
  content:"";
  position:fixed;
  pointer-events:none;
  display:block;
  transform:translate3d(0,0,0);
}
.page-container::before{
  inset:-20%;
  z-index:0;
  background:
    var(--flow-ambient-layer),
    radial-gradient(circle at 16% 18%,var(--flow-gradient-1),transparent 32%),
    radial-gradient(circle at 84% 14%,var(--flow-gradient-2),transparent 34%),
    radial-gradient(circle at 18% 88%,var(--flow-gradient-3),transparent 36%),
    radial-gradient(circle at 90% 78%,var(--flow-gradient-4),transparent 34%);
  background-size:180% 180%,145% 145%,150% 150%,150% 150%,155% 155%;
  background-position:0 0,12% 18%,82% 12%,18% 88%,90% 78%;
  filter:blur(var(--flow-blur-bg)) saturate(1.12);
  opacity:var(--flow-opacity-bg);
  animation:keylineFlowBackgroundVisible var(--flow-speed-bg) ease-in-out infinite alternate;
  will-change:transform,background-position;
}
.page-container::after{
  inset:-12%;
  z-index:1;
  background:var(--flow-symbol-layer),var(--flow-highlight-layer);
  background-size:var(--flow-symbol-size),var(--flow-highlight-size);
  background-position:0 0,60px 80px,-40px 120px,120px -60px,0 0;
  opacity:var(--flow-opacity-symbol);
  filter:saturate(1.12) brightness(1.04);
  mix-blend-mode:screen;
  animation:keylineFlowSymbolsVisible var(--flow-speed-symbol) linear infinite;
  will-change:transform,background-position,opacity;
}
.main-view,
.desktop-shell,
.desktop-layout,
.desktop-nav,
.cloud-login-toast{
  position:relative;
  z-index:2;
}
.mask,
.detail-overlay{z-index:999;}

.dashboard-card,
.count-card,
.checklist-card,
.festival-card,
.calendar-panel,
.timeline-card,
.form-card,
.settings-panel,
.settings-card,
.schedule-container,
.subscription-card,
.subscription-summary-card,
.subscription-next-card,
.grade-course-card,
.translation-library-card,
.translation-practice-card,
.ielts-practice-hero,
.ielts-translation-summary,
.today-action-row{
  background-color:var(--card-bg)!important;
  background-image:var(--flow-card-shine),var(--theme-card-texture)!important;
  background-size:220% 220%,auto!important;
  background-position:0 50%,0 0;
  background-blend-mode:soft-light,normal;
}
.today-action-row .compact-today-card.dashboard-card{
  background-color:var(--card-bg)!important;
  background-image:var(--flow-card-shine),var(--theme-card-texture)!important;
  background-size:220% 220%,auto!important;
  background-position:0 50%,0 0;
  background-blend-mode:soft-light,normal;
  border:1px solid var(--card-border)!important;
  box-shadow:0 12px 28px rgba(15,23,42,.055),var(--theme-card-glow)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.14)!important;
  backdrop-filter:blur(16px) saturate(1.14)!important;
}
.tab-picker-panel,
.backup-panel,
.emoji-panel{
  background-color:rgba(255,255,255,.94)!important;
}

html.theme-cream,.page-container.theme-cream,#app.theme-cream{
  --card-bg:rgba(255,252,247,.82);
  --flow-gradient-1:rgba(255,255,255,.96);
  --flow-gradient-2:rgba(255,242,219,.72);
  --flow-gradient-3:rgba(233,206,166,.42);
  --flow-gradient-4:rgba(255,232,210,.34);
  --flow-ambient-layer:radial-gradient(circle at 10% 16%,rgba(255,255,255,.92),transparent 29%),radial-gradient(circle at 74% 18%,rgba(255,244,221,.54),transparent 32%),linear-gradient(118deg,rgba(255,255,255,.42),transparent 34%,rgba(232,205,164,.22) 58%,transparent 82%);
  --flow-symbol-layer:radial-gradient(circle at 15% 22%,rgba(255,255,255,.82) 0 10px,rgba(255,248,232,.30) 24px,transparent 46px),radial-gradient(circle at 78% 20%,rgba(255,246,224,.70) 0 6px,transparent 28px),radial-gradient(circle at 64% 76%,rgba(223,190,142,.28) 0 7px,transparent 32px),radial-gradient(circle at 34% 62%,rgba(255,255,255,.62) 0 4px,transparent 22px),radial-gradient(circle at 46% 32%,rgba(255,250,239,.46) 0 5px,transparent 26px);
  --flow-highlight-layer:linear-gradient(118deg,transparent 5%,rgba(255,255,255,.46) 28%,transparent 45%,rgba(226,195,149,.18) 72%,transparent 88%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.50),transparent 32%,rgba(238,216,181,.20) 62%,transparent 82%);
  --flow-opacity-bg:.90;
  --flow-opacity-symbol:.36;
  --flow-blur-bg:10px;
  --flow-speed-bg:20s;
  --flow-speed-symbol:28s;
}
html.theme-pink,.page-container.theme-pink,#app.theme-pink{
  --card-bg:rgba(255,255,255,.82);
  --flow-gradient-1:rgba(255,255,255,.92);
  --flow-gradient-2:rgba(255,184,211,.62);
  --flow-gradient-3:rgba(255,226,236,.55);
  --flow-gradient-4:rgba(255,135,178,.34);
  --flow-ambient-layer:radial-gradient(ellipse at 22% 18%,rgba(255,205,224,.48),transparent 34%),radial-gradient(ellipse at 82% 20%,rgba(255,255,255,.66),transparent 30%),linear-gradient(126deg,transparent 10%,rgba(255,255,255,.34) 38%,transparent 58%);
  --flow-symbol-layer:radial-gradient(20px 10px at 12% 24%,rgba(255,128,172,.34) 0 54%,transparent 68%),radial-gradient(17px 9px at 30% 13%,rgba(255,232,240,.72) 0 54%,transparent 68%),radial-gradient(22px 11px at 70% 24%,rgba(255,150,188,.32) 0 54%,transparent 70%),radial-gradient(16px 9px at 86% 58%,rgba(255,255,255,.58) 0 54%,transparent 68%),radial-gradient(18px 10px at 48% 76%,rgba(255,145,181,.30) 0 54%,transparent 70%),radial-gradient(14px 8px at 24% 84%,rgba(255,236,242,.68) 0 54%,transparent 68%),radial-gradient(16px 9px at 58% 38%,rgba(255,178,205,.28) 0 54%,transparent 68%),radial-gradient(13px 8px at 78% 84%,rgba(255,246,249,.60) 0 52%,transparent 68%),radial-gradient(15px 8px at 42% 52%,rgba(255,166,197,.24) 0 54%,transparent 68%),radial-gradient(12px 7px at 8% 70%,rgba(255,230,238,.54) 0 54%,transparent 68%);
  --flow-highlight-layer:linear-gradient(128deg,transparent 10%,rgba(255,255,255,.32) 34%,transparent 52%,rgba(255,151,186,.18) 78%,transparent 92%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.44),transparent 32%,rgba(255,173,201,.21) 62%,transparent 82%);
  --flow-opacity-bg:.88;
  --flow-opacity-symbol:.42;
  --flow-blur-bg:10px;
  --flow-speed-bg:18s;
  --flow-speed-symbol:24s;
}
html.theme-blue,.page-container.theme-blue,#app.theme-blue{
  --card-bg:rgba(255,255,255,.80);
  --flow-gradient-1:rgba(255,255,255,.90);
  --flow-gradient-2:rgba(156,216,255,.60);
  --flow-gradient-3:rgba(80,172,255,.34);
  --flow-gradient-4:rgba(219,241,255,.50);
  --flow-ambient-layer:repeating-linear-gradient(178deg,rgba(29,101,193,.085) 0 1px,transparent 1px 20px),linear-gradient(110deg,rgba(255,255,255,.50),transparent 28%,rgba(88,166,255,.24) 54%,transparent 82%);
  --flow-symbol-layer:repeating-linear-gradient(178deg,rgba(29,101,193,.075) 0 1px,transparent 1px 22px),repeating-radial-gradient(ellipse at 50% -10%,transparent 0 18px,rgba(29,101,193,.075) 19px 21px,transparent 22px 44px),radial-gradient(circle at 18% 24%,rgba(255,255,255,.82) 0 1px,transparent 2px),radial-gradient(circle at 34% 70%,rgba(178,222,255,.56) 0 2px,transparent 4px),radial-gradient(circle at 76% 26%,rgba(255,255,255,.76) 0 1px,transparent 2px),radial-gradient(circle at 84% 72%,rgba(99,179,255,.40) 0 2px,transparent 4px);
  --flow-highlight-layer:linear-gradient(112deg,transparent 8%,rgba(255,255,255,.42) 26%,transparent 42%,rgba(112,184,255,.20) 66%,transparent 84%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.45),transparent 32%,rgba(116,191,255,.20) 62%,transparent 82%);
  --flow-opacity-bg:.88;
  --flow-opacity-symbol:.40;
  --flow-blur-bg:10px;
  --flow-speed-bg:18s;
  --flow-speed-symbol:22s;
}
html.theme-purple,.page-container.theme-purple,#app.theme-purple{
  --card-bg:rgba(255,255,255,.82);
  --flow-gradient-1:rgba(255,255,255,.90);
  --flow-gradient-2:rgba(198,167,255,.62);
  --flow-gradient-3:rgba(238,216,255,.50);
  --flow-gradient-4:rgba(167,139,250,.34);
  --flow-ambient-layer:repeating-linear-gradient(124deg,rgba(124,92,200,.065) 0 1px,transparent 1px 28px),radial-gradient(ellipse at 22% 24%,rgba(196,168,255,.42),transparent 34%),radial-gradient(ellipse at 82% 18%,rgba(255,255,255,.66),transparent 30%);
  --flow-symbol-layer:radial-gradient(circle at 18% 22%,rgba(255,255,255,.90) 0 1px,transparent 2px),radial-gradient(circle at 30% 68%,rgba(196,168,255,.58) 0 1px,transparent 2px),radial-gradient(circle at 68% 28%,rgba(255,255,255,.82) 0 1px,transparent 2px),radial-gradient(circle at 82% 70%,rgba(181,152,246,.46) 0 2px,transparent 4px),radial-gradient(circle at 48% 42%,rgba(255,255,255,.62) 0 1px,transparent 2px),radial-gradient(circle at 58% 86%,rgba(196,168,255,.46) 0 1px,transparent 2px),radial-gradient(circle at 36% 30%,rgba(177,151,241,.36) 0 2px,transparent 5px);
  --flow-highlight-layer:linear-gradient(118deg,transparent 10%,rgba(255,255,255,.36) 34%,transparent 52%,rgba(196,168,255,.22) 74%,transparent 90%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.45),transparent 32%,rgba(196,168,255,.20) 62%,transparent 82%);
  --flow-opacity-bg:.88;
  --flow-opacity-symbol:.38;
  --flow-blur-bg:10px;
  --flow-speed-bg:20s;
  --flow-speed-symbol:26s;
}
html.theme-forest,.page-container.theme-forest,#app.theme-forest{
  --card-bg:rgba(255,255,255,.80);
  --flow-gradient-1:rgba(255,255,255,.84);
  --flow-gradient-2:rgba(166,226,182,.56);
  --flow-gradient-3:rgba(76,158,102,.34);
  --flow-gradient-4:rgba(230,255,236,.54);
  --flow-ambient-layer:repeating-linear-gradient(136deg,rgba(29,106,67,.065) 0 1px,transparent 1px 32px),radial-gradient(circle at 20% 20%,rgba(255,255,255,.56),transparent 18%),radial-gradient(circle at 72% 28%,rgba(125,192,139,.32),transparent 24%);
  --flow-symbol-layer:radial-gradient(28px 14px at 16% 24%,rgba(72,132,86,.24) 0 56%,transparent 70%),radial-gradient(20px 10px at 78% 20%,rgba(255,255,255,.42) 0 56%,transparent 70%),radial-gradient(30px 15px at 72% 72%,rgba(82,151,94,.22) 0 56%,transparent 70%),radial-gradient(20px 10px at 36% 80%,rgba(120,194,140,.26) 0 56%,transparent 70%),radial-gradient(24px 12px at 52% 44%,rgba(58,128,78,.18) 0 56%,transparent 70%),radial-gradient(22px 11px at 8% 70%,rgba(129,196,145,.20) 0 56%,transparent 70%);
  --flow-highlight-layer:linear-gradient(120deg,transparent 8%,rgba(255,255,255,.40) 28%,transparent 48%,rgba(125,192,139,.20) 72%,transparent 88%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.42),transparent 32%,rgba(120,194,140,.20) 62%,transparent 82%);
  --flow-opacity-bg:.88;
  --flow-opacity-symbol:.38;
  --flow-blur-bg:10px;
  --flow-speed-bg:20s;
  --flow-speed-symbol:26s;
}
html.theme-diamond,.page-container.theme-diamond,#app.theme-diamond{
  --card-bg:rgba(255,255,255,.78);
  --card-border:rgba(255,255,255,.98);
  --card-shadow:0 22px 52px rgba(71,85,105,.14);
  --theme-card-glow:0 0 42px rgba(201,219,241,.30),0 0 0 1px rgba(255,255,255,.44);
  --flow-gradient-1:rgba(255,255,255,.98);
  --flow-gradient-2:rgba(207,232,255,.70);
  --flow-gradient-3:rgba(156,176,202,.38);
  --flow-gradient-4:rgba(245,249,255,.82);
  --flow-ambient-layer:linear-gradient(45deg,transparent 0 20%,rgba(148,163,184,.18) 21% 22%,transparent 23% 48%,rgba(255,255,255,.60) 49% 50%,transparent 51% 100%),linear-gradient(135deg,transparent 0 20%,rgba(148,163,184,.16) 21% 22%,transparent 23% 54%,rgba(255,255,255,.50) 55% 56%,transparent 57% 100%),linear-gradient(118deg,rgba(255,255,255,.66),transparent 32%,rgba(148,163,184,.22) 54%,transparent 74%);
  --flow-symbol-layer:linear-gradient(108deg,transparent 0 32%,rgba(255,255,255,.62) 40%,transparent 48%),radial-gradient(circle at 17% 19%,rgba(255,255,255,1) 0 2px,rgba(255,255,255,.50) 3px,transparent 10px),radial-gradient(circle at 54% 30%,rgba(255,255,255,.98) 0 2px,rgba(186,203,224,.42) 4px,transparent 13px),radial-gradient(circle at 82% 66%,rgba(255,255,255,.90) 0 1px,transparent 10px),radial-gradient(circle at 35% 84%,rgba(186,203,224,.62) 0 1px,transparent 9px),linear-gradient(52deg,transparent 13%,rgba(255,255,255,.36) 18%,transparent 24%),linear-gradient(128deg,transparent 58%,rgba(174,191,214,.24) 64%,transparent 70%);
  --flow-highlight-layer:linear-gradient(112deg,transparent 0%,rgba(255,255,255,.64) 22%,transparent 38%,rgba(148,163,184,.24) 58%,transparent 78%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.68),transparent 30%,rgba(173,190,212,.22) 62%,transparent 82%);
  --flow-opacity-bg:.92;
  --flow-opacity-symbol:.54;
  --flow-blur-bg:8px;
  --flow-speed-bg:18s;
  --flow-speed-symbol:18s;
  --flow-card-speed:16s;
  --flow-button-speed:8s;
  --flow-symbol-size:160% 160%,320px 320px,360px 360px,400px 400px,380px 380px,140% 140%,140% 140%;
}
html.theme-sunset,.page-container.theme-sunset,#app.theme-sunset{
  --card-bg:rgba(255,255,255,.80);
  --flow-gradient-1:rgba(255,255,255,.78);
  --flow-gradient-2:rgba(255,180,102,.62);
  --flow-gradient-3:rgba(255,124,116,.36);
  --flow-gradient-4:rgba(255,216,158,.52);
  --flow-ambient-layer:radial-gradient(circle at 74% 34%,rgba(255,181,95,.48),transparent 31%),repeating-linear-gradient(0deg,rgba(255,255,255,.24) 0 1px,transparent 1px 30px),linear-gradient(120deg,rgba(255,255,255,.42),transparent 28%,rgba(251,146,60,.28) 52%,rgba(244,114,182,.18) 72%,transparent);
  --flow-symbol-layer:linear-gradient(180deg,transparent 0 30%,rgba(255,185,122,.28) 42%,transparent 54%,rgba(244,114,182,.18) 68%,transparent 82%),repeating-linear-gradient(0deg,rgba(255,255,255,.18) 0 1px,transparent 1px 36px),radial-gradient(circle at 24% 20%,rgba(255,255,255,.82) 0 1px,transparent 2px),radial-gradient(circle at 76% 24%,rgba(251,146,60,.52) 0 2px,transparent 4px),radial-gradient(circle at 62% 78%,rgba(244,114,182,.36) 0 2px,transparent 4px);
  --flow-highlight-layer:linear-gradient(90deg,transparent 4%,rgba(255,255,255,.40) 28%,rgba(255,180,113,.28) 50%,transparent 82%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.42),transparent 32%,rgba(251,146,60,.22) 62%,transparent 82%);
  --flow-opacity-bg:.90;
  --flow-opacity-symbol:.42;
  --flow-blur-bg:10px;
  --flow-speed-bg:18s;
  --flow-speed-symbol:24s;
}
html.theme-mint,.page-container.theme-mint,#app.theme-mint{
  --card-bg:rgba(255,255,255,.80);
  --flow-gradient-1:rgba(255,255,255,.88);
  --flow-gradient-2:rgba(147,241,222,.60);
  --flow-gradient-3:rgba(45,212,191,.34);
  --flow-gradient-4:rgba(218,252,245,.56);
  --flow-ambient-layer:radial-gradient(ellipse at 20% 20%,rgba(255,255,255,.62),transparent 26%),radial-gradient(ellipse at 78% 24%,rgba(145,236,218,.42),transparent 32%),linear-gradient(116deg,rgba(255,255,255,.52),transparent 27%,rgba(45,212,191,.24) 55%,transparent 78%);
  --flow-symbol-layer:radial-gradient(circle at 18% 26%,rgba(255,255,255,.66) 0 5px,rgba(45,212,191,.22) 6px 8px,transparent 11px),radial-gradient(circle at 34% 72%,rgba(255,255,255,.56) 0 6px,rgba(45,212,191,.18) 7px 9px,transparent 13px),radial-gradient(circle at 72% 22%,rgba(255,255,255,.62) 0 4px,rgba(45,212,191,.18) 5px 7px,transparent 10px),radial-gradient(circle at 82% 68%,rgba(255,255,255,.54) 0 7px,rgba(45,212,191,.16) 8px 10px,transparent 14px),radial-gradient(circle at 52% 46%,rgba(255,255,255,.46) 0 4px,transparent 9px),radial-gradient(circle at 12% 80%,rgba(45,212,191,.18) 0 5px,transparent 11px);
  --flow-highlight-layer:linear-gradient(120deg,transparent 8%,rgba(255,255,255,.42) 31%,transparent 48%,rgba(45,212,191,.20) 70%,transparent 86%);
  --flow-card-shine:linear-gradient(122deg,rgba(255,255,255,.44),transparent 32%,rgba(45,212,191,.21) 62%,transparent 82%);
  --flow-opacity-bg:.88;
  --flow-opacity-symbol:.42;
  --flow-blur-bg:10px;
  --flow-speed-bg:18s;
  --flow-speed-symbol:26s;
}
.page-container.theme-diamond::after{
  animation:keylineDiamondFlowVisible var(--flow-speed-symbol) ease-in-out infinite alternate;
}

@keyframes keylineFlowBackgroundVisible{
  0%{
    transform:translate3d(-2.5%,-1.5%,0) scale(1) rotate(.001deg);
    background-position:0 0,12% 18%,82% 12%,18% 88%,90% 78%;
  }
  50%{
    transform:translate3d(2.5%,1.8%,0) scale(1.055) rotate(.001deg);
    background-position:44% 60%,30% 8%,68% 34%,8% 72%,82% 58%;
  }
  100%{
    transform:translate3d(1%,-2.5%,0) scale(1.03) rotate(.001deg);
    background-position:100% 100%,18% 78%,92% 24%,42% 70%,58% 92%;
  }
}
@keyframes keylineFlowSymbolsVisible{
  0%{
    transform:translate3d(0,0,0) rotate(.001deg);
    background-position:0 0,60px 80px,-40px 120px,120px -60px,0 0;
  }
  50%{
    transform:translate3d(1.4%,-1.8%,0) rotate(.001deg);
    background-position:100px 140px,120px 30px,60px 190px,20px 80px,-90px 120px;
  }
  100%{
    transform:translate3d(2.8%,-3.6%,0) rotate(.001deg);
    background-position:210px 280px,180px -40px,130px 250px,-80px 170px,-180px 240px;
  }
}
@keyframes keylineDiamondFlowVisible{
  0%{
    transform:translate3d(-1.2%,.6%,0) rotate(.001deg);
    background-position:-40% 0,0 0,70px 80px,-60px 120px,140px -50px,0 0,0 0;
    filter:saturate(1.15) brightness(.98);
  }
  50%{
    transform:translate3d(1.4%,-1.2%,0) rotate(.001deg);
    background-position:45% 0,120px 160px,140px 20px,40px 180px,20px 80px,-80px 120px,80px -60px;
    filter:saturate(1.18) brightness(1.18);
  }
  100%{
    transform:translate3d(2.4%,-2.8%,0) rotate(.001deg);
    background-position:120% 0,240px 320px,220px -80px,120px 240px,-80px 160px,-180px 240px,160px -120px;
    filter:saturate(1.15) brightness(1.02);
  }
}
@media(max-width:480px){
  .page-container::before{
    inset:-22%;
    filter:blur(8px) saturate(1.10);
  }
  .page-container::after{inset:-10%;}
}
@media(prefers-reduced-motion:reduce){
  .page-container::before,
  .page-container::after,
  .dashboard-card,
  .calendar-panel,
  .settings-panel,
  .today-action-row,
  .festival-hero,
  .primary-btn,
  .theme-btn,
  .view-btn.active,
  .category-pill.active,
  .category-pill-active,
  .schedule-mode-active,
  .save-btn,
  .subitem-add-btn,
  .backup-main-btn,
  .restore-btn{
    animation:none!important;
  }
}

/* v1.7.18 + v1.7.19 mobile background: no scroll gaps, continuous safe-area */
html.theme-cream,
html:has(#app.theme-cream),
#app.theme-cream{
  --app-bg:#fff6ec;
  --bg-start:#fffaf2;
  --bg-mid:#f5e8d4;
  --bg-end:#f0dfc9;
  --mobile-statusbar-bg:#fffaf2;
}
html.theme-pink,
html:has(#app.theme-pink),
#app.theme-pink{
  --app-bg:#fff0f5;
  --bg-start:#fff1f5;
  --bg-mid:#ffe8f0;
  --bg-end:#ffd6e3;
  --mobile-statusbar-bg:#fff1f5;
}
html.theme-blue,
html:has(#app.theme-blue),
#app.theme-blue{
  --app-bg:#eef8ff;
  --bg-start:#eef5ff;
  --bg-mid:#dceeff;
  --bg-end:#d9e8ff;
  --mobile-statusbar-bg:#eef5ff;
}
html.theme-purple,
html:has(#app.theme-purple),
#app.theme-purple{
  --app-bg:#f6efff;
  --bg-start:#f4f0ff;
  --bg-mid:#e8deff;
  --bg-end:#ddd2ff;
  --mobile-statusbar-bg:#f4f0ff;
}
html.theme-forest,
html:has(#app.theme-forest),
#app.theme-forest{
  --app-bg:#eff8ef;
  --bg-start:#f2faf4;
  --bg-mid:#d8eedc;
  --bg-end:#d4ead8;
  --mobile-statusbar-bg:#f2faf4;
}
html.theme-diamond,
html:has(#app.theme-diamond),
#app.theme-diamond{
  --app-bg:#f7f9fb;
  --bg-start:#f8fbff;
  --bg-mid:#eef4fb;
  --bg-end:#e3ebf5;
  --mobile-statusbar-bg:#f8fbff;
}
html.theme-sunset,
html:has(#app.theme-sunset),
#app.theme-sunset{
  --app-bg:#ffe1d2;
  --bg-start:#fff3ec;
  --bg-mid:#ffd8c6;
  --bg-end:#ffb19a;
  --mobile-statusbar-bg:#fff3ec;
}
html.theme-mint,
html:has(#app.theme-mint),
#app.theme-mint{
  --app-bg:#effff9;
  --bg-start:#f2fffb;
  --bg-mid:#d4f7eb;
  --bg-end:#c9f7ea;
  --mobile-statusbar-bg:#f2fffb;
}

html{
  min-height:100%;
  min-height:100dvh;
  background-color:var(--bg-start,var(--app-bg,#fff6ec));
}
body{
  margin:0;
  min-height:100%;
  min-height:100dvh;
  background-color:var(--bg-start,var(--app-bg,#fff6ec))!important;
  background-image:linear-gradient(180deg,var(--bg-start,#fff7ef) 0%,var(--bg-mid,var(--bg-end,#ffd8c6)) 48%,var(--bg-end,#ffb19a) 100%)!important;
  background-attachment:fixed!important;
  background-repeat:no-repeat!important;
  background-size:100% 100%!important;
  overscroll-behavior-y:none;
}

body::before,
body::after{
  content:none!important;
  display:none!important;
}

/* v1.7.20 mobile touch + safe-area: page-container flow bg, scrollable content */
@media (max-width:899px){
  html,
  body{
    width:100%;
    min-height:100%;
    min-height:100dvh;
    height:auto!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:none;
    touch-action:auto;
    background-color:var(--app-bg,#fff6ec)!important;
    background-image:linear-gradient(180deg,var(--bg-start,#fff7ef) 0%,var(--bg-mid,#ffd8c6) 48%,var(--bg-end,#ffb19a) 100%)!important;
    background-attachment:fixed!important;
    background-repeat:no-repeat!important;
    background-size:100% 100%!important;
  }
  .page-container::before,
  .page-container::after{
    content:""!important;
    position:fixed!important;
    pointer-events:none!important;
    user-select:none!important;
    -webkit-user-select:none!important;
    touch-action:none!important;
    display:block!important;
    transform:translate3d(0,0,0);
  }
  .page-container::before{
    inset:-28%!important;
    z-index:0!important;
    background:
      var(--flow-ambient-layer),
      radial-gradient(circle at 16% 18%,var(--flow-gradient-1),transparent 32%),
      radial-gradient(circle at 84% 14%,var(--flow-gradient-2),transparent 34%),
      radial-gradient(circle at 18% 88%,var(--flow-gradient-3),transparent 36%),
      radial-gradient(circle at 90% 78%,var(--flow-gradient-4),transparent 34%)!important;
    background-size:180% 180%,145% 145%,150% 150%,150% 150%,155% 155%!important;
    background-position:0 0,12% 18%,82% 12%,18% 88%,90% 78%!important;
    filter:blur(var(--flow-blur-bg,10px)) saturate(1.12);
    opacity:var(--flow-opacity-bg,.88);
    animation:keylineFlowBackgroundVisible var(--flow-speed-bg,18s) ease-in-out infinite alternate;
    will-change:transform,background-position;
  }
  .page-container::after{
    inset:-18%!important;
    z-index:1!important;
    background:var(--flow-symbol-layer),var(--flow-highlight-layer)!important;
    background-size:var(--flow-symbol-size,420px 420px,380px 380px,360px 360px,340px 340px,130% 130%),var(--flow-highlight-size,140% 140%)!important;
    background-position:0 0,60px 80px,-40px 120px,120px -60px,0 0!important;
    opacity:var(--flow-opacity-symbol,.36);
    filter:saturate(1.12) brightness(1.04);
    mix-blend-mode:screen;
    animation:keylineFlowSymbolsVisible var(--flow-speed-symbol,26s) linear infinite;
    will-change:transform,background-position,opacity;
  }
  .page-container,
  #app.page-container{
    isolation:auto!important;
    min-height:100vh;
    min-height:100dvh;
    min-height:-webkit-fill-available;
    height:auto!important;
    overflow-x:hidden!important;
    overflow-y:visible!important;
    background:transparent!important;
    position:relative!important;
  }
  .main-view,
  .content,
  .tab-panel,
  .tab-panel.active,
  .list-container,
  .header,
  .desktop-shell,
  .desktop-layout{
    position:relative;
    z-index:2;
    pointer-events:auto!important;
    touch-action:auto!important;
    background:transparent!important;
  }
  .main-view{
    min-height:100dvh;
    min-height:-webkit-fill-available;
    height:auto!important;
    overflow:visible!important;
  }
  .list-container{
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    background:transparent!important;
  }
  .schedule-container{
    background-color:var(--card-bg)!important;
    background-image:var(--flow-card-shine,var(--theme-card-texture,none))!important;
  }
  .mask.hidden,
  .detail-overlay.hidden{
    display:none!important;
    pointer-events:none!important;
  }
}

@media (max-width:899px) and (prefers-reduced-motion:reduce){
  .page-container::before,
  .page-container::after{
    animation:none!important;
  }
}

@supports (-webkit-touch-callout:none){
  html,
  body{
    background-color:var(--app-bg,#fff6ec)!important;
    background-image:linear-gradient(180deg,var(--bg-start,#fff7ef) 0%,var(--bg-mid,#ffd8c6) 48%,var(--bg-end,#ffb19a) 100%)!important;
    background-attachment:fixed!important;
  }
  .page-container,
  .main-view{
    min-height:-webkit-fill-available;
  }
}

/* v1.8.0 IELTS fullscreen static theme + missing word polish */
.ielts-translation-fullscreen.ielts-themed-fullscreen{
  color:var(--text-main);
  background:#fff !important;
  background-color:#fff !important;
  background-image:none !important;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.ielts-translation-fullscreen:fullscreen,
.ielts-translation-fullscreen:-webkit-full-screen{
  background:#fff !important;
  background-color:#fff !important;
  background-image:none !important;
}
.ielts-translation-fullscreen::backdrop{
  background:#fff !important;
}
.ielts-translation-fullscreen.ielts-themed-fullscreen::before,
.ielts-translation-fullscreen.ielts-themed-fullscreen::after{
  content:none !important;
  display:none !important;
  animation:none !important;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__topbar{
  background:rgba(255,255,255,.58);
  border:1px solid rgba(255,255,255,.52);
  backdrop-filter:blur(12px) saturate(1.1);
  -webkit-backdrop-filter:blur(12px) saturate(1.1);
  color:var(--text-main);
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__exit,
.ielts-themed-fullscreen .ielts-translation-fullscreen__next,
.ielts-themed-fullscreen .ielts-translation-fullscreen__reset,
.ielts-themed-fullscreen .ielts-translation-fullscreen__nav{
  background:rgba(255,255,255,.62);
  border:1px solid var(--theme-line);
  box-shadow:none;
  color:var(--text-main);
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__check{
  background:var(--primary-gradient,linear-gradient(135deg,var(--primary),var(--primary)));
  color:var(--primary-text,#fff);
  border:1px solid rgba(255,255,255,.45);
  box-shadow:none;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__prompt,
.ielts-themed-fullscreen .ielts-translation-fullscreen__word{
  color:var(--text-main);
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word-text{
  display:block;
  min-height:1.15em;
  font-size:clamp(24px,4vw,56px);
  line-height:1.05;
  font-weight:900;
  text-align:center;
  color:var(--text-main);
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__answer textarea,
.ielts-themed-fullscreen textarea,
.ielts-themed-fullscreen input{
  color:var(--text-main);
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word-line{
  display:block !important;
  width:100%;
  height:3px !important;
  min-height:3px !important;
  border-radius:999px;
  background:rgba(55,65,81,.34) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.65);
  opacity:1 !important;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--active .ielts-translation-fullscreen__word-line{
  height:4px !important;
  background:var(--primary-color,var(--primary,#0ea5e9)) !important;
  box-shadow:0 0 0 3px rgba(14,165,233,.12);
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--correct .ielts-translation-fullscreen__word-text{
  color:#047857;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--wrong .ielts-translation-fullscreen__word-text{
  color:#dc2626;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--missing .ielts-translation-fullscreen__word-text{
  color:#b77900;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--correct .ielts-translation-fullscreen__word-line{
  background:#10b981 !important;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--wrong .ielts-translation-fullscreen__word-line{
  background:#ef4444 !important;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--missing .ielts-translation-fullscreen__word-line{
  background:#f59e0b !important;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--correct{
  color:#047857;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--wrong{
  color:#dc2626;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--missing{
  color:#b77900;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--missing .ielts-translation-fullscreen__word-hint,
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--missing .ielts-translation-fullscreen__word-correction,
.ielts-themed-fullscreen .ielts-translation-fullscreen__word--missing .ielts-translation-fullscreen__word-expected{
  display:none !important;
}
@media (max-width:899px){
  .ielts-translation-fullscreen.ielts-themed-fullscreen{
    background-attachment:scroll !important;
  }
  .ielts-translation-fullscreen.ielts-themed-fullscreen *,
  .ielts-translation-fullscreen.ielts-themed-fullscreen::before,
  .ielts-translation-fullscreen.ielts-themed-fullscreen::after{
    animation-duration:0s !important;
  }
}

/* v1.8.1 product UI unification */
.page-hero,
.module-hero,
.dashboard-hero,
.header-top.page-hero,
.settings-header.page-hero{
  border-radius:32px;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(255,255,255,.62);
  box-shadow:0 18px 48px rgba(15,23,42,.08);
  backdrop-filter:blur(18px) saturate(1.15);
  -webkit-backdrop-filter:blur(18px) saturate(1.15);
  padding:26px 28px;
}
.page-hero h1,
.page-hero .header-title,
.module-hero h1,
.module-hero h2,
.dashboard-hero h1,
.dashboard-hero h2,
.translation-hero.page-hero h2{
  font-size:clamp(32px,5vw,56px);
  line-height:1.02;
  letter-spacing:-.045em;
  color:var(--text-main);
  font-weight:950;
}
.page-hero p,
.page-hero .header-subtitle,
.module-hero p,
.dashboard-hero p,
.translation-hero.page-hero p{
  color:var(--text-muted,var(--text-sub));
  font-weight:750;
}
.page-hero-action,
.settings-btn.page-hero-action{
  border-radius:20px;
  background:rgba(255,255,255,.72);
  border:1px solid var(--theme-line,rgba(255,255,255,.58));
  color:var(--text-main);
  font-weight:900;
  box-shadow:0 10px 24px rgba(15,23,42,.08);
  white-space:nowrap;
}
.today-action-row,
.module-action-row,
.quick-action-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:stretch;
  padding:10px;
  border-radius:30px;
  background:rgba(255,255,255,.48);
  border:1px solid rgba(255,255,255,.58);
  box-shadow:0 14px 36px rgba(15,23,42,.08);
  backdrop-filter:blur(16px) saturate(1.12);
  -webkit-backdrop-filter:blur(16px) saturate(1.12);
}
.today-pill,
.current-date-pill,
.module-status-pill,
.today-action-row .compact-today-card{
  border-radius:24px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(255,255,255,.56);
  padding:16px 20px;
  color:var(--text-main);
  box-shadow:none;
}
.primary-btn,
.add-btn,
.module-primary-btn,
.quick-add-btn{
  border-radius:24px;
  background:var(--primary-gradient,linear-gradient(135deg,var(--primary),var(--primary)));
  color:var(--primary-text,#fff);
  font-weight:900;
  white-space:nowrap;
  box-shadow:0 16px 34px var(--theme-glow,rgba(15,23,42,.16));
}
.stats-grid,
.summary-grid,
.metric-grid,
.subscription-hero.stats-grid,
.grades-hero.stats-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.stat-card,
.summary-card,
.metric-card,
.subscription-hero > .stat-card,
.grades-hero > .stat-card,
.festival-hero,
.translation-library-card.stat-card,
.ielts-progress-card.stat-card{
  border-radius:28px;
  padding:22px;
  background:rgba(255,255,255,.58);
  border:1px solid rgba(255,255,255,.60);
  box-shadow:0 14px 36px rgba(15,23,42,.07);
  backdrop-filter:blur(16px) saturate(1.12);
  -webkit-backdrop-filter:blur(16px) saturate(1.12);
}
.stat-card .label,
.summary-card .label,
.metric-card .label,
.subscription-hero span.label,
.subscription-hero > .stat-card > span:first-child,
.grades-hero > .stat-card > span.label,
.subscription-hero span:not(.label):not(.value),
.subscription-hero > .stat-card > span:first-child{
  color:var(--text-muted,var(--text-sub));
  font-size:13px;
  font-weight:850;
  display:block;
}
.stat-card .value,
.summary-card .value,
.metric-card .value,
.subscription-hero b.value,
.subscription-hero > .stat-card > b,
.grades-hero > .stat-card > b.value{
  color:var(--text-main);
  font-size:clamp(28px,4vw,42px);
  font-weight:950;
  letter-spacing:-.035em;
  display:block;
  line-height:1.05;
  margin-top:8px;
}
.stat-card em,
.summary-card em,
.metric-card em,
.subscription-hero em,
.grades-hero em{
  display:block;
  margin-top:6px;
  color:var(--text-muted,var(--text-sub));
  font-size:12px;
  font-weight:800;
  font-style:normal;
}
.item-card,
.count-card,
.checklist-card,
.subscription-card,
.grade-course-card,
.grade-table-card,
.ielts-card,
.ielts-listening-card,
.ielts-pro-card,
.festival-card,
.translation-library-card:not(.stat-card){
  border-radius:28px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(255,255,255,.58);
  box-shadow:0 16px 38px rgba(15,23,42,.08);
  backdrop-filter:blur(16px) saturate(1.12);
  -webkit-backdrop-filter:blur(16px) saturate(1.12);
  color:var(--text-main);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.item-card:active,
.count-card:active,
.checklist-card:active,
.subscription-card:active,
.grade-course-card:active,
.festival-card:active,
.ielts-card:active{
  transform:scale(.985);
}
.empty-state{
  border-radius:32px;
  padding:34px 24px;
  text-align:center;
  background:rgba(255,255,255,.48);
  border:1px solid rgba(255,255,255,.58);
  box-shadow:0 14px 38px rgba(15,23,42,.07);
  backdrop-filter:blur(16px) saturate(1.12);
  -webkit-backdrop-filter:blur(16px) saturate(1.12);
  color:var(--text-main);
}
.empty-state-icon,
.empty-state .empty-illustration{
  width:58px;
  height:58px;
  margin:0 auto 14px;
  border-radius:22px;
  display:grid;
  place-items:center;
  background:var(--primary-gradient,linear-gradient(135deg,var(--primary),var(--primary)));
  color:var(--primary-text,#fff);
  font-size:24px;
  box-shadow:0 12px 28px var(--theme-glow,rgba(15,23,42,.12));
}
.empty-state h3,
.empty-state .empty-title{
  font-size:22px;
  font-weight:950;
  margin:0 0 8px;
  display:block;
  color:var(--text-main);
}
.empty-state p,
.empty-state .empty-desc{
  color:var(--text-muted,var(--text-sub));
  font-weight:750;
  margin:0;
  display:block;
  line-height:1.5;
}
.empty-state .empty-add-btn{
  margin-top:18px;
  width:auto;
  min-width:168px;
  padding:0 22px;
  flex:none;
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__topbar{
  border-radius:22px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(255,255,255,.64);
  box-shadow:0 10px 28px rgba(15,23,42,.08);
}
.ielts-themed-fullscreen .ielts-translation-fullscreen__prompt{
  max-width:980px;
  margin:28px auto 26px;
  line-height:1.34;
  letter-spacing:-.03em;
  padding:22px 26px;
  border-radius:28px;
  background:rgba(255,255,255,.52);
  border:1px solid rgba(255,255,255,.58);
  box-shadow:0 12px 32px rgba(15,23,42,.06);
}
.translation-hero.page-hero{
  margin-bottom:14px;
}
.translation-hero.page-hero .ielts-kicker{
  color:var(--text-muted,var(--text-sub));
  font-weight:850;
}
@media (max-width:640px){
  .today-action-row,
  .module-action-row,
  .quick-action-row{
    grid-template-columns:1fr;
  }
  .primary-btn,
  .add-btn,
  .module-primary-btn,
  .quick-add-btn{
    width:100%;
  }
  .page-hero,
  .module-hero,
  .dashboard-hero,
  .header-top.page-hero{
    padding:20px 18px;
    border-radius:26px;
  }
  .header-title-row{
    padding-right:88px;
  }
  .stats-grid,
  .summary-grid,
  .metric-grid{
    grid-template-columns:1fr;
  }
  .subscription-hero.stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:420px){
  .subscription-hero.stats-grid{
    grid-template-columns:1fr;
  }
}

/* v1.8.2 subscription next-charge readable contrast */
#subscriptionList > .subscription-next-card,
.subscription-next-card,
.subscription-upcoming-card,
.subscription-hero-card{
  color:var(--text-main)!important;
  background:rgba(255,255,255,.68)!important;
  border:1px solid rgba(255,255,255,.62)!important;
  backdrop-filter:blur(16px) saturate(1.12);
  -webkit-backdrop-filter:blur(16px) saturate(1.12);
}
.subscription-next-card *,
.subscription-upcoming-card *,
.subscription-hero-card *{
  color:inherit;
}
.subscription-next-card span,
.subscription-next-card em,
.subscription-upcoming-card .muted,
.subscription-upcoming-card .subtext,
.subscription-upcoming-card .caption,
.subscription-upcoming-card small{
  color:var(--text-muted,var(--text-sub))!important;
  opacity:1!important;
}
.subscription-next-card b,
.subscription-next-card strong,
.subscription-next-card .days-left,
.subscription-next-card .next-days,
.subscription-next-card .countdown-text,
.subscription-upcoming-card .days-left,
.subscription-upcoming-card .next-days{
  color:var(--text-main)!important;
}
.subscription-next-card.soon strong,
.subscription-next-card.today strong,
.subscription-next-card.overdue strong{
  color:#dc2626!important;
}

/* Teacher reviews */
.teacher-review-page{
  display:grid;
  gap:14px;
}
.teacher-review-hero.stats-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.teacher-review-hero > .stat-card{
  padding:18px;
}
.teacher-review-filter{
  margin:14px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.teacher-review-filter label{
  color:var(--text-muted,var(--text-sub));
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}
.teacher-review-filter .row-select{
  max-width:220px;
  margin-left:0;
  font-weight:900;
}
.teacher-semester-list{
  display:grid;
  gap:16px;
}
.teacher-semester-card{
  padding:0;
  margin:0;
  border-radius:28px;
  background:rgba(255,255,255,.64);
  border:1px solid rgba(255,255,255,.58);
  box-shadow:0 12px 32px rgba(15,23,42,.07);
  color:var(--text-main);
  overflow:hidden;
}
.teacher-semester-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:20px 22px 16px;
}
.teacher-semester-title{
  margin:0;
  color:var(--text-main);
  font-size:22px;
  line-height:1.15;
  font-weight:950;
}
.teacher-semester-meta{
  margin:7px 0 0;
  color:var(--text-muted,var(--text-sub));
  font-size:13px;
  font-weight:850;
}
.teacher-semester-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:6px 11px;
  border-radius:999px;
  background:var(--tag-bg);
  color:var(--text-main);
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.teacher-review-table{
  margin:0 16px 0;
  border-radius:20px;
  overflow:hidden;
  border:1px solid var(--theme-line,rgba(15,23,42,.10));
  background:rgba(255,255,255,.42);
}
.teacher-review-table-head,
.teacher-review-row{
  display:grid;
  grid-template-columns:minmax(180px,1.4fr) minmax(120px,.9fr) minmax(90px,.6fr) minmax(220px,1.7fr);
  gap:12px;
  align-items:center;
}
.teacher-review-table-head{
  min-height:42px;
  padding:0 16px;
  background:rgba(255,255,255,.58);
  color:var(--text-muted,var(--text-sub));
  font-size:12px;
  font-weight:950;
}
.teacher-review-row{
  min-height:58px;
  padding:12px 16px;
  border-top:1px solid var(--theme-line,rgba(15,23,42,.08));
  cursor:pointer;
  transition:background-color .16s ease,transform .16s ease;
}
@media (hover:hover){
  .teacher-review-row:hover{
    background:rgba(255,255,255,.56);
  }
}
.teacher-review-row:active{
  transform:scale(.995);
}
.teacher-review-course{
  color:var(--text-main);
  font-size:14px;
  font-weight:950;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.teacher-review-teacher{
  color:var(--text-muted,var(--text-sub));
  font-size:13px;
  font-weight:880;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.teacher-review-grade,
.teacher-review-status{
  display:flex;
  align-items:center;
  min-width:0;
}
.teacher-grade-pill,
.teacher-pass-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  max-width:100%;
  min-width:58px;
  min-height:28px;
  padding:5px 10px;
  border-radius:999px;
  background:var(--primary-gradient,linear-gradient(135deg,var(--primary),var(--primary)));
  color:var(--primary-text,#fff);
  font-size:12px;
  font-weight:950;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.teacher-grade-pill.is-empty{
  background:var(--tag-bg);
  color:var(--text-muted,var(--text-sub));
}
.teacher-pass-pill.is-passed{
  color:#166534;
  background:rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.28);
}
.teacher-pass-pill.is-failed{
  color:#991b1b;
  background:rgba(239,68,68,.14);
  border:1px solid rgba(239,68,68,.28);
}
.teacher-review-comment{
  color:var(--text-main);
  font-size:13px;
  font-weight:760;
  line-height:1.45;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  overflow-wrap:anywhere;
}
.teacher-mobile-label{
  display:none;
  color:var(--text-muted,var(--text-sub));
  font-weight:900;
}
.teacher-semester-foot{
  padding:12px 22px 18px;
  color:var(--text-muted,var(--text-sub));
  font-size:12px;
  font-weight:820;
}
.teacher-review-empty.empty-state{
  margin-top:0;
}
.form-row-textarea{
  align-items:flex-start;
  padding:10px 0;
}
.form-row-textarea .row-label{
  padding-top:12px;
}
textarea.row-textarea{
  min-height:112px;
  line-height:1.5;
  text-align:left;
}
@media (max-width:640px){
  .teacher-review-hero.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .teacher-review-filter{align-items:flex-start;flex-direction:column}
  .teacher-review-filter .row-select{width:100%;max-width:none;text-align:left;direction:ltr}
  .teacher-semester-head{
    align-items:flex-start;
    flex-direction:column;
    padding:18px 18px 14px;
  }
  .teacher-semester-title{
    font-size:20px;
  }
  .teacher-semester-badge{
    min-height:28px;
  }
  .teacher-review-table{
    margin:0 12px;
    border-radius:18px;
  }
  .teacher-review-table-head{
    display:none;
  }
  .teacher-review-row{
    display:block;
    min-height:0;
    padding:14px;
  }
  .teacher-review-course{
    font-size:15px;
    margin-bottom:8px;
  }
  .teacher-review-teacher,
  .teacher-review-grade,
  .teacher-review-status,
  .teacher-review-comment{
    display:block;
    margin-top:6px;
    font-size:13px;
  }
  .teacher-review-grade .teacher-grade-pill,
  .teacher-review-status .teacher-pass-pill{
    vertical-align:middle;
  }
  .teacher-review-comment{
    -webkit-line-clamp:3;
  }
  .teacher-mobile-label{
    display:inline;
  }
  .teacher-semester-foot{
    padding:10px 18px 16px;
  }
}

/* v1.8.6 add page overlay fix */
#addPage.add-page{
  position:fixed!important;
  z-index:850!important;
  pointer-events:auto!important;
  touch-action:auto!important;
  background:var(--main-bg)!important;
  color:var(--text-main);
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
}
#addPage.add-page.hidden{
  display:none!important;
  pointer-events:none!important;
}
@media (max-width:899px){
  #addPage.add-page{
    left:0!important;
    right:0!important;
    top:0!important;
    bottom:0!important;
    width:100%!important;
    max-width:none!important;
    height:100dvh!important;
    min-height:100dvh!important;
    transform:none!important;
    border-radius:0!important;
    padding:0 20px!important;
    box-shadow:none!important;
    border:0!important;
    background:linear-gradient(180deg,var(--bg-start,#fff7ef) 0%,var(--bg-mid,#ffd8c6) 48%,var(--bg-end,#ffb19a) 100%)!important;
  }
  #addPage.add-page .add-nav{
    padding-top:max(56px,calc(env(safe-area-inset-top,0px) + 38px))!important;
    height:94px!important;
  }
}
@media (min-width:900px){
  #addPage.add-page{
    left:calc(50% + 137px)!important;
    top:50%!important;
    right:auto!important;
    bottom:auto!important;
    width:min(560px,calc(100vw - 340px))!important;
    max-width:560px!important;
    max-height:86vh!important;
    height:auto!important;
    min-height:0!important;
    transform:translate(-50%,-50%)!important;
    border-radius:30px!important;
    padding:0 22px!important;
    background:var(--main-bg)!important;
    border:1px solid rgba(255,255,255,.72)!important;
    box-shadow:0 28px 90px rgba(15,23,42,.22)!important;
    overflow-y:auto!important;
  }
  #addPage.add-page .add-nav{
    padding-top:22px!important;
    height:70px!important;
  }
  #addPage.add-page .save-btn{
    margin-bottom:24px!important;
  }
}
@media (min-width:900px) and (max-width:1050px){
  #addPage.add-page{
    left:calc(50% + 118px)!important;
    width:min(540px,calc(100vw - 288px))!important;
  }
}

/* v1.9.4: motion polish */
:root{
  --ease-smooth:cubic-bezier(.22,1,.36,1);
  --ease-spring:cubic-bezier(.16,1.35,.32,1);
  --ease-pop:cubic-bezier(.34,1.56,.64,1);
  --motion-fast:120ms;
  --motion-normal:220ms;
  --motion-slow:360ms;
  --press-scale:.965;
  --hover-lift:-2px;
  --card-lift:-4px;
  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:20px;
  --radius-xl:28px;
  --shadow-soft:0 10px 30px rgba(31,41,55,.10);
  --shadow-lift:0 18px 45px rgba(31,41,55,.14);
  --accent:var(--primary,#7c5cff);
  --kd-ease-out:cubic-bezier(.16,1,.3,1);
  --kd-ease-spring:var(--ease-spring);
  --kd-ease-soft:var(--ease-smooth);
  --kd-ease:var(--ease-smooth);
  --kd-press-scale:var(--press-scale);
  --kd-hover-lift:translateY(-1px);
  --kd-card-lift:var(--card-lift);
  --kd-dur-fast:120ms;
  --kd-dur-base:180ms;
  --kd-dur-slow:260ms;
  --kd-motion-fast:var(--kd-dur-fast);
  --kd-motion-mid:var(--kd-dur-base);
  --kd-motion-slow:var(--kd-dur-slow);
}

html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}

body{
  touch-action:manipulation;
  overscroll-behavior:none;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

:focus-visible{
  outline:3px solid color-mix(in srgb, var(--primary) 35%, transparent);
  outline-offset:3px;
}

button,
[role="button"],
.primary-btn,
.secondary-btn,
.save-btn,
.category-pill,
.schedule-mode-btn,
.calendar-day,
.count-card,
.checklist-card,
.festival-card,
.timeline-card,
.settings-card,
.settings-item,
.subscription-card,
.grade-course-card,
.translation-library-card,
.translation-practice-card{
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  user-select:none;
  cursor:pointer;
}

button,
.primary-btn,
.secondary-btn,
.save-btn,
.category-pill,
.schedule-mode-btn,
.calendar-nav-btn,
.theme-btn,
.switch-tab-btn{
  min-height:36px;
}

.primary-btn,
.secondary-btn,
.save-btn,
.category-pill,
.schedule-mode-btn,
.calendar-nav-btn,
.theme-btn,
.switch-tab-btn,
.count-card,
.checklist-card,
.festival-card,
.timeline-card,
.settings-card,
.settings-item,
.subscription-card,
.subscription-summary-card,
.subscription-next-card,
.grade-course-card,
.translation-library-card,
.translation-practice-card,
.calendar-detail-item{
  transform:translateZ(0);
  backface-visibility:hidden;
  transition:
    transform var(--kd-motion-mid) var(--kd-ease-spring),
    box-shadow var(--kd-motion-mid) var(--kd-ease-soft),
    border-color var(--kd-motion-mid) var(--kd-ease-soft),
    background var(--kd-motion-mid) var(--kd-ease-soft),
    opacity var(--kd-motion-fast) ease;
}

.kd-pressed,
.primary-btn:active,
.secondary-btn:active,
.save-btn:active,
.category-pill:active,
.schedule-mode-btn:active,
.calendar-nav-btn:active,
.theme-btn:active,
.switch-tab-btn:active,
.settings-btn:active,
.settings-item:active,
.count-card:active,
.checklist-card:active,
.festival-card:active,
.timeline-card:active,
.settings-card:active,
.subscription-card:active,
.grade-course-card:active,
.translation-library-card:active,
.translation-practice-card:active,
.calendar-detail-item:active{
  transform:scale(var(--kd-press-scale)) translateZ(0)!important;
  opacity:.94;
}

@media(hover:hover){
  .count-card:hover,
  .checklist-card:hover,
  .festival-card:hover,
  .timeline-card:hover,
  .settings-card:hover,
  .settings-item:hover,
  .subscription-card:hover,
  .grade-course-card:hover,
  .translation-library-card:hover,
  .translation-practice-card:hover,
  .calendar-detail-item:hover{
    transform:translateY(var(--kd-card-lift)) translateZ(0);
  }

  .primary-btn:hover,
  .secondary-btn:hover,
  .save-btn:hover,
  .category-pill:hover,
  .schedule-mode-btn:hover,
  .calendar-nav-btn:hover,
  .theme-btn:hover,
  .switch-tab-btn:hover{
    transform:translateY(-1px) translateZ(0);
  }
}

.kd-ripple-host{
  position:relative;
  overflow:hidden;
  contain:paint;
}

.kd-touch-pulse{
  position:absolute;
  z-index:0;
  pointer-events:none;
  border-radius:999px;
  background:currentColor;
  opacity:.14;
  transform:scale(.15);
  animation:kdTouchPulse .52s var(--kd-ease-soft) forwards;
}

@keyframes kdTouchPulse{
  0%{opacity:.16;transform:scale(.15);}
  58%{opacity:.10;}
  100%{opacity:0;transform:scale(1);}
}

.tab-panel.active{
  animation:kdPanelIn .28s var(--kd-ease-soft) both;
}

@keyframes kdPanelIn{
  from{opacity:0;transform:translateY(8px) scale(.992);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

.list-container > *,
.timeline-container > *,
.calendar-panel,
.schedule-container,
.dashboard-card{
  animation:kdItemIn .34s var(--kd-ease-soft) both;
}

.list-container > *:nth-child(1){animation-delay:20ms;}
.list-container > *:nth-child(2){animation-delay:45ms;}
.list-container > *:nth-child(3){animation-delay:70ms;}
.list-container > *:nth-child(4){animation-delay:95ms;}
.list-container > *:nth-child(5){animation-delay:120ms;}
.list-container > *:nth-child(n+6){animation-delay:145ms;}

@keyframes kdItemIn{
  from{opacity:0;transform:translateY(10px) scale(.985);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

.mask,
.detail-overlay,
.add-page,
.cloud-menu-mask,
.cloud-login-mask,
.cloud-login-prompt-mask{
  animation:kdFadeIn .22s ease both;
}

@keyframes kdFadeIn{
  from{opacity:0;}
  to{opacity:1;}
}

.detail-card,
.form-card,
.settings-panel,
.cloud-menu-panel,
.cloud-login-card,
.cloud-login-prompt,
.modal-card{
  animation:kdSheetIn .28s var(--kd-ease-spring) both;
  transform-origin:50% 100%;
}

@keyframes kdSheetIn{
  from{opacity:0;transform:translateY(18px) scale(.975);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

.cloud-toast,
.toast,
.cloud-login-toast{
  animation:kdToastIn .24s var(--kd-ease-soft) both;
}

@keyframes kdToastIn{
  from{opacity:0;transform:translateY(8px) scale(.98);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

input,
textarea,
select,
.subitem-input,
.draft-subitem{
  transition:
    box-shadow var(--kd-motion-mid) var(--kd-ease-soft),
    border-color var(--kd-motion-mid) var(--kd-ease-soft),
    background var(--kd-motion-mid) var(--kd-ease-soft),
    transform var(--kd-motion-fast) ease;
}

input:focus,
textarea:focus,
select:focus,
.subitem-input:focus,
.draft-subitem:focus{
  outline:none;
  transform:translateY(-1px);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--primary) 16%, transparent)!important;
}

.year-progress-inner,
.progress-inner,
.checklist-progress-inner{
  transition:width .55s var(--kd-ease-soft), transform .55s var(--kd-ease-soft);
}

.checked,
.check-dot-done,
.calendar-day.today{
  animation:kdPop .24s var(--kd-ease-spring) both;
}

@keyframes kdPop{
  0%{transform:scale(.84);}
  70%{transform:scale(1.08);}
  100%{transform:scale(1);}
}

.emoji-item:active,
.add-icon-box:active{
  animation:kdPop .24s var(--kd-ease-spring) both;
}

.list-container,
.category-scroll,
.content,
.calendar-detail-body,
.ielts-translation-fullscreen__main,
#addPage.add-page{
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
}

.list-container,
.category-scroll,
.calendar-detail-body{
  overscroll-behavior:contain;
}

.page-container::before,
.page-container::after{
  will-change:transform,opacity;
}

@media(max-width:560px){
  .primary-btn,
  .secondary-btn,
  .save-btn,
  .category-pill,
  .schedule-mode-btn,
  .calendar-nav-btn,
  .theme-btn,
  .switch-tab-btn{
    min-height:40px;
  }

  .count-card,
  .checklist-card,
  .festival-card,
  .timeline-card,
  .settings-card,
  .settings-item,
  .subscription-card,
  .grade-course-card,
  .translation-library-card,
  .translation-practice-card{
    transition-duration:190ms;
  }
}

@media(prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.001ms!important;
  }

  .page-container::before,
  .page-container::after{
    animation:none!important;
  }
}

.emoji-icon-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  min-height:40px;
  padding:0;
  font-size:20px;
  line-height:1;
  border-radius:999px;
  -webkit-tap-highlight-color:transparent;
}

.emoji-icon-btn:active,
.emoji-icon-btn.kd-pressed{
  transform:scale(.94) translateZ(0)!important;
}

.vertical-switch-icon{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0;
  min-width:40px;
  min-height:40px;
  padding:0;
  line-height:1;
  font-size:17px;
}

.vertical-switch-icon span{
  display:block;
  height:12px;
  line-height:12px;
  transform:translateY(0);
}

.vertical-switch-icon span:first-child{
  margin-bottom:-2px;
}

.vertical-switch-icon span:last-child{
  margin-top:-2px;
}

@media(max-width:560px){
  .emoji-icon-btn{
    min-width:42px;
    min-height:42px;
    font-size:21px;
  }

  .vertical-switch-icon{
    min-width:42px;
    min-height:42px;
    font-size:18px;
  }
}

/* Module render diagnostics — never show a silent blank panel */
.module-render-error{
  margin:12px 0 24px;
  padding:22px 20px;
  border-radius:24px;
  background:rgba(255,240,240,.92);
  border:1px solid rgba(220,38,38,.22);
  color:#7f1d1d;
  box-shadow:0 12px 30px rgba(127,29,29,.08);
}
.module-render-error b{
  display:block;
  font-size:17px;
  font-weight:900;
  margin-bottom:8px;
  color:#991b1b;
}
.module-render-error p{
  margin:0 0 12px;
  font-size:14px;
  line-height:1.55;
  font-weight:700;
  color:#b42318;
}
.module-render-error-detail{
  margin:0 0 14px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.72);
  font-size:11px;
  line-height:1.45;
  white-space:pre-wrap;
  word-break:break-word;
  color:#7f1d1d;
  max-height:160px;
  overflow:auto;
}
.module-retry-btn{
  width:auto !important;
  min-width:148px;
  height:40px !important;
  padding:0 18px !important;
  font-size:14px !important;
}
.tab-panel:not(.active){
  display:none !important;
}
.tab-panel.active{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  min-height:0 !important;
}
.list-container{
  min-height:48px;
}

/* v1.9.4: unified motion system — Q弹 iOS-style polish */
.primary-btn,
.secondary-btn,
.save-btn,
.category-pill,
.schedule-mode-btn,
.calendar-nav-btn,
.theme-btn,
.switch-tab-btn,
.backup-main-btn,
.restore-btn,
.backup-copy-btn,
.clear-data-btn,
.tab-picker-item,
.emoji-item,
.desktop-nav-item,
.module-retry-btn,
.subitem-add-btn,
.draft-subitem-delete,
.cloud-menu-panel button,
.settings-btn{
  transition:
    transform var(--motion-fast) var(--ease-smooth),
    box-shadow var(--motion-normal) var(--ease-smooth),
    background-color var(--motion-normal) var(--ease-smooth),
    border-color var(--motion-normal) var(--ease-smooth),
    color var(--motion-normal) var(--ease-smooth),
    opacity var(--motion-normal) var(--ease-smooth);
}

@media (hover:hover){
  .primary-btn:not(:disabled):hover,
  .secondary-btn:not(:disabled):hover,
  .save-btn:not(:disabled):hover,
  .category-pill:not(:disabled):hover,
  .schedule-mode-btn:not(:disabled):hover,
  .calendar-nav-btn:not(:disabled):hover,
  .theme-btn:not(:disabled):hover,
  .switch-tab-btn:not(:disabled):hover,
  .desktop-nav-item:not(:disabled):hover,
  .tab-picker-item:not(.tab-picker-active):hover{
    transform:translateY(var(--hover-lift));
  }
}

button:not(:disabled):active,
.primary-btn:not(:disabled):active,
.secondary-btn:not(:disabled):active,
.save-btn:not(:disabled):active,
.category-pill:not(:disabled):active,
.schedule-mode-btn:not(:disabled):active,
.calendar-nav-btn:not(:disabled):active,
.theme-btn:not(:disabled):active,
.switch-tab-btn:not(:disabled):active,
.desktop-nav-item:not(:disabled):active{
  transform:scale(var(--press-scale));
  transition-duration:80ms;
}

button:focus-visible,
.primary-btn:focus-visible,
.secondary-btn:focus-visible,
.icon-btn:focus-visible,
.tab-btn:focus-visible,
.desktop-nav-item:focus-visible,
.category-pill:focus-visible{
  outline:none;
  box-shadow:
    0 0 0 3px rgba(124,92,255,.22),
    0 8px 24px rgba(0,0,0,.08);
}

@supports (color:color-mix(in srgb, white, black)){
  button:focus-visible,
  .primary-btn:focus-visible,
  .secondary-btn:focus-visible,
  .desktop-nav-item:focus-visible,
  .category-pill:focus-visible{
    box-shadow:
      0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent),
      0 8px 24px rgba(0,0,0,.08);
  }
}

.card,
.count-card,
.checklist-card,
.festival-card,
.timeline-card,
.settings-card,
.dashboard-card,
.panel-card,
.subscription-card,
.grade-course-card,
.translation-library-card,
.translation-practice-card{
  transition:
    transform var(--motion-normal) var(--ease-smooth),
    box-shadow var(--motion-normal) var(--ease-smooth),
    border-color var(--motion-normal) var(--ease-smooth),
    background-color var(--motion-normal) var(--ease-smooth);
}

@media (hover:hover){
  .card:hover,
  .count-card:hover,
  .checklist-card:hover,
  .festival-card:hover,
  .timeline-card:hover,
  .settings-card:hover,
  .panel-card:hover,
  .subscription-card:hover,
  .grade-course-card:hover,
  .translation-library-card:hover,
  .translation-practice-card:hover{
    transform:translateY(var(--card-lift));
    box-shadow:var(--shadow-lift);
  }
}

.item-enter,
.card-enter,
.route-enter,
.kd-item-enter{
  animation:kd-pop-in var(--motion-slow) var(--ease-pop) both;
}

@keyframes kd-pop-in{
  from{opacity:0;transform:translateY(8px) scale(.975);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

.item-leave,
.kd-item-leave{
  transition:
    height var(--motion-normal) var(--ease-smooth),
    margin var(--motion-normal) var(--ease-smooth),
    padding var(--motion-normal) var(--ease-smooth),
    opacity var(--motion-normal) var(--ease-smooth),
    transform var(--motion-normal) var(--ease-smooth);
}

.kd-shimmer::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
  transform:translateX(-100%);
  animation:kd-shimmer-slide 1.2s infinite;
  pointer-events:none;
}

@keyframes kd-shimmer-slide{
  to{transform:translateX(100%);}
}

.kd-loading-surface{
  position:relative;
  overflow:hidden;
}

.kd-map-fade-in{
  animation:kd-map-fade-in var(--motion-normal) var(--ease-smooth) both;
}

@keyframes kd-map-fade-in{
  from{opacity:0;transform:scale(.992);}
  to{opacity:1;transform:scale(1);}
}

@keyframes kd-slide-up-in{
  from{opacity:0;transform:translateY(12px);}
  to{opacity:1;transform:translateY(0);}
}

.kd-will-animate{
  will-change:transform,opacity;
}

.tab-panel-animate{
  animation:kd-panel-in var(--motion-normal) var(--ease-smooth) both;
}

@keyframes kd-panel-in{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}

.desktop-nav-item.desktop-nav-active{
  transform:translateY(-2px) scale(1.035);
  transition:transform var(--motion-normal) var(--ease-pop);
}

.mask:not(.hidden),
.detail-overlay:not(.hidden),
.cloud-menu-mask:not(.hidden){
  opacity:0;
  transition:opacity var(--kd-dur-base) var(--kd-ease-out);
}

.mask.is-open:not(.hidden),
.detail-overlay.is-open:not(.hidden),
.cloud-menu-mask.is-open:not(.hidden){
  opacity:1;
}

.tab-picker-panel,
.backup-panel,
.emoji-panel,
.settings-panel,
.board-manager-panel,
.cloud-menu-panel,
.cloud-login-prompt,
.detail-card{
  opacity:0;
  transform:translateY(8px) scale(.985);
  transition:
    opacity var(--kd-dur-base) var(--kd-ease-out),
    transform var(--kd-dur-base) var(--kd-ease-out);
}

.tab-picker-panel.is-open,
.backup-panel.is-open,
.emoji-panel.is-open,
.settings-panel.is-open,
.board-manager-panel.is-open,
.cloud-menu-panel.is-open,
.cloud-login-prompt.is-open,
.detail-card.is-open,
.mask:not(.hidden) .tab-picker-panel,
.mask:not(.hidden) .backup-panel,
.mask:not(.hidden) .emoji-panel,
.mask:not(.hidden) .settings-panel,
.mask:not(.hidden) .board-manager-panel{
  opacity:1;
  transform:translateY(0) scale(1);
}

.cloud-login-prompt-mask:not(.is-closing) .cloud-login-prompt{
  opacity:1;
  transform:translateY(0) scale(1);
}

.mask.is-closing:not(.hidden),
.detail-overlay.is-closing:not(.hidden),
.cloud-menu-mask.is-closing:not(.hidden){
  opacity:0;
}

.tab-picker-panel.is-closing,
.backup-panel.is-closing,
.emoji-panel.is-closing,
.settings-panel.is-closing,
.board-manager-panel.is-closing,
.cloud-menu-panel.is-closing,
.cloud-login-prompt.is-closing,
.detail-card.is-closing{
  opacity:0;
  transform:translateY(8px) scale(.96);
  pointer-events:none;
}

.toast-root{
  position:fixed;
  left:50%;
  bottom:calc(28px + env(safe-area-inset-bottom));
  transform:translateX(-50%);
  z-index:10020;
  display:flex;
  flex-direction:column-reverse;
  align-items:center;
  gap:8px;
  pointer-events:none;
  max-width:min(92vw,420px);
}

.toast,
.cloud-toast{
  opacity:0;
  transform:translateY(10px) scale(.98);
  transition:
    opacity var(--motion-normal) var(--ease-smooth),
    transform var(--motion-normal) var(--ease-pop);
  position:relative;
  left:auto;
  bottom:auto;
  transform-origin:50% 100%;
  background:rgba(17,17,17,.92);
  color:#fff;
  border-radius:999px;
  padding:11px 16px;
  font-size:13px;
  font-weight:850;
  box-shadow:var(--shadow-soft);
  max-width:100%;
  text-align:center;
}

.toast.show,
.cloud-toast.show,
.toast.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}

.toast-success{background:rgba(22,101,52,.94);}
.toast-error{background:rgba(153,27,27,.94);}
.toast-info{background:rgba(17,17,17,.92);}

.input-error{
  animation:kd-shake 280ms var(--ease-smooth);
}

@keyframes kd-shake{
  0%,100%{transform:translateX(0);}
  25%{transform:translateX(-3px);}
  75%{transform:translateX(3px);}
}

.chip-row,
.tab-scroll,
.horizontal-scroll,
.category-scroll{
  scroll-snap-type:x proximity;
  scrollbar-width:none;
}

.chip-row::-webkit-scrollbar,
.tab-scroll::-webkit-scrollbar,
.horizontal-scroll::-webkit-scrollbar{
  display:none;
}

.scroll-area,
.panel-body,
.modal-body,
.sheet-body,
.list-container,
.content,
.calendar-detail-body{
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}

/* Prefer enter-on-demand over blanket list stagger (performance) */
.list-container > *:not(.item-enter):not(.tab-panel),
.timeline-container > *:not(.item-enter),
.calendar-panel:not(.item-enter),
.schedule-container:not(.item-enter),
.dashboard-card:not(.item-enter){
  animation:none!important;
}

.count-card,
.checklist-card,
.festival-card,
.timeline-card,
.settings-card,
.primary-btn,
.secondary-btn,
.save-btn,
.category-pill,
.schedule-mode-btn,
.calendar-nav-btn,
.theme-btn,
.switch-tab-btn{
  will-change:auto;
}

.kd-dragging,
.item-dragging{
  transform:translateY(-6px) scale(1.02)!important;
  box-shadow:var(--shadow-lift)!important;
  z-index:2;
  will-change:transform;
  transition:transform var(--motion-fast) var(--ease-pop), box-shadow var(--motion-fast) var(--ease-smooth)!important;
}

@media(prefers-reduced-motion:reduce){
  .kd-shimmer::after,
  .kd-loading-surface::after,
  .kd-map-fade-in,
  .kd-item-enter,
  .item-enter,
  .tab-panel-animate,
  .tab-panel.active{
    animation:none!important;
  }

  .kd-item-leave,
  .item-leave{
    transition:none!important;
  }
}

.board-manager-panel{
  overflow:auto;
  max-height:84dvh;
}
.board-manager-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.board-manager-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border-radius:12px;
  background:var(--card-bg,rgba(255,255,255,.06));
}
.board-manager-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:15px;
  font-weight:800;
  color:var(--text-main,#111);
}
.board-manager-toggle{
  flex:0 0 auto;
  color:#111;
  font-size:12px;
  font-weight:950;
  background:#fff;
  border-radius:999px;
  padding:7px 12px;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 8px 18px rgba(15,23,42,.05);
}

/* ===== Keyline motion polish (v2.1.3+) ===== */
.mask,
.detail-overlay,
.cloud-menu-mask,
.cloud-login-mask,
.cloud-login-prompt-mask{
  animation:none!important;
}

.tab-picker-panel,
.backup-panel,
.emoji-panel,
.settings-panel,
.board-manager-panel,
.cloud-menu-panel,
.cloud-login-prompt,
.detail-card,
.form-card{
  animation:none!important;
}

.board-manager-row,
.settings-item,
.tab-picker-item.kd-stagger-in{
  animation:kdItemIn var(--kd-dur-base) var(--kd-ease-out) both;
}

.tab-picker-item.kd-stagger-in:nth-child(1){animation-delay:20ms;}
.tab-picker-item.kd-stagger-in:nth-child(2){animation-delay:35ms;}
.tab-picker-item.kd-stagger-in:nth-child(3){animation-delay:50ms;}
.tab-picker-item.kd-stagger-in:nth-child(4){animation-delay:65ms;}
.tab-picker-item.kd-stagger-in:nth-child(5){animation-delay:80ms;}
.tab-picker-item.kd-stagger-in:nth-child(6){animation-delay:95ms;}
.tab-picker-item.kd-stagger-in:nth-child(7){animation-delay:110ms;}
.tab-picker-item.kd-stagger-in:nth-child(8){animation-delay:125ms;}

.kd-settings-page-in,
.settings-panel.kd-settings-page-in,
.board-manager-panel.kd-settings-page-in{
  animation:kdSettingsPageIn var(--kd-dur-slow) var(--kd-ease-out) both;
}

@keyframes kdSettingsPageIn{
  from{opacity:0;transform:translateX(8px);}
  to{opacity:1;transform:translateX(0);}
}

.kd-enter,
.tab-panel-animate{
  animation:kdFadeSlideIn var(--kd-dur-slow) var(--kd-ease-out) both;
}

@keyframes kdFadeSlideIn{
  from{opacity:0;transform:translateY(6px);}
  to{opacity:1;transform:translateY(0);}
}

.kd-removing{
  opacity:0!important;
  transform:translateY(-4px) scale(.98)!important;
  pointer-events:none!important;
  transition:
    opacity var(--kd-dur-base) var(--kd-ease-out),
    transform var(--kd-dur-base) var(--kd-ease-out);
}

.settings-close,
.backup-close{
  transform:none!important;
}

@media(hover:hover){
  .kd-no-lift:hover,
  .settings-close:hover,
  .backup-close:hover,
  .board-manager-toggle:hover,
  .cloud-sync-btn:hover,
  #cloudSyncBtn:hover{
    transform:none!important;
  }
}

@media(hover:hover){
  .primary-btn:not(:disabled):hover,
  .secondary-btn:not(:disabled):hover,
  .save-btn:not(:disabled):hover,
  .category-pill:not(:disabled):hover,
  .schedule-mode-btn:not(:disabled):hover,
  .calendar-nav-btn:not(:disabled):hover,
  .theme-btn:not(:disabled):hover,
  .switch-tab-btn:not(:disabled):hover,
  .desktop-nav-item:not(:disabled):hover,
  .tab-picker-item:not(.tab-picker-active):hover,
  .settings-item:hover{
    transform:var(--kd-hover-lift) translateZ(0);
  }
}

@media(hover:none){
  button:hover,
  [role="button"]:hover,
  .btn:hover,
  .icon-btn:hover,
  .settings-item:hover,
  .menu-item:hover,
  .primary-btn:hover,
  .secondary-btn:hover{
    transform:none;
  }

  button:active,
  [role="button"]:active,
  .btn:active,
  .icon-btn:active,
  .settings-item:active,
  .menu-item:active,
  .primary-btn:active,
  .secondary-btn:active{
    transform:scale(.985);
  }
}

button:disabled,
.btn:disabled,
.icon-btn:disabled,
[aria-disabled="true"]{
  transform:none!important;
  opacity:.55;
  cursor:not-allowed;
}

#cloudSyncBtn,
.cloud-sync-btn{
  min-width:88px;
  transition:
    opacity var(--kd-dur-base) var(--kd-ease-out),
    transform var(--kd-dur-fast) var(--kd-ease-out),
    background-color var(--kd-dur-base) var(--kd-ease-out),
    color var(--kd-dur-base) var(--kd-ease-out),
    box-shadow var(--kd-dur-base) var(--kd-ease-out);
}

.cloud-sync-btn.cloud-syncing,
.cloud-sync-btn.is-syncing,
#cloudSyncBtn.is-syncing{
  animation:kdSoftPulse 1.4s var(--kd-ease-soft) infinite;
}

@keyframes kdSoftPulse{
  0%,100%{opacity:1;}
  50%{opacity:.72;}
}

.calendar-day,
.date-cell,
.day-pill{
  transition:
    background-color var(--kd-dur-base) var(--kd-ease-out),
    color var(--kd-dur-base) var(--kd-ease-out),
    transform var(--kd-dur-fast) var(--kd-ease-out),
    box-shadow var(--kd-dur-base) var(--kd-ease-out);
}

@media(hover:hover){
  .calendar-day:hover,
  .date-cell:hover,
  .day-pill:hover{
    transform:translateY(-1px);
  }
}

.calendar-day.today,
.calendar-day.is-active,
.date-cell.is-active,
.day-pill.is-active{
  transform:translateY(-1px) scale(1.015);
}

.board-manager-list,
.settings-list,
.tab-picker-panel,
.board-manager-panel,
.backup-panel{
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

.kd-skeleton{
  position:relative;
  overflow:hidden;
  background:rgba(127,127,127,.12);
  border-radius:10px;
}

.kd-skeleton::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);
  animation:kdSkeleton 1.2s var(--kd-ease-soft) infinite;
}

@keyframes kdSkeleton{
  to{transform:translateX(100%);}
}

.cloud-sync-btn .sync-status-label,
#cloudSyncBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Mobile tab picker should feel like a modal, not a full-screen page. */
@media (max-width:760px){
  #tabPickerMask.mask{
    align-items:center!important;
    justify-content:center!important;
    padding:18px!important;
    box-sizing:border-box!important;
  }
  #tabPickerMask .tab-picker-panel{
    width:min(92vw,420px)!important;
    max-width:420px!important;
    height:auto!important;
    max-height:78vh!important;
    max-height:min(78dvh,640px)!important;
    border-radius:24px!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    box-sizing:border-box!important;
  }
}
@media (max-width:420px){
  #tabPickerMask.mask{
    padding:14px!important;
  }
  #tabPickerMask .tab-picker-panel{
    width:100%!important;
    max-height:76vh!important;
    max-height:76dvh!important;
    border-radius:22px!important;
  }
}

/* Current-section share image entry */
.share-current-tab-btn,
.mobile-share-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  width:38px;
  min-width:38px;
  height:38px;
  padding:0;
  border-radius:999px;
  background:rgba(255,255,255,.76);
  border:1px solid rgba(0,0,0,.06);
  color:var(--text-main);
  box-shadow:0 8px 24px rgba(16,24,40,.06);
  font-size:13px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
  flex-shrink:0;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,opacity .18s ease;
}

.share-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  color:currentColor;
  flex:0 0 auto;
}
.share-icon svg{
  display:block;
}

.share-current-tab-btn.is-generating{
  opacity:.72;
  pointer-events:none;
}

@media(hover:hover){
  .share-current-tab-btn:not(:disabled):hover{
    background:rgba(255,255,255,.9);
    border-color:rgba(0,0,0,.1);
    box-shadow:0 10px 26px rgba(16,24,40,.08);
    transform:none!important;
  }
}

.share-current-tab-btn:active{
  transform:scale(.985);
  opacity:.88;
}

.header-title-row,
.header-title-block{
  min-width:0;
}

.header-title-row .header-title{
  flex:0 0 auto;
  white-space:nowrap;
}

@media (min-width:900px){
  .share-current-tab-btn{
    width:38px;
    min-width:38px;
    height:38px;
    padding:0;
  }
}

/* Hand-drawn line icon system */
.kd-line-icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:1em!important;
  height:1em!important;
  min-width:1em!important;
  min-height:1em!important;
  flex:0 0 auto!important;
  color:inherit!important;
  line-height:1!important;
  vertical-align:-.16em!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
}
.kd-line-icon-svg{
  display:block!important;
  width:1em!important;
  height:1em!important;
  overflow:visible!important;
  color:inherit!important;
  filter:none!important;
  shape-rendering:geometricPrecision!important;
}
.kd-line-icon-svg *{
  vector-effect:non-scaling-stroke;
}
[data-kd-icon]>.kd-line-icon-svg{
  width:1em!important;
  height:1em!important;
}
.desktop-nav-item>.kd-line-icon,
.desktop-nav-item span .kd-line-icon,
.desktop-settings-entry span .kd-line-icon,
.tab-picker-icon .kd-line-icon,
.action-item span .kd-line-icon{
  background:transparent!important;
  border-radius:0!important;
  box-shadow:none!important;
  width:1em!important;
  height:1em!important;
  min-width:1em!important;
  min-height:1em!important;
  margin:0!important;
}
.desktop-nav-item>span[data-kd-icon],
.desktop-settings-entry>span[data-kd-icon]{
  color:inherit!important;
}
.desktop-nav-item>span[data-kd-icon]>.kd-line-icon-svg,
.desktop-settings-entry>span[data-kd-icon]>.kd-line-icon-svg{
  width:20px!important;
  height:20px!important;
}
.desktop-nav-active>span[data-kd-icon]>.kd-line-icon-svg,
.desktop-nav-active .kd-line-icon-svg{
  filter:none!important;
}
.settings-btn{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.settings-btn>.kd-line-icon-svg,
.settings-btn .kd-line-icon-svg{
  width:19px!important;
  height:19px!important;
}
.tab-picker-icon>.kd-line-icon-svg,
.tab-picker-icon .kd-line-icon-svg{
  width:21px!important;
  height:21px!important;
}
.settings-icon>.kd-line-icon-svg,
.settings-icon .kd-line-icon-svg{
  width:22px!important;
  height:22px!important;
}
.add-huge-icon{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:var(--text-main)!important;
}
.add-huge-icon>.kd-line-icon-svg,
.add-huge-icon .kd-line-icon-svg{
  width:.9em!important;
  height:.9em!important;
}
.emoji-item .kd-line-icon,
.emoji-choice-icon{
  font-size:31px!important;
}
.emoji-item .kd-line-icon-svg{
  width:1em!important;
  height:1em!important;
}
.count-icon,
.festival-icon,
.subscription-icon,
.calendar-detail-icon,
.empty-illustration,
.translation-icon,
.export-countdown-icon,
.export-festival-icon,
.cloud-login-icon{
  color:var(--text-main, currentColor);
}
.count-icon .kd-line-icon,
.festival-icon .kd-line-icon,
.subscription-icon .kd-line-icon,
.calendar-detail-icon .kd-line-icon,
.empty-illustration .kd-line-icon,
.translation-icon .kd-line-icon,
.export-countdown-icon .kd-line-icon,
.export-festival-icon .kd-line-icon,
.cloud-login-icon .kd-line-icon{
  font-size:1em!important;
}
.count-icon .kd-line-icon-svg,
.festival-icon .kd-line-icon-svg,
.subscription-icon .kd-line-icon-svg,
.calendar-detail-icon .kd-line-icon-svg,
.translation-icon .kd-line-icon-svg,
.export-countdown-icon .kd-line-icon-svg,
.export-festival-icon .kd-line-icon-svg,
.cloud-login-icon .kd-line-icon-svg{
  width:.92em!important;
  height:.92em!important;
}
.empty-illustration .kd-line-icon-svg{
  width:.82em!important;
  height:.82em!important;
}
.pin-icon .kd-line-icon-svg,
.detail-repeat-icon .kd-line-icon-svg{
  width:1em!important;
  height:1em!important;
}
.detail-repeat-icon{
  margin-right:3px!important;
  vertical-align:-.18em!important;
}
.detail-big-icon{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#fff!important;
}
.detail-big-icon>.kd-line-icon-svg,
.detail-big-icon .kd-line-icon-svg{
  width:.84em!important;
  height:.84em!important;
  filter:none!important;
}
.action-item>span[data-kd-icon]{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.action-item>span[data-kd-icon]>.kd-line-icon-svg{
  width:23px!important;
  height:23px!important;
}
.action-item.danger>span[data-kd-icon],
.action-item.danger .kd-line-icon{
  color:#ff3b30!important;
}
.desktop-brand::after{
  content:""!important;
  display:block!important;
  width:14px!important;
  height:14px!important;
  margin-left:auto!important;
  color:transparent!important;
  background:#f0aa43!important;
  clip-path:polygon(50% 0,61% 36%,100% 50%,61% 64%,50% 100%,39% 64%,0 50%,39% 36%)!important;
}
#app.theme-coral .desktop-brand::after{
  content:""!important;
  border-radius:50%!important;
  clip-path:none!important;
  background:#d84f38!important;
  box-shadow:0 0 0 4px rgba(216,79,56,.12)!important;
}
#app.theme-shanmiao .desktop-brand::after{
  content:""!important;
  background:#c9a45a!important;
  clip-path:polygon(50% 0,61% 36%,100% 50%,61% 64%,50% 100%,39% 64%,0 50%,39% 36%)!important;
}
/* Calendar — desktop day cells show item pills; mobile keeps dots */
.calendar-day-items{display:none}
@media (min-width:900px){
  .calendar-day{
    height:auto !important;
    min-height:92px !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    padding:7px 6px 8px !important;
    overflow:hidden;
  }
  .calendar-day-num{align-self:flex-start;line-height:1.2}
  .calendar-dot-row{display:none !important}
  .calendar-day-items{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin-top:6px;
    width:100%;
    min-width:0;
    flex:1;
    overflow:hidden;
  }
  .calendar-day-item{
    width:100%;
    box-sizing:border-box;
    border-radius:8px;
    padding:3px 6px;
    font-size:12px;
    line-height:1.25;
    font-weight:500;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    text-align:left;
  }
  .calendar-day-item.is-event{
    background:rgba(96,165,250,.16);
    border:1px solid rgba(96,165,250,.32);
    color:#2563eb;
  }
  .calendar-day-item.is-schedule{
    background:rgba(251,146,60,.16);
    border:1px solid rgba(251,146,60,.32);
    color:#ea580c;
  }
  .calendar-day-item.is-academic-holiday{
    background:rgba(34,197,94,.16);
    border:1px solid rgba(34,197,94,.34);
    color:#15803d;
    font-weight:700;
  }
  .calendar-day-item.is-more{
    background:rgba(17,24,39,.06);
    border:1px solid rgba(17,24,39,.1);
    color:#6b7280;
    font-weight:700;
  }
  .calendar-day.today{
    background:rgba(17,24,39,.08) !important;
    color:var(--text-main) !important;
    border-color:rgba(17,24,39,.14) !important;
    border-radius:11px !important;
    box-shadow:none !important;
    animation:none !important;
  }
  .calendar-day.today .calendar-day-num{
    background:transparent !important;
    color:inherit !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }
}

.calendar-panel .calendar-legend .calendar-dot.event-dot{
  background:#2563eb !important;
}
  .calendar-panel .calendar-legend .calendar-dot.schedule-dot{
  background:#ea580c !important;
}
.calendar-panel .calendar-legend .calendar-dot.academic-holiday-dot,
.academic-holiday-dot{
  background:#22c55e !important;
}
.calendar-day.today .academic-holiday-dot{
  background:#fff !important;
}
.calendar-detail-academic-holiday{
  background:rgba(34,197,94,.13) !important;
  border:1px solid rgba(34,197,94,.28) !important;
  color:#14532d !important;
}
.calendar-detail-academic-holiday .calendar-detail-icon{
  background:rgba(34,197,94,.18) !important;
  color:#15803d !important;
  font-size:17px !important;
  font-weight:950 !important;
}
.calendar-detail-academic-holiday .calendar-detail-info span{
  color:rgba(20,83,45,.72) !important;
}
.calendar-detail-academic-holiday .calendar-detail-badge{
  background:rgba(34,197,94,.18) !important;
  color:#15803d !important;
}

/* Overview — live EUR/CNY exchange rate card */
.overview-exchange-wrap{
  width:100%;
}
.overview-exchange-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:16px 18px;
  text-align:left;
}
.overview-exchange-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:2px;
}
.overview-exchange-sub{
  margin:0;
  font-size:13px;
  font-weight:700;
  color:var(--text-sub);
}
.overview-exchange-rate{
  margin:4px 0 0;
  font-size:24px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:-.02em;
  color:var(--text-main);
}
.overview-exchange-rate.is-loading{
  font-size:14px;
  font-weight:700;
  color:var(--text-sub);
}
.overview-exchange-updated{
  margin:0;
  font-size:12px;
  font-weight:700;
  color:var(--text-sub);
}
.overview-exchange-debug,
.overview-exchange-debug-raw{
  margin:2px 0 0;
  font-size:10px;
  font-weight:600;
  line-height:1.35;
  color:var(--text-sub);
  opacity:.85;
  word-break:break-all;
}
.overview-exchange-status{
  margin:2px 0 0;
  font-size:12px;
  font-weight:700;
}
.overview-exchange-status.is-loading{color:var(--text-sub)}
.overview-exchange-status.is-error{color:#b42318}
.overview-exchange-status.is-stale{color:#92400e}
.overview-exchange-refresh{
  flex-shrink:0;
  height:30px;
  padding:0 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  color:var(--text-main);
  background:rgba(255,255,255,.55);
  border:1px solid rgba(0,0,0,.08);
}
.overview-exchange-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
}
.overview-exchange-refresh:active{transform:scale(.98)}
.overview-exchange-refresh.is-busy{
  opacity:.72;
  cursor:wait;
}
@media(hover:hover){
  .overview-exchange-refresh:hover{background:rgba(255,255,255,.82)}
}

/* ===== 配套练习 ===== */
#grammarPracticePanel .list-container{
  --gp-accent:#1a4a63;
  --gp-accent-2:#2e7d9a;
  --gp-tint:#e7f2f6;
  --gp-tint-2:#d5e8ef;
  --gp-ink:#123040;
  --gp-muted:#5b7380;
  --gp-mark:#b9e3f2;
  --gp-page-ink:#172033;
  --gp-page-muted:#667085;
  --gp-line:rgba(16,24,40,.09);
  --gp-surface:rgba(255,255,255,.94);
  width:min(100%,1120px);
  margin-inline:auto;
  box-sizing:border-box;
  display:grid;
  gap:18px;
  padding:6px 4px 36px
}
#grammarPracticeList[data-gp-theme="ch1"],.gp-chapter-card[data-gp-theme="ch1"]{
  --gp-accent:#1f73b0;--gp-accent-2:#4aa3d8;--gp-tint:#e4f3fb;--gp-tint-2:#cfe8f6;--gp-ink:#143a58;--gp-muted:#4d6f86;--gp-mark:#9ed4f5
}
#grammarPracticeList[data-gp-theme="ch2"],.gp-chapter-card[data-gp-theme="ch2"]{
  --gp-accent:#c4452d;--gp-accent-2:#e06a4c;--gp-tint:#faece8;--gp-tint-2:#f3d5cc;--gp-ink:#5a2218;--gp-muted:#8a5a4e;--gp-mark:#f5c4b8
}
#grammarPracticeList[data-gp-theme="ch3"],.gp-chapter-card[data-gp-theme="ch3"]{
  --gp-accent:#5b3fa0;--gp-accent-2:#8a6ad0;--gp-tint:#f3eafc;--gp-tint-2:#e2d4f6;--gp-ink:#2f1d58;--gp-muted:#6d5b8a;--gp-mark:#d5c4f5
}
#grammarPracticeList[data-gp-theme="ch4"],.gp-chapter-card[data-gp-theme="ch4"]{
  --gp-accent:#1d7a58;--gp-accent-2:#3aaa78;--gp-tint:#e5f6ee;--gp-tint-2:#c8ead9;--gp-ink:#134832;--gp-muted:#4d7a66;--gp-mark:#b5e6cc
}
#grammarPracticeList[data-gp-theme="ch5"],.gp-chapter-card[data-gp-theme="ch5"]{
  --gp-accent:#b86a18;--gp-accent-2:#df9640;--gp-tint:#fff3e1;--gp-tint-2:#f8dfb9;--gp-ink:#5d350f;--gp-muted:#866343;--gp-mark:#f6d298
}
#grammarPracticeList[data-gp-theme="ch6"],.gp-chapter-card[data-gp-theme="ch6"]{
  --gp-accent:#ad3d68;--gp-accent-2:#d35d8a;--gp-tint:#fbeaf1;--gp-tint-2:#f3cedd;--gp-ink:#5a2037;--gp-muted:#86566a;--gp-mark:#efb9cf
}
#grammarPracticeList[data-gp-theme="ch7"],.gp-chapter-card[data-gp-theme="ch7"]{
  --gp-accent:#287080;--gp-accent-2:#4a9dad;--gp-tint:#e9f5f6;--gp-tint-2:#cde9ec;--gp-ink:#173e47;--gp-muted:#547780;--gp-mark:#afe0e5
}
#grammarPracticeList[data-gp-theme="ch8"],.gp-chapter-card[data-gp-theme="ch8"]{
  --gp-accent:#6f4b98;--gp-accent-2:#9670bd;--gp-tint:#f3edf9;--gp-tint-2:#e3d6f0;--gp-ink:#3c2853;--gp-muted:#716080;--gp-mark:#d8c3eb
}
#grammarPracticeList[data-gp-theme="ch9"],.gp-chapter-card[data-gp-theme="ch9"]{
  --gp-accent:#657b27;--gp-accent-2:#8fa640;--gp-tint:#f2f5e8;--gp-tint-2:#e0e8c8;--gp-ink:#344217;--gp-muted:#68734c;--gp-mark:#d4e3a7
}
#grammarPracticeList[data-gp-theme="ch10"],.gp-chapter-card[data-gp-theme="ch10"]{
  --gp-accent:#bd5b2f;--gp-accent-2:#dd7b49;--gp-tint:#fbede6;--gp-tint-2:#f3d7c7;--gp-ink:#5d2b18;--gp-muted:#865c49;--gp-mark:#efbea4
}
#grammarPracticeList[data-gp-theme="ch11"],.gp-chapter-card[data-gp-theme="ch11"]{
  --gp-accent:#296d86;--gp-accent-2:#4b96ae;--gp-tint:#e8f3f6;--gp-tint-2:#cfe5eb;--gp-ink:#183e4c;--gp-muted:#557681;--gp-mark:#addbe7
}
#grammarPracticeList[data-gp-theme="ch12"],.gp-chapter-card[data-gp-theme="ch12"]{
  --gp-accent:#a83e48;--gp-accent-2:#cf6570;--gp-tint:#faebed;--gp-tint-2:#f2d2d6;--gp-ink:#572128;--gp-muted:#825860;--gp-mark:#edb9bf
}
#grammarPracticeList[data-gp-theme="ch13"],.gp-chapter-card[data-gp-theme="ch13"]{
  --gp-accent:#4c6884;--gp-accent-2:#718da8;--gp-tint:#edf2f7;--gp-tint-2:#d9e3ed;--gp-ink:#293c50;--gp-muted:#607386;--gp-mark:#c5d7e8
}
#grammarPracticeList[data-gp-theme="ch14"],.gp-chapter-card[data-gp-theme="ch14"]{
  --gp-accent:#9e4777;--gp-accent-2:#c36b99;--gp-tint:#f8ebf2;--gp-tint-2:#efd2e1;--gp-ink:#54243e;--gp-muted:#805b70;--gp-mark:#e9b9d2
}
#grammarPracticeList[data-gp-theme="ch15"],.gp-chapter-card[data-gp-theme="ch15"]{
  --gp-accent:#287660;--gp-accent-2:#4aa087;--gp-tint:#e9f5f1;--gp-tint-2:#cfe8df;--gp-ink:#183f35;--gp-muted:#55786d;--gp-mark:#b6dfd2
}
#grammarPracticeList[data-gp-theme="ch16"],.gp-chapter-card[data-gp-theme="ch16"]{
  --gp-accent:#a76e12;--gp-accent-2:#cf9636;--gp-tint:#fbf2e2;--gp-tint-2:#f1dfbc;--gp-ink:#593a0b;--gp-muted:#816842;--gp-mark:#ead09a
}
#grammarPracticeList[data-gp-theme="ch17"],.gp-chapter-card[data-gp-theme="ch17"]{
  --gp-accent:#246a83;--gp-accent-2:#2d91b5;--gp-tint:#e5f3f8;--gp-tint-2:#cbe6ef;--gp-ink:#173f4f;--gp-muted:#53717e;--gp-mark:#aad9e8
}
#grammarPracticeList[data-gp-theme="ch18"],.gp-chapter-card[data-gp-theme="ch18"]{
  --gp-accent:#59447b;--gp-accent-2:#7c62a8;--gp-tint:#f0ecf7;--gp-tint-2:#ded4ed;--gp-ink:#352749;--gp-muted:#6b5d7b;--gp-mark:#cfbce7
}
#grammarPracticeList[data-gp-theme="ch19"],.gp-chapter-card[data-gp-theme="ch19"]{
  --gp-accent:#526b36;--gp-accent-2:#73964b;--gp-tint:#eef4e7;--gp-tint-2:#dbe8ce;--gp-ink:#304020;--gp-muted:#667355;--gp-mark:#c8dcae
}
#grammarPracticeList[data-gp-theme="ch20"],.gp-chapter-card[data-gp-theme="ch20"]{
  --gp-accent:#2b5787;--gp-accent-2:#3d77ba;--gp-tint:#e8f0f9;--gp-tint-2:#cedff1;--gp-ink:#1b3653;--gp-muted:#586f86;--gp-mark:#adcbea
}
#grammarPracticeList[data-gp-theme="ch21"],.gp-chapter-card[data-gp-theme="ch21"]{
  --gp-accent:#825027;--gp-accent-2:#ba7538;--gp-tint:#f8eee5;--gp-tint-2:#ecd7c4;--gp-ink:#4c3019;--gp-muted:#7b654f;--gp-mark:#e3bea0
}
#grammarPracticeList[data-gp-theme="ch22"],.gp-chapter-card[data-gp-theme="ch22"]{
  --gp-accent:#78384d;--gp-accent-2:#a8516c;--gp-tint:#f7eaf0;--gp-tint-2:#ebcfdb;--gp-ink:#47212e;--gp-muted:#765765;--gp-mark:#dfb4c5
}
#grammarPracticeList[data-gp-theme="ch23"],.gp-chapter-card[data-gp-theme="ch23"]{
  --gp-accent:#246563;--gp-accent-2:#348c8a;--gp-tint:#e7f4f3;--gp-tint-2:#cae7e5;--gp-ink:#173d3c;--gp-muted:#557573;--gp-mark:#aaddd9
}
#grammarPracticeList[data-gp-theme="ch24"],.gp-chapter-card[data-gp-theme="ch24"]{
  --gp-accent:#385a9d;--gp-accent-2:#577ed3;--gp-tint:#eaf0fb;--gp-tint-2:#d1ddf5;--gp-ink:#223761;--gp-muted:#5d6f91;--gp-mark:#b5c9f0
}
#grammarPracticeList[data-gp-theme="ch25"],.gp-chapter-card[data-gp-theme="ch25"]{
  --gp-accent:#a9562a;--gp-accent-2:#e27c42;--gp-tint:#fcefe7;--gp-tint-2:#f2d7c5;--gp-ink:#603319;--gp-muted:#84634f;--gp-mark:#edbea2
}
#grammarPracticeList[data-gp-theme="ch26"],.gp-chapter-card[data-gp-theme="ch26"]{
  --gp-accent:#32654e;--gp-accent-2:#4b9272;--gp-tint:#e8f4ee;--gp-tint-2:#cce6d9;--gp-ink:#1f3e31;--gp-muted:#597568;--gp-mark:#afd9c5
}
#grammarPracticeList[data-gp-theme="ch27"],.gp-chapter-card[data-gp-theme="ch27"]{
  --gp-accent:#684780;--gp-accent-2:#9568b7;--gp-tint:#f3ecf8;--gp-tint-2:#e3d4ee;--gp-ink:#3e2a4d;--gp-muted:#725e80;--gp-mark:#d5bbe7
}
#grammarPracticeList[data-gp-theme="ch28"],.gp-chapter-card[data-gp-theme="ch28"]{
  --gp-accent:#286483;--gp-accent-2:#3c8fbe;--gp-tint:#e8f4fa;--gp-tint-2:#cce5f1;--gp-ink:#183d51;--gp-muted:#567485;--gp-mark:#add9ec
}
#grammarPracticeList[data-gp-theme="ch29"],.gp-chapter-card[data-gp-theme="ch29"]{
  --gp-accent:#8c4052;--gp-accent-2:#c45d74;--gp-tint:#f9eaf0;--gp-tint-2:#efd0da;--gp-ink:#522632;--gp-muted:#7e5964;--gp-mark:#e6b4c3
}
#grammarPracticeList[data-gp-theme="ch30"],.gp-chapter-card[data-gp-theme="ch30"]{
  --gp-accent:#2b6c65;--gp-accent-2:#3f9a90;--gp-tint:#e7f4f2;--gp-tint-2:#c9e7e3;--gp-ink:#19423e;--gp-muted:#587772;--gp-mark:#a9dcd5
}
#grammarPracticeList[data-gp-theme="a1"],.gp-chapter-card[data-gp-theme="a1"]{
  --gp-accent:#946721;--gp-accent-2:#d09432;--gp-tint:#fbf2e2;--gp-tint-2:#f0dfbd;--gp-ink:#563d15;--gp-muted:#7e6948;--gp-mark:#e7cf9b
}
.gp-hero{
  position:relative;
  overflow:hidden;
  padding:28px 30px;
  border-radius:20px;
  background:var(--gp-surface);
  border:1px solid var(--gp-line);
  box-shadow:0 10px 30px rgba(16,24,40,.055)
}
.gp-hero::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:5px;
  background:linear-gradient(180deg,var(--gp-accent),var(--gp-accent-2))
}
.gp-hero-compact{padding:22px 26px}
.gp-kicker{
  display:inline-flex;
  margin-bottom:10px;
  padding:5px 10px;
  border-radius:8px;
  background:color-mix(in srgb,var(--gp-accent) 9%,#fff);
  color:var(--gp-accent);
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em
}
.gp-hero h2{margin:0 0 7px;font-size:26px;line-height:1.25;font-weight:800;letter-spacing:-.025em;color:var(--gp-page-ink)}
.gp-hero p{margin:0;color:var(--gp-page-muted);font-size:14px;line-height:1.65;font-weight:600}
.gp-note{margin-top:8px!important;font-size:13px!important;color:var(--gp-page-muted)!important;font-weight:550!important}
.gp-hero small{display:inline-flex;margin-top:12px;padding:5px 9px;border-radius:8px;background:#f6f7f9;color:var(--gp-page-muted);font-size:12px;font-weight:650}
.gp-toolbar{display:flex;align-items:center}
.gp-back{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:38px;
  padding:0 14px;
  border-radius:11px;
  background:rgba(255,255,255,.88);
  border:1px solid var(--gp-line);
  box-shadow:0 4px 12px rgba(16,24,40,.04);
  color:var(--gp-page-ink);
  font-size:12px;
  font-weight:750
}
.gp-back::before{content:"←";color:var(--gp-accent);font-size:15px}
.gp-chapter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.gp-chapter-card,.gp-exercise-card{
  position:relative;
  display:grid;
  gap:7px;
  min-height:118px;
  box-sizing:border-box;
  text-align:left;
  padding:18px;
  border-radius:17px;
  background:var(--gp-surface);
  border:1px solid var(--gp-line);
  box-shadow:0 7px 22px rgba(16,24,40,.045);
  cursor:pointer
}
.gp-chapter-card{align-content:start;min-height:142px;padding-right:110px}
.gp-chapter-card::after,.gp-exercise-card::after{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  border-radius:17px 17px 0 0;
  background:linear-gradient(90deg,var(--gp-accent,#344054),var(--gp-accent-2,#667085));
  opacity:.8
}
.gp-chapter-card b,.gp-exercise-card b{font-size:17px;line-height:1.35;font-weight:800;color:var(--gp-page-ink)}
.gp-chapter-card em,.gp-exercise-card span{color:var(--gp-page-muted);font-size:12px;font-weight:550;font-style:normal;line-height:1.55}
.gp-chapter-card small,.gp-exercise-card small{align-self:end;color:var(--gp-accent,#344054);font-size:12px;font-weight:700}
.gp-chapter-num{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--gp-accent,#344054) 9%,#fff);border:1px solid color-mix(in srgb,var(--gp-accent,#344054) 13%,transparent);color:var(--gp-accent,#344054);font-size:11px;font-weight:800}
.gp-chapter-progress{
  position:absolute;
  top:50%;
  right:18px;
  width:78px;
  height:78px;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border-radius:50%;
  background:color-mix(in srgb,var(--gp-accent,#344054) 2.5%,#fff);
  box-shadow:0 7px 18px rgba(16,24,40,.045);
  pointer-events:none
}
.gp-chapter-progress::before{
  content:"";
  position:absolute;
  inset:-5px;
  border:1px solid color-mix(in srgb,var(--gp-accent,#344054) 9%,transparent);
  border-radius:50%
}
.gp-chapter-progress-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);fill:none}
.gp-chapter-progress-track{stroke:#e5eaf2;stroke-width:2.4}
.gp-chapter-progress-value{
  stroke:var(--gp-accent,#344054);
  stroke-width:3.2;
  stroke-linecap:round;
  animation:gp-progress-draw .65s cubic-bezier(.2,.75,.25,1) both
}
.gp-chapter-progress-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;font-variant-numeric:tabular-nums}
.gp-chapter-progress-copy strong{color:var(--gp-page-ink);font-size:21px;font-weight:720;letter-spacing:-.05em}
.gp-chapter-progress-copy strong i{margin-left:1px;color:var(--gp-page-muted);font-size:10px;font-weight:700;font-style:normal;letter-spacing:0}
.gp-chapter-progress-copy>span{margin-top:5px;color:var(--gp-page-muted);font-size:9px;font-weight:650;letter-spacing:.08em}
.gp-chapter-card.is-locked{opacity:.48;cursor:not-allowed;box-shadow:none}
.gp-exercise-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.gp-section-title{grid-column:1/-1;margin:14px 0 0;padding:0 2px 9px;border-bottom:1px solid var(--gp-line);color:var(--gp-page-ink);font-size:14px;font-weight:800;letter-spacing:.01em}
.gp-legend,.gp-example{padding:17px 19px;border-radius:16px;background:rgba(255,255,255,.82);border:1px solid var(--gp-line)}
.gp-legend b{display:block;margin-bottom:10px;font-size:13px;font-weight:750;color:var(--gp-page-ink)}
.gp-legend ul{display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0;list-style:none}
.gp-legend li{padding:6px 9px;border-radius:8px;background:color-mix(in srgb,var(--gp-accent) 7%,#fff);border:1px solid color-mix(in srgb,var(--gp-accent) 11%,transparent);color:var(--gp-page-ink);font-size:12px;font-weight:600}
.gp-example b{display:block;margin-bottom:6px;color:var(--gp-accent);font-size:12px;font-weight:800}
.gp-example p{margin:0 0 5px;font-size:16px;font-weight:700;color:var(--gp-page-ink)}
.gp-example span{color:var(--gp-page-muted);font-size:13px;line-height:1.6;font-weight:550}
.gp-items{display:grid;gap:12px}
.gp-item{padding:18px 20px;border-radius:17px;background:var(--gp-surface);border:1px solid var(--gp-line);box-shadow:0 7px 22px rgba(16,24,40,.045)}
.gp-item-head{display:flex;align-items:center}
.gp-item-head b{display:inline-flex;min-width:31px;height:27px;align-items:center;justify-content:center;border-radius:9px;background:color-mix(in srgb,var(--gp-accent) 9%,#fff);border:1px solid color-mix(in srgb,var(--gp-accent) 12%,transparent);color:var(--gp-accent);font-size:11px;font-weight:800}
.gp-sentence{margin:12px 0 14px;font-size:17px;line-height:1.65;font-weight:700;letter-spacing:-.01em;color:var(--gp-page-ink)}
.gp-sentence-fill{display:flex;flex-wrap:wrap;align-items:center;gap:7px}
.gp-mark{padding:1px 4px;border-radius:5px;background:color-mix(in srgb,var(--gp-accent) 15%,#fff);color:var(--gp-page-ink);font-weight:800}
.gp-prompt{margin:10px 0 0;color:var(--gp-page-muted);font-size:13px;font-weight:600}
.gp-answer-row{display:flex;flex-wrap:wrap;align-items:center;gap:9px}
.gp-input{
  min-width:min(220px,100%);
  flex:1;
  height:46px;
  box-sizing:border-box;
  padding:0 14px;
  border-radius:11px;
  border:1px solid #d7dce5;
  background:#fbfcfd;
  color:var(--gp-page-ink);
  font-size:14px;
  font-weight:600;
  appearance:none
}
.gp-input::placeholder{color:#98a2b3;font-weight:500;opacity:1}
.gp-input-inline{min-width:96px;width:auto;flex:0 1 180px;height:38px;margin:0 3px;padding-inline:11px}
.gp-textarea{min-height:88px;height:auto;padding:12px 14px;resize:vertical;line-height:1.55}
.gp-item-rewrite .gp-prompt,.gp-item-rewrite .gp-sentence{margin:13px 0 11px;color:var(--gp-page-ink);font-size:20px;line-height:1.5;font-weight:750;letter-spacing:-.018em}
.gp-answer-row-rewrite{align-items:center}
.gp-input-rewrite{min-width:min(280px,100%);width:auto;flex:1;height:46px}
.gp-input:focus,.gp-input:focus-visible{outline:none!important;border-color:color-mix(in srgb,var(--gp-accent) 70%,#fff);background:#fff;transform:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--gp-accent) 12%,transparent)!important}
.gp-check{
  height:46px;
  min-width:76px;
  padding:0 17px;
  border:0;
  border-radius:11px;
  background:var(--gp-accent);
  box-shadow:0 6px 14px color-mix(in srgb,var(--gp-accent) 18%,transparent);
  color:#fff;
  font-size:13px;
  font-weight:750
}
.gp-check-block{margin-top:12px}
.gp-result{display:inline-flex;align-items:center;min-height:28px;padding:0 9px;border-radius:8px;font-size:12px;font-weight:750;color:var(--gp-page-muted)}
.gp-result:empty{display:none}
.gp-result em{margin-left:7px;font-style:normal;font-weight:600}
.gp-result.is-ok{background:#ecf8f1;color:#18734b}
.gp-result.is-bad{background:#fff1f1;color:#b93838}
.gp-finish{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-top:6px;
  padding:20px 22px;
  overflow:hidden;
  border-radius:17px;
  background:var(--gp-surface);
  border:1px solid var(--gp-line);
  box-shadow:0 9px 24px rgba(16,24,40,.055);
  overflow-anchor:auto
}
.gp-finish::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--gp-accent),var(--gp-accent-2));opacity:.85}
.gp-finish-copy{display:grid;gap:5px;min-width:0}
.gp-finish-copy b{color:var(--gp-page-ink);font-size:17px;line-height:1.35;font-weight:800}
.gp-finish-copy span{color:var(--gp-page-muted);font-size:14px;line-height:1.5;font-weight:600;font-variant-numeric:tabular-nums}
.gp-finish-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:0 0 auto}
.gp-check-all{min-width:132px;font-size:14px}
.gp-check-all:disabled{cursor:default;background:#25815c;box-shadow:none;opacity:1}
.gp-finish .gp-bottom-back{min-height:46px;padding:0 17px;font-size:14px;background:#fff}
.gp-parts{display:grid;gap:10px}
.gp-part{display:grid;grid-template-columns:minmax(120px,160px) minmax(0,1fr);gap:8px;align-items:center}
.gp-part span{font-size:13px;font-weight:700;color:var(--gp-page-ink)}
.gp-part i{color:var(--gp-page-muted);font-style:normal;font-weight:550}
.gp-part .gp-result{grid-column:1/-1;justify-self:start}
.gp-choices{display:grid;gap:8px;margin-bottom:12px}
.gp-choices-bank{grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:10px}
.gp-choice{display:flex;align-items:center;gap:9px;min-height:44px;padding:8px 12px;border-radius:11px;background:#fbfcfd;border:1px solid #e2e6ec;font-weight:600;color:var(--gp-page-ink);cursor:pointer}
.gp-choice input{width:17px;height:17px;flex:0 0 auto;accent-color:var(--gp-accent)}
.gp-choice:has(:checked){border-color:color-mix(in srgb,var(--gp-accent) 45%,#fff);background:color-mix(in srgb,var(--gp-accent) 6%,#fff);box-shadow:0 0 0 2px color-mix(in srgb,var(--gp-accent) 8%,transparent)}
.gp-choice b{min-width:22px;color:var(--gp-accent)}
.gp-choice span{min-width:0;line-height:1.4;overflow-wrap:anywhere}
.gp-choice-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:2px 0 14px}
.gp-choice-group{min-width:0;padding:13px;border:1px solid color-mix(in srgb,var(--gp-accent) 13%,#e2e6ec);border-radius:13px;background:color-mix(in srgb,var(--gp-accent) 2.5%,#fff)}
.gp-choice-group-label{display:block;margin:0 0 9px;color:var(--gp-page-muted);font-size:14px;line-height:1.4;font-weight:750}
.gp-choice-group .gp-choices,.gp-choice-group .gp-select-wrap{margin-bottom:0}
.gp-item-choice-rewrite .gp-prompt{margin-bottom:14px}
.gp-select-wrap{display:grid;gap:8px;max-width:460px;margin:0 0 13px}
.gp-select-wrap>span{font-size:14px;font-weight:700;color:var(--gp-page-muted)}
.gp-select{width:100%;height:46px;padding:0 42px 0 14px;border:1px solid #d7dce5;border-radius:11px;background:#fbfcfd;color:var(--gp-page-ink);font:inherit;font-weight:650;cursor:pointer}
.gp-select:focus,.gp-select:focus-visible{outline:none;border-color:color-mix(in srgb,var(--gp-accent) 70%,#fff);background:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--gp-accent) 12%,transparent)}
.gp-judge-row{display:flex;gap:8px;margin:0 0 12px}
.gp-judge{min-width:72px;height:42px;padding:0 16px;border-radius:11px;border:1px solid #d7dce5;background:#fff;color:var(--gp-page-ink);font-size:13px;font-weight:750}
.gp-judge.is-on{background:color-mix(in srgb,var(--gp-accent) 8%,#fff);border-color:var(--gp-accent);color:var(--gp-accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--gp-accent) 8%,transparent)}
.hide-today-card[data-current-tab="grammarPractice"] .today-action-row{display:none!important}
.hide-today-card[data-current-tab="grammarPractice"] .content{padding-top:8px!important}
@keyframes gp-progress-draw{from{stroke-dasharray:0 100}}
@media(hover:hover){
  .gp-chapter-card:hover,.gp-exercise-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--gp-accent,#344054) 22%,transparent);box-shadow:0 12px 26px rgba(16,24,40,.08)}
  .gp-check:hover{filter:brightness(.96);transform:translateY(-1px)}
  .gp-back:hover{border-color:color-mix(in srgb,var(--gp-accent) 24%,transparent);background:#fff}
}
@media(max-width:720px){
  #grammarPracticePanel .list-container{gap:14px;padding-inline:0}
  .gp-hero{padding:22px 20px;border-radius:17px}
  .gp-hero-compact{padding:19px 20px}
  .gp-hero h2{font-size:23px}
  .gp-exercise-list{grid-template-columns:1fr}
  .gp-sentence{font-size:16px}
  .gp-item-rewrite .gp-prompt,.gp-item-rewrite .gp-sentence{font-size:18px}
  .gp-item{padding:16px;border-radius:15px}
  .gp-choices-bank{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .gp-choice-groups{grid-template-columns:1fr}
  .gp-choice{min-height:46px;padding:9px 10px}
  .gp-select-wrap{max-width:none}
  .gp-finish{align-items:stretch;padding:18px}
  .gp-finish-actions{flex:1}
  .gp-finish-actions>*{flex:1}
  .gp-part{grid-template-columns:1fr}
  .gp-input:not(.gp-input-inline),.gp-check,.gp-textarea{width:100%}
  .gp-answer-row{display:grid}
}
@media(max-width:420px){
  .gp-choices-bank{grid-template-columns:1fr}
  .gp-finish{display:grid;gap:14px}
  .gp-finish-actions{display:grid;grid-template-columns:1fr}
  .gp-chapter-card{padding:16px 94px 16px 16px}
  .gp-chapter-progress{right:15px;width:68px;height:68px}
  .gp-chapter-progress-copy strong{font-size:19px}
  .gp-chapter-progress-copy>span{margin-top:4px;font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  .gp-chapter-progress-value{animation:none}
}
