/* AW Chinese Cloud Blue Edition 8.3 — design-only overlay, no changes to memory/game logic.
   Applies to public pages, Admin and Academy through safe universal bootstrap.
   Copybook is intentionally excluded in subfolder_paths.php. */
:root{
 --aw-cloud-primary:#2455D6;--aw-cloud-hover:#1948B8;--aw-cloud-muted-blue:#5578B8;
 --aw-cloud-canvas:#F5F8FC;--aw-cloud-mist:#EAF1FA;--aw-cloud-text:#27364B;
 --aw-cloud-subtext:#52657C;--aw-cloud-border:#E2E9F3;--aw-cloud-paper:#FFFFFF;
 --aw-cloud-radius:19px;--aw-cloud-shadow:0 10px 34px rgba(27,61,116,.055);
 --blue:#2455D6;--navy:#153E90;--bg:#F5F8FC;--ink:#27364B;--muted:#52657C;
 --line:#E2E9F3;--tint:#EAF1FA;--white:#fff;--shadow:0 10px 34px rgba(27,61,116,.055);
}
html{accent-color:var(--aw-cloud-primary);scroll-behavior:smooth}
body{background:var(--aw-cloud-canvas);color:var(--aw-cloud-text)}
::selection{background:#CFDFFF;color:#153E90}
.aw-icon{display:inline-block;width:20px;height:20px;flex:0 0 auto;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.85;overflow:visible}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #60A5FA!important;outline-offset:3px}
button, a{touch-action:manipulation}
button:not(:disabled),a[href]{-webkit-tap-highlight-color:transparent}
/* Public shell / information architecture */
body:has(>.shell) #sidebar{width:250px;padding:22px 15px 18px;background:rgba(255,255,255,.97);border-color:var(--aw-cloud-border);box-shadow:4px 0 30px rgba(30,63,105,.018)}
body:has(>.shell) #sidebar .brand{margin:0 5px 13px;padding:8px 7px 24px;line-height:1.3;letter-spacing:-.45px;font-size:19px;color:var(--aw-cloud-text)}
body:has(>.shell) #sidebar .brand small{font-size:9px;letter-spacing:1.55px;color:#7A8EA7;margin-top:5px}
body:has(>.shell) .brand .logo{background:linear-gradient(145deg,#173F9D,#2455D6 72%,#58B5F5);border-radius:15px;box-shadow:0 9px 22px rgba(36,85,214,.21)}
body:has(>.shell) .nav-item{border-radius:12px;padding:11px 13px;margin:3px 0;font-weight:550;color:#61718A;gap:13px}
body:has(>.shell) .nav-item .nav-icon{display:grid;place-items:center;width:24px;color:#8493AA}
body:has(>.shell) .nav-item:hover{background:#F2F6FC;color:#2455D6}
body:has(>.shell) .nav-item.active{background:#EAF1FA;color:#1F4BA8;box-shadow:inset 3px 0 0 #2455D6;font-weight:750}
body:has(>.shell) .nav-item.active .nav-icon{color:#2455D6}
body:has(>.shell) .v6-more-links{border-top:1px solid var(--aw-cloud-border);margin-top:16px;padding-top:12px}
body:has(>.shell) .v6-more-links a{border-radius:9px}
body:has(>.shell) #sidebar .sidebar-bottom{border-top:0;background:#F0F5FC;border-radius:15px;padding:17px;margin-top:auto;color:#304969}
body:has(>.shell) #sidebar .sidebar-bottom p{font-size:11px}
body:has(>.shell) .shell{margin-left:250px;min-width:0}
body:has(>.shell) .topbar{height:77px;background:rgba(255,255,255,.9);border-bottom:1px solid var(--aw-cloud-border);padding:0 35px;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);position:sticky;top:0;z-index:30}
body:has(>.shell) .breadcrumb{font-weight:550;letter-spacing:.05px;color:#73839A}body:has(>.shell) .breadcrumb strong{color:#304461;font-weight:750}
body:has(>.shell) .header-actions{gap:11px}body:has(>.shell) .header-actions .user-chip{background:#EEF4FE;color:#2455D6;border:1px solid #DCE8FA}
body:has(>.shell) .context-wrap{background:#F8FAFD;border-bottom:1px solid var(--aw-cloud-border);padding:12px 35px 10px}
body:has(>.shell) .context{gap:15px}body:has(>.shell) .context select{min-height:42px;border-radius:11px;border:1px solid #D6E0ED;background:white;color:#27364B}
body:has(>.shell) .data-status{background:#EAF1FA;color:#2B5287;padding:7px 12px;border-radius:10px;margin-left:0;font-weight:650}
body:has(>.shell) .refresh-btn{min-height:42px;border-radius:11px;color:#3B5A80;border-color:#DFE7F2}
body:has(>.shell) #main{padding:clamp(22px,3vw,40px);padding-bottom:80px;max-width:1420px}
body:has(>.shell) #main>h1{font-size:clamp(25px,2.55vw,37px);color:#223652;line-height:1.3;letter-spacing:-.045em}
body:has(>.shell) .eyebrow{font-size:10px;font-weight:800;letter-spacing:1.5px;color:#5578B8}
body:has(>.shell) .card{background:white;border:1px solid #E2E9F3;border-radius:19px;box-shadow:var(--aw-cloud-shadow)}
body:has(>.shell) a.card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;position:relative}
body:has(>.shell) a.card:hover{transform:translateY(-3px);border-color:#ADC4EB;box-shadow:0 17px 37px rgba(38,77,137,.095)}
body:has(>.shell) .hero{background:linear-gradient(117deg,#173D89 0%,#2455D6 65%,#4C91E8 125%);border-radius:24px;box-shadow:0 17px 36px rgba(33,78,160,.14);isolation:isolate}
body:has(>.shell) .hero::before{content:'';position:absolute;inset:-90px -30px auto auto;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,#B7E6FF30,transparent 70%);pointer-events:none}
body:has(>.shell) .hero .hero-orbit{background:#FFFFFF0D;border-color:#FFFFFF30}
body:has(>.shell) .button,.auth-card .button{border-radius:11px;min-height:44px}
body:has(>.shell) .button-primary,.auth-card .button-primary{background:#2455D6;color:white;border-color:#2455D6}
body:has(>.shell) .button-primary:hover,.auth-card .button-primary:hover{background:#1948B8}
body:has(>.shell) .button-secondary{background:white;border-color:#D5E0EF;color:#344B67}
body:has(>.shell) .stat{background:linear-gradient(145deg,#fff,#FAFCFF);position:relative;overflow:hidden}
body:has(>.shell) .stat .stat-value{color:#2455D6;font-weight:800;letter-spacing:-.035em}
body:has(>.shell) .stat:before{content:'';position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#2455D6,#85C4EE);opacity:.68}
body:has(>.shell) .lesson-card .lesson-count{color:#2455D6}
body:has(>.shell) .icon-tile{width:49px;height:49px;display:grid;place-items:center;border-radius:14px;background:#EAF1FA;color:#2455D6;box-shadow:none;font-size:25px}
body:has(>.shell) .icon-tile .aw-icon{width:25px;height:25px}
body:has(>.shell) .site-footer{border-color:#E4EBF4;color:#77889B}
body:has(>.shell) .toolbar input[type=search]{border-radius:12px;border-color:#D6E2F0;background:#fff}
body:has(>.shell) .word-row{border-color:#E7EDF6}
body:has(>.shell) .word-row:hover{background:#F8FAFE}
body:has(>.shell) .v8-review-hero{border-radius:23px}
body:has(>.shell) .v8-review-stats .v8-stat{border-color:#E2E9F3;box-shadow:var(--aw-cloud-shadow);border-radius:17px}
body:has(>.shell) .v8-stat>strong{color:#27364B}
body:has(>.shell) .v8-panel{border-radius:20px;border-color:#E2E9F3}
body:has(>.shell) .v8-word-item{background:#F7FAFE;border-color:#E4ECF5}
body:has(>.shell) .v8-game-links a{border-color:#E2E9F3;border-radius:16px}
body:has(>.shell) .v6-mobile-nav .aw-icon{width:21px;height:21px}
/* Cloud utility controls in global header */
.aw-cloud-search-btn{display:inline-flex;align-items:center;gap:9px;min-height:42px;border:1px solid #DCE6F1;background:#F8FAFE;color:#47637F;padding:7px 12px;border-radius:11px;font-size:12px;font-weight:700;white-space:nowrap}
.aw-cloud-search-btn:hover{color:#2455D6;border-color:#ACC4ED;background:#EFF5FF}
.aw-cloud-search-btn kbd{font:600 10px/1.4 system-ui,sans-serif;background:#fff;border:1px solid #DDE5F0;padding:3px 5px;border-radius:5px;color:#8794A8}
.aw-cloud-search-btn .aw-icon{width:17px;height:17px}
.v6-theme-button,.aw-cloud-theme-toggle{width:42px;height:42px;min-width:42px;display:grid;place-items:center!important;background:#F8FAFE!important;border:1px solid #DAE5F2!important;border-radius:11px!important;color:#3C5B84!important;font-size:0!important;line-height:1}
.v6-theme-button .aw-icon,.aw-cloud-theme-toggle .aw-icon{width:20px;height:20px}
.aw-cloud-backtop{position:fixed;right:25px;bottom:22px;width:43px;height:43px;border:1px solid #DAE6F4;border-radius:13px;z-index:26;background:white;display:grid;place-items:center;color:#2455D6;box-shadow:0 13px 31px #193C7D1C;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s}
.aw-cloud-backtop.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.aw-cloud-backtop .aw-icon{transform:rotate(-90deg)}
/* Quick navigation dialog: visual search + keyboard navigation */
.aw-cloud-dialog{position:fixed;inset:0;width:min(590px,calc(100vw - 24px));max-height:min(660px,calc(100dvh - 50px));margin:min(15vh,110px) auto auto;padding:0;background:#fff;border:1px solid #D5E1F2;border-radius:22px;box-shadow:0 30px 95px rgba(13,30,64,.25);color:#27364B;overflow:hidden;z-index:150}
.aw-cloud-dialog::backdrop{background:rgba(14,28,53,.51);backdrop-filter:blur(5px)}
.aw-cloud-dialog-search{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid #E8EDF5;color:#7590B6}
.aw-cloud-dialog-search input{border:0;outline:none!important;box-shadow:none!important;flex:1;min-width:0;background:transparent;color:#27364B;font-size:15px;padding:5px;min-height:36px}
.aw-cloud-dialog-search .aw-icon{width:20px;height:20px}
.aw-cloud-dialog-search button{display:grid;place-items:center;background:#F2F5FA;color:#5D6D82;border:0;border-radius:9px;width:33px;height:33px}
.aw-cloud-entries{padding:10px;overflow:auto;max-height:min(440px,50dvh)}
.aw-cloud-entry{display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:12px;color:#27364B;text-decoration:none;min-height:50px}
.aw-cloud-entry .aw-icon:first-child{color:#5477AD}
.aw-cloud-entry span{flex:1}.aw-cloud-entry .aw-icon:last-child{width:16px;height:16px;color:#A1B0C2}
.aw-cloud-entry.is-selected,.aw-cloud-entry:hover{background:#EAF1FA;color:#204FAA}
.aw-cloud-empty{padding:20px;color:#667B95;text-align:center;font-size:13px}
.aw-cloud-dialog-footer{display:flex;gap:15px;border-top:1px solid #E8EDF5;color:#8292A6;font-size:11px;padding:11px 17px;justify-content:space-between}
.aw-cloud-dialog kbd{font:600 10px/1 system-ui,sans-serif;background:#F2F5FA;border:1px solid #E3EAF2;border-radius:5px;padding:3px 6px;color:#677C99}
/* Everyday-friendly motion, not decorative motion over text */
@media (hover:hover) and (prefers-reduced-motion:no-preference){body:has(>.shell) .card:not(.stat):hover{transition:box-shadow .2s,border-color .2s,transform .2s}}
/* Subapps: game, Academy, Flashcards, login and admin backgrounds */
html[data-aw-surface="game"] body{background:#F5F8FC}
html[data-aw-surface="game"] .game-header{background:rgba(255,255,255,.92);border-bottom-color:#E2E9F3}
html[data-aw-surface="game"] .setup-card,html[data-aw-surface="game"] .play-card{border-radius:22px!important;border-color:#E2E9F3!important;box-shadow:var(--aw-cloud-shadow)!important}
html[data-aw-surface="flashcards"]{--bg:#F5F8FC;--panel:#fff;--ink:#27364B;--muted:#52657C;--line:#E2E9F3;--blue:#2455D6;--soft:#EAF1FA;--shadow:0 10px 34px rgba(27,61,116,.055)}
html[data-aw-surface="flashcards"] .studio{max-width:1000px}
html[data-aw-surface="flashcards"] .panel{border-radius:22px;box-shadow:var(--aw-cloud-shadow)}
html[data-aw-surface="flashcards"] .mode.selected{background:#EDF4FF;border-color:#5578B8}
html[data-aw-surface="flashcards"] .studycard{background:linear-gradient(140deg,#fff,#F0F5FC);box-shadow:0 14px 38px rgba(27,61,116,.08)}
html[data-aw-surface="academy"]{--blue:#2455D6;--navy:#153E90;--sky:#58B5F5;--ink:#27364B;--muted:#52657C;--canvas:#F5F8FC;--paper:#fff;--soft:#EAF1FA;--stroke:#E2E9F3}
html[data-aw-surface="academy"] .side{background:#fff;border-color:#E2E9F3}html[data-aw-surface="academy"] .hero{background:linear-gradient(118deg,#173D89 0%,#2455D6 70%,#4C91E8 123%)}
html[data-aw-surface="academy"] .metric,html[data-aw-surface="academy"] .feature,html[data-aw-surface="academy"] .word-card{border-color:#E2E9F3;box-shadow:var(--aw-cloud-shadow)}
html[data-aw-surface="academy"] .nav-item.active{background:#EAF1FA;color:#2455D6}
html[data-aw-surface="auth"] .auth-page{background:radial-gradient(ellipse 70vw 54vh at 95% 2%,#DCEAFE,transparent),#F5F8FC}
html[data-aw-surface="auth"] .auth-card{border-color:#E2E9F3;box-shadow:0 24px 65px rgba(31,62,112,.095);border-radius:23px}
html[data-aw-surface="admin"] body{background:#F5F8FC}
/* Dark mode: restrained navy. Existing module-specific dark styles remain authoritative. */
html[data-theme="dark"]{--aw-cloud-canvas:#111B2B;--aw-cloud-paper:#202D40;--aw-cloud-text:#EDF3FF;--aw-cloud-subtext:#B7C6DB;--aw-cloud-border:#34475F;--aw-cloud-mist:#263B56;--bg:#111B2B;--white:#202D40;--ink:#EDF3FF;--muted:#B7C6DB;--line:#34475F;--tint:#263B56;--blue:#8EBBFF;--navy:#EDF3FF}
html[data-theme="dark"] body:has(>.shell) #sidebar,html[data-theme="dark"] body:has(>.shell) .topbar{background:#18253A;border-color:#34475F}
html[data-theme="dark"] body:has(>.shell) .context-wrap{background:#142237;border-color:#34475F}
html[data-theme="dark"] body:has(>.shell) .card,html[data-theme="dark"] body:has(>.shell) .stat{background:#202D40!important;border-color:#34475F!important}
html[data-theme="dark"] body:has(>.shell) .nav-item:hover,html[data-theme="dark"] body:has(>.shell) .nav-item.active{background:#283E5F;color:#BDD9FF}
html[data-theme="dark"] body:has(>.shell) .nav-item.active .nav-icon,html[data-theme="dark"] body:has(>.shell) .nav-item .nav-icon{color:#BDD9FF}
html[data-theme="dark"] body:has(>.shell) .v6-more-links{border-color:#34475F}
html[data-theme="dark"] body:has(>.shell) .stat .stat-value,html[data-theme="dark"] body:has(>.shell) .lesson-count{color:#A4CBFF}
html[data-theme="dark"] body:has(>.shell) #sidebar .sidebar-bottom,html[data-theme="dark"] .v6-theme-button{background:#273B59!important;color:#D9E8FF!important;border-color:#3A5375!important}
html[data-theme="dark"] .aw-cloud-search-btn{background:#273B59;border-color:#3A5375;color:#D9E8FF}
html[data-theme="dark"] .aw-cloud-search-btn kbd{background:#1F304A;color:#AEC7EA;border-color:#3A5375}
html[data-theme="dark"] body:has(>.shell) #main>h1{color:#EDF3FF}
html[data-theme="dark"] .aw-cloud-backtop{background:#263C58;color:#B7D8FF;border-color:#3B5477}
/* Academy dark uses class .dark, flashcards/game use data-theme. */
html.dark[data-aw-surface="academy"] body{background:#111B2B}
html[data-theme="dark"][data-aw-surface="flashcards"]{--bg:#111B2B;--panel:#202D40;--ink:#EDF3FF;--muted:#B7C6DB;--line:#34475F;--blue:#8EBBFF;--soft:#263B56;--shadow:0 20px 48px rgba(0,0,0,.2)}
html[data-theme="dark"][data-aw-surface="flashcards"] .studycard{background:linear-gradient(145deg,#202D40,#263B56)}
/* Mobile / no horizontal overflow */
@media(max-width:1100px){.aw-cloud-search-btn kbd{display:none}body:has(>.shell) .topbar,body:has(>.shell) .context-wrap{padding-left:22px;padding-right:22px}}
@media(max-width:800px){body:has(>.shell) #sidebar{width:min(310px,88vw);z-index:61}body:has(>.shell) .shell{margin-left:0}body:has(>.shell) .topbar{height:65px;position:sticky;top:0;z-index:36}body:has(>.shell) .context-wrap{padding:11px 16px}body:has(>.shell) #main{padding:22px 16px 110px}body:has(>.shell) .nav-item{min-height:46px}body:has(>.shell) .v6-mobile-nav{box-shadow:0 -6px 25px rgba(35,65,105,.055);border-color:#E3EAF3;padding-bottom:env(safe-area-inset-bottom)}body:has(>.shell) .v6-mobile-nav a{display:grid;justify-items:center;gap:3px}body:has(>.shell) .v6-mobile-nav a.is-active{color:#2455D6;font-weight:750}body:has(>.shell) .v6-mobile-nav .aw-icon{width:22px;height:22px}body:has(>.shell) .hero{border-radius:19px}body:has(>.shell) .card{border-radius:16px}.aw-cloud-search-btn{padding:8px;width:42px;justify-content:center}.aw-cloud-search-btn .aw-cloud-search-label{display:none}.aw-cloud-backtop{bottom:88px;right:12px}body:has(>.shell) .site-footer{padding-bottom:96px}}
@media(max-width:410px){body:has(>.shell) .header-actions{gap:7px}body:has(>.shell) .topbar{padding:0 12px}body:has(>.shell) .user-chip{display:none}body:has(>.shell) .context-wrap{padding:11px 12px}.aw-cloud-search-btn,.v6-theme-button{width:40px;min-width:40px;height:40px}body:has(>.shell) #main{padding:18px 12px 102px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}.aw-cloud-backtop{transition:none}}
@media print{.aw-cloud-backtop,.aw-cloud-search-btn,.aw-cloud-dialog{display:none!important}}
/* Contextual shortcut appears only when a real public learning page was visited. */
.aw-cloud-continue{margin:14px 0 24px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:14px 18px;border:1px solid #D8E5F4;border-radius:15px;background:linear-gradient(110deg,#EAF1FA,#F9FCFF)}
.aw-cloud-continue>div{display:flex;align-items:center;gap:9px;color:#2C5086;font-size:13px}.aw-cloud-continue>div>span{color:#667C99;font-weight:400;font-size:12px}.aw-cloud-continue>a{color:#2455D6;font-size:13px;font-weight:750}
.aw-cloud-continue .aw-icon{color:#2455D6;width:19px;height:19px}
@media(max-width:520px){.aw-cloud-continue>div{flex-wrap:wrap}.aw-cloud-continue>div>span{flex-basis:100%;margin-left:28px}}
/* Admin legacy Tailwind surface — scoped to admin pages only, retaining green success badges. */
html[data-aw-surface="admin"] body{background:#F5F8FC!important;color:#27364B}
html[data-aw-surface="admin"] body.bg-slate-950{background:radial-gradient(circle at 10% 5%,#E7F0FC,#F5F8FC 46%)!important}
html[data-aw-surface="admin"] header.bg-slate-950{background:linear-gradient(105deg,#173D89,#2455D6)!important}
html[data-aw-surface="admin"] .rounded-3xl.bg-white,html[data-aw-surface="admin"] .rounded-2xl.bg-white{border:1px solid #E2E9F3;box-shadow:0 10px 32px rgba(27,61,116,.065)!important}
html[data-aw-surface="admin"] input:not([type=checkbox]):not([type=hidden]),html[data-aw-surface="admin"] select{border-color:#D4E0EF;min-height:44px}
html[data-aw-surface="admin"] input:focus,html[data-aw-surface="admin"] select:focus{border-color:#2455D6!important}
html[data-aw-surface="admin"] button.bg-emerald-600{background:#2455D6!important}
html[data-aw-surface="admin"] button.bg-emerald-600:hover{background:#1948B8!important}
html[data-aw-surface="admin"] button.bg-slate-900{background:#2455D6!important}
html[data-aw-surface="admin"] button.bg-slate-900:hover{background:#1948B8!important}
html[data-aw-surface="admin"] body.bg-slate-950>.w-full.max-w-md{border:1px solid #DCE6F4;border-radius:22px;box-shadow:0 22px 60px rgba(27,61,116,.11)!important}
