/* v18 additions keep the supplied mobile layout and extend larger screens. */
.motivation{isolation:isolate;position:relative;overflow:hidden;border-radius:20px}.motivation .motivation-background,[data-theme=dark] .motivation .motivation-background{position:absolute;inset:0;width:100%;height:100%;border-radius:0!important;object-fit:cover;object-position:center;mix-blend-mode:normal;opacity:.55;max-width:none;filter:none;z-index:-1}.motivation p{position:relative;z-index:1}.motivation-mini p{flex:0 1 64%;color:var(--ink)}[data-theme=dark] .motivation{background:#31251e}[data-theme=dark] .motivation .motivation-background{opacity:.25}[data-theme=dark] .motivation p{color:#fff}.hd-brand img,.side-brand img{filter:none!important;box-shadow:none!important}
.school-clock{display:flex;align-items:center;justify-content:space-between;gap:20px;background:var(--card);border-radius:22px;padding:20px}.school-clock span{font-size:14px;color:var(--ink2)}.school-clock strong{display:block;font-size:40px;line-height:1.2;letter-spacing:-.045em;margin:8px 0}.school-clock strong small{font-size:18px;font-weight:500}.school-clock strong svg{width:32px;height:32px}.school-clock p,.clock-zone{font-size:12px;color:var(--ink2);margin:0}.clock-zone{padding:8px 4px 12px}.meal-reminder{display:flex;align-items:center;gap:12px;margin-top:8px;padding:14px;background:var(--accentSoft);color:var(--accent);border-radius:16px}.meal-reminder svg{width:24px;height:24px}.club-entry{margin-top:12px}.club-card,.appearance-panel{background:var(--card);border-radius:18px;padding:18px;margin:12px 0}.club-card h3{font-size:18px}.club-card p{color:var(--ink2);margin:8px 0 16px}.theme-options{display:flex;gap:6px;margin-top:14px}.theme-options .btn{min-width:0;flex:1;padding:12px 6px;font-size:13px}.homework-text{white-space:pre-wrap;margin:16px 0;line-height:1.55}.smart-suggestions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.smart-suggestions .hint{width:100%}.smart-suggestions .btn{white-space:normal;text-align:left}.school-splash{position:fixed;inset:0;z-index:10000;background:#fff;display:grid;place-items:center;transition:opacity 300ms cubic-bezier(.22,1,.36,1);pointer-events:none}.school-splash.dark{background:#17181c}.school-splash img{width:min(100vw,480px);height:min(100dvh,740px);object-fit:contain}.school-splash.finished{opacity:0}
@media(min-width:700px) and (max-width:899px){.scroll{padding-left:32px;padding-right:32px}.hd{padding-left:32px;padding-right:32px}.home-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.dock{max-width:620px;left:50%;transform:translateX(-50%)}.sheet{max-width:640px;margin-inline:auto}.home-banner{min-height:160px}.home-banner p{font-size:22px}}
@media(min-width:900px){.app{width:100%;max-width:none;margin:0;border-radius:0}.main-col{min-width:0;flex:1;display:flex;flex-direction:column}.sidebar{width:236px;flex-basis:236px;padding:30px 18px}.side-brand img{width:184px;max-width:100%}.hd{flex:none;padding:24px 40px 16px}.scroll{min-width:0;width:100%;padding:16px 40px 48px;overflow:auto}#page{width:100%;max-width:1120px;margin-inline:auto;min-width:0}.page-title h1{font-size:36px;line-height:1.12}.page-title p{font-size:15px}.home-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.home-actions .nav-card{min-height:100px}.home-banner{min-height:180px;margin-bottom:18px}.home-banner p{max-width:460px;width:58%;font-size:26px;line-height:1.3}#schoolClock{margin-bottom:14px}.school-clock{padding:24px}.school-clock strong{font-size:44px}.profile-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}.profile-layout>*{min-width:0}.profile-secondary .home-actions{grid-template-columns:1fr}.days{max-width:800px;gap:12px}.days .day{flex:1}.lesson-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.lesson-list .lesson{margin:0;min-width:0}.lesson-body{min-width:0}.lesson .subject{overflow-wrap:anywhere}.sched-table-wrap{width:100%;max-width:100%;min-width:0;overflow-x:auto}.filters{justify-content:flex-start;gap:16px}.filters .select-field{flex:0 1 340px}.menu-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.news-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:20px}.news-card{margin:0;min-width:0}.overlay{align-items:center;padding:28px}.sheet{width:min(640px,100%);max-height:calc(100dvh - 56px);border-radius:26px;margin:auto;min-width:0}.sheet-body{padding:24px}.sheet-header{padding:20px 24px}.sheet-header h2{font-size:25px;line-height:1.2}.sheet .field{margin-bottom:18px}.sheet .field input,.sheet .field select{min-height:48px}.appearance-panel,.prof-item{max-width:780px}#page[data-route=homework-detail],#page[data-route=article],#page[data-route=settings],#page[data-route=support],#page[data-route=documents]{max-width:820px}.motivation-mini{min-height:105px;padding:24px}.motivation-mini p{font-size:17px}.school-splash img{width:440px;height:min(82dvh,740px)}}
@media(prefers-reduced-motion:reduce){.school-splash{transition:none}}
@media(min-width:700px) and (max-width:899px){.dock{right:auto;width:calc(100% - 64px)}}
@media(min-width:900px){.overlay .sheet{border-radius:26px}.news-feed{max-width:none;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:20px}.feed-post{min-width:0}.transfer-toolbar{max-width:100%}.school-splash img{max-width:100%;max-height:100%}}
/* v19 WebKit viewport: the outer document never scrolls; only inner panels do. */
html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
.app{height:100vh;height:var(--app-height,100dvh);top:var(--app-offset,0px);bottom:auto}
html[data-keyboard] .dock{display:none}
.timezone-card{margin-top:24px;padding:20px}
.timezone-card select{display:block;width:100%;margin:16px 0 14px;min-height:48px}
.sheet-body label.check-row{display:flex!important;align-items:flex-start;gap:12px;line-height:1.45;padding:10px 0;text-align:left}
.sheet-body label.check-row input[type=checkbox]{flex:0 0 22px!important;width:22px!important;height:22px!important;min-height:22px!important;margin:0!important;accent-color:var(--accent)}
.teacher-colored.lesson .lesson-bar{background:var(--teacher-color)!important}
.teacher-colored.lesson .icon-badge{color:var(--teacher-color);background:color-mix(in srgb,var(--teacher-color) 14%,var(--card))}
.teacher-colored.sched-cell{background:color-mix(in srgb,var(--teacher-color) 13%,var(--card));border-left:3px solid var(--teacher-color)}
[data-theme=dark] .teacher-colored.sched-cell{background:color-mix(in srgb,var(--teacher-color) 23%,var(--card))}
.teacher-colored.cancelled{opacity:.6}
#u-color{width:100%;min-height:48px;padding:5px;cursor:pointer}
.dish-ingredients-btn{display:inline-flex;min-height:40px;align-items:center;color:var(--accent);font-size:13px;text-align:left;margin-top:6px}
.dish-detail-photo{display:block;width:100%;max-height:280px;object-fit:cover;border-radius:20px}
.dish-detail-placeholder{min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:var(--accentSoft);color:var(--accent);border-radius:20px;font-size:14px}
.dish-detail-placeholder svg{width:52px;height:52px}
.dish-composition{padding:20px 0}.dish-composition h3{margin-bottom:10px}.dish-composition p{white-space:pre-line;line-height:1.6;color:var(--ink2)}
.nutrition-grid,.nutrition-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.nutrition-grid>div{padding:14px;border-radius:16px;background:var(--bg)}.nutrition-grid strong,.nutrition-grid span{display:block}.nutrition-grid strong{font-size:22px}.nutrition-grid span{font-size:12px;color:var(--ink2);margin-top:4px}
.menu-repair{margin-top:20px}.menu-repair .btn{margin-top:12px}

.login{height:100dvh;overflow-y:auto;overscroll-behavior:contain}
/* v20: quiet graphite surfaces, warm accents and a tactile glass dock. */
[data-theme=dark]{--bg:#17181c;--bg2:#202126;--card:#24262c;--card2:#2b2d34;--card3:#32353d;--ink:#f1f1f4;--ink2:#b2b3bd;--ink3:#989ba8;--ink4:#737782;--line:#32343c;--line2:#454854;--accent:#ff945b;--accentSoft:#3a2b24;--blue:#75b9ff;--blueSoft:#243446;--green:#5dd5a4;--greenSoft:#233d34;--purple:#bb9cf5;--purpleSoft:#352d47;--amber:#e8bd72;--amberSoft:#3c3325;--red:#ff8794;--redSoft:#422b32;--pink:#ee92b3;--pinkSoft:#3e2c38;--teal:#65cbc5;--tealSoft:#243c3c;--glass:rgba(37,39,46,.8);--glass-line:rgba(255,255,255,.12)}
[data-theme=dark] .dish-card,[data-theme=dark] .prof-item,[data-theme=dark] .nav-card,[data-theme=dark] .detail-card,[data-theme=dark] .school-clock{border:1px solid #ffffff06;box-shadow:0 2px 8px #0000000a}
[data-theme=dark] .btn.primary{color:#fff;background:linear-gradient(120deg,#ee8848,#ef702c)}
[data-theme=dark] .lesson-cancelled{background:var(--bg2)}
[data-theme=dark] .sheet-header,[data-theme=dark] .sheet-body .actions{background:var(--card)}
.motivation p,.motivation-mini p{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic;letter-spacing:-.015em;line-height:1.32;text-wrap:pretty}
.motivation p{font-size:clamp(20px,4.7vw,27px)}.motivation-mini p{font-size:clamp(18px,4.2vw,23px)}
[data-theme=dark] .motivation{background:#302720;border:1px solid #e9b08716}
[data-theme=dark] .motivation p{color:#f4e7d9}
[data-theme=dark] .motivation .motivation-background{opacity:.2}
.dock{touch-action:none;overflow:visible;background:linear-gradient(145deg,#ffffffc9,#ffffffe8);border:1px solid #ffffffd9;box-shadow:0 8px 30px #20273815,inset 0 1px 0 #fff;backdrop-filter:blur(26px) saturate(145%);-webkit-backdrop-filter:blur(26px) saturate(145%)}
[data-theme=dark] .dock{background:linear-gradient(145deg,#34363ece,#24262ce6);border-color:#ffffff20;box-shadow:0 8px 32px #0004,inset 0 1px 0 #ffffff14}
.dock .ind{background:linear-gradient(135deg,#e4e4eaba,#dcdde7b3);border:1px solid #ffffffb3;box-shadow:inset 0 1px 1px #fff9,0 2px 5px #13182d0a;transform:scale(1);transform-origin:center;transition:left 360ms cubic-bezier(.2,.85,.2,1),width 300ms ease,transform 320ms cubic-bezier(.2,1.35,.35,1),box-shadow 240ms ease,background 240ms ease;pointer-events:none}
[data-theme=dark] .dock .ind{background:linear-gradient(135deg,#74778355,#a6aabc33);border-color:#ffffff25;box-shadow:inset 0 1px 1px #ffffff26,0 2px 6px #0002}
.dock-btn{color:#777985;transition:color 180ms ease,transform 260ms cubic-bezier(.2,1.2,.3,1);-webkit-touch-callout:none}
.dock-btn.active,[data-theme=dark] .dock-btn.active{color:#ed702c}
[data-theme=dark] .dock-btn{color:#a6a8b4}
[data-theme=dark] .dock-btn.active{color:#ffb080}
.dock-touching .ind{transform:scale(1.09,1.14);background:linear-gradient(120deg,#ffffff9c,#eeeef749);box-shadow:inset 0 1px 2px #fff,0 5px 18px #222c4924;backdrop-filter:blur(7px) saturate(180%);-webkit-backdrop-filter:blur(7px) saturate(180%)}
.dock-touching .ind::after{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;background:conic-gradient(from 30deg at var(--glass-touch,50%) 50%,#ffffffdd,#b6d0ff99,#dcaaf777,#fff9,#ffcba877,#afe4ee88,#ffffffdd);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor}
[data-theme=dark] .dock-touching .ind{background:linear-gradient(130deg,#979dad4a,#52566350);box-shadow:inset 0 1px 2px #ffffff69,0 6px 20px #0004}
.dock-dragging .ind{transition:transform 220ms cubic-bezier(.2,1.35,.3,1),box-shadow 180ms ease}
.dock-touching .dock-btn.active{color:var(--ink2)}
.dock-touching .dock-btn.dock-preview{color:#e66a2a;transform:scale(1.055)}
[data-theme=dark] .dock-touching .dock-btn.dock-preview{color:#ffb080}
.btn,.nav-card,.dish-card,.prof-item{transition:transform 180ms ease,background-color 220ms ease,border-color 220ms ease}
.btn:active,.nav-card:active{transform:scale(.98)}
button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.dock .ind,.dock-btn,.btn,.nav-card,.dish-card,.prof-item{transition:none!important}.dock-touching .ind,.dock-touching .dock-btn.dock-preview,.btn:active,.nav-card:active{transform:none!important}}
/* Ranks reuse the existing card, ink and accent tokens. */
#app,#loginScreen,.overlay{touch-action:pan-x pan-y}.photo-viewport{touch-action:pan-x pan-y pinch-zoom}
.rank-profile{padding:16px;background:var(--card);border:1px solid var(--line);border-radius:22px;margin:14px 0}
.rank-summary{display:flex;width:100%;gap:14px;align-items:center;text-align:left}.rank-summary>img{flex-shrink:0;border-radius:20px;object-fit:contain;background:#101014}.rank-summary>span{min-width:0;flex:1}.rank-summary small,.rank-summary strong,.rank-summary>span>span{display:block}.rank-summary small{font-size:12px;color:var(--ink2);margin-bottom:4px}.rank-summary strong{font-size:19px;line-height:1.2}.rank-summary>span>span{font-size:13px;color:var(--ink2);margin-top:6px}.rank-summary>svg{width:18px;flex-shrink:0}
.rank-progress{height:7px;background:var(--bg2);border-radius:8px;overflow:hidden;margin:16px 0 8px}.rank-progress>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff772e,#e9b167);transition:width 650ms cubic-bezier(.2,.8,.2,1)}.rank-profile>p{font-size:12px;color:var(--ink2)}.rank-sync{font-size:12px;color:var(--accent);margin-top:10px;text-align:left;min-height:36px}
.rank-list{display:grid;gap:10px}.rank-row{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:18px;padding:13px;background:var(--bg)}.rank-row>img{flex:0 0 68px;object-fit:contain;border-radius:16px;background:#101014}.rank-row>div{min-width:0}.rank-row h3{font-size:16px;line-height:1.25}.rank-row small{display:block;font-size:12px;color:var(--ink2);margin:4px 0}.rank-row p{font-size:12px;color:var(--ink2);line-height:1.45;margin:6px 0}.rank-row b{font-size:11px;font-weight:600;color:var(--ink2)}.rank-row.locked>img{opacity:.5;filter:saturate(.5)}.rank-row.current{border-color:color-mix(in srgb,var(--accent) 40%,var(--line));box-shadow:0 0 20px #ef9b3a0b}.rank-row.current b{color:var(--accent)}
.rank-name-9{color:#aa7528;background:linear-gradient(110deg,#90611f 10%,#c48a32 35%,#e6b85d 50%,#ad7625 70%,#90611f 90%);background-size:220% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:rank-gold 7s ease-in-out infinite}
[data-theme=dark] .rank-name-9{background-image:linear-gradient(110deg,#c99a47,#e7ba65,#fff0b4,#d8a94f,#c99a47)}
.rank-name-10{display:inline-block;position:relative;color:#c95a16;background:linear-gradient(100deg,#b95119,#df7728,#ecae42,#cc6120,#b95119);background-size:240% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:rank-fire 5s ease-in-out infinite}
[data-theme=dark] .rank-name-10{background-image:linear-gradient(100deg,#f3873c,#ffc25a,#fff0b4,#fba447,#f3873c)}
.rank-name-10::after{content:'';position:absolute;right:4%;top:0;width:3px;height:3px;border-radius:50%;background:#dcaa4c;animation:title-spark 4s ease-out infinite}
.avatar-edit{margin:0 0 14px;font-size:13px}.avatar-upload{display:flex;margin-bottom:16px;cursor:pointer}.rank-avatar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0}.rank-avatar-grid button{min-width:0;padding:8px;border-radius:16px;background:var(--bg)}.rank-avatar-grid img{display:block;width:100%;aspect-ratio:1;object-fit:contain;border-radius:14px}.rank-avatar-grid span{display:block;font-size:11px;margin-top:7px;line-height:1.2}.profile-card .avatar img{width:100%;height:100%;object-fit:cover}
.rank-celebration{position:fixed;inset:0;z-index:1500;display:grid;place-items:center;padding:24px;pointer-events:none;background:#10101766;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);animation:rank-overlay 2.4s ease both}
.rank-celebration-card{width:min(100%,340px);border-radius:28px;padding:24px;text-align:center;background:var(--card);border:1px solid var(--glass-line);box-shadow:0 20px 80px #0002}.rank-reveal{position:relative;width:170px;height:170px;margin:0 auto 18px;border-radius:32px;background:#101014;box-shadow:0 0 35px #eaa45522}.rank-reveal img{position:absolute;inset:0;width:100%;height:100%;border-radius:32px;object-fit:contain}.rank-before{animation:rank-out 700ms ease forwards}.rank-after{animation:rank-in 1.1s cubic-bezier(.2,.8,.2,1) both}.rank-reveal i{position:absolute;left:50%;top:50%;width:3px;height:3px;background:#f0be77;border-radius:50%;--angle:calc(var(--spark)*51deg);animation:rank-spark 1.8s ease-out both;animation-delay:calc(var(--spark)*30ms)}.rank-celebration h2{font-size:24px;line-height:1.2;margin-bottom:8px}.rank-celebration p{font-size:13px;color:var(--ink2)}.rank-celebration strong{display:block;color:var(--accent);margin:12px 0;font-size:18px}.rank-celebration small{display:block;color:var(--ink2);font-size:12px}.rank-ultimate .rank-after{animation:rank-phoenix 1.8s cubic-bezier(.2,.8,.2,1) both}.rank-ultimate .rank-reveal{box-shadow:0 0 48px #eab36240}
@keyframes rank-gold{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes rank-fire{0%,100%{background-position:0% 50%;opacity:1}45%{background-position:100% 50%;opacity:.87}65%{opacity:1}}
@keyframes title-spark{0%,55%,100%{opacity:0;transform:translateY(0)}65%{opacity:.6}85%{opacity:0;transform:translateY(-9px)}}
@keyframes rank-overlay{0%,100%{opacity:0}12%,85%{opacity:1}}
@keyframes rank-out{0%{opacity:1;transform:scale(.92)}50%{opacity:.7;transform:scale(1.08)}100%{opacity:0;transform:scale(1.12)}}
@keyframes rank-in{0%,25%{opacity:0;transform:scale(.85)}100%{opacity:1;transform:scale(1)}}
@keyframes rank-phoenix{0%{opacity:0;filter:brightness(0) grayscale(1);transform:scale(.7,.8)}25%{opacity:1;filter:brightness(.2) grayscale(1)}60%{filter:brightness(1.2);transform:scale(1.04)}100%{opacity:1;filter:none;transform:scale(1)}}
@keyframes rank-spark{0%,20%{opacity:0;transform:rotate(var(--angle)) translateX(20px)}40%{opacity:.7}100%{opacity:0;transform:rotate(var(--angle)) translateX(104px)}}
@media(prefers-reduced-motion:reduce){.rank-progress>span{transition:none}.rank-name-9,.rank-name-10,.rank-celebration,.rank-reveal img,.rank-reveal i,.rank-name-10::after{animation:none!important}.rank-before,.rank-reveal i,.rank-name-10::after{display:none}.rank-celebration{backdrop-filter:none;-webkit-backdrop-filter:none}}

/* v30: installed iOS PWA uses measured full screen height instead of Safari toolbar dvh. */
html[data-standalone=true] .app{height:var(--app-height,100vh);top:var(--app-offset,0px);bottom:auto}