*{box-sizing:border-box}html{scrollbar-gutter:stable;background:#182f55 url("data:image/gif;base64,R0lGODlhAgACAIAAABgvVSo8aSH5BAAAAAAALAAAAAACAAIAAAIDhI9WADs=")}body{margin:0;color:#111;font:11px Tahoma,Verdana,Arial,sans-serif}.page{width:960px;max-width:calc(100% - 12px);margin:12px auto;background:#d8e2f0;border:1px solid #071b3a;box-shadow:0 0 0 1px #89a7ca,0 5px 22px #07152d}.top{height:102px;position:relative;overflow:hidden;padding:15px 20px;color:#fff;background:linear-gradient(#5fa9eb 0,#1266b4 47%,#06478f 48%,#0a3971 100%);border-bottom:1px solid #001f48}.top:after{content:"";position:absolute;right:28px;top:-72px;width:260px;height:210px;border:18px solid rgba(255,255,255,.1);border-radius:50%}.logo{position:relative;z-index:1;font:bold 27px "Trebuchet MS",Tahoma,sans-serif;letter-spacing:-1px;text-shadow:1px 2px #06396e}.logo span{color:#ffcb27}.slogan{margin-top:3px;color:#cfeaff;font-size:10px;letter-spacing:.08em}.version{position:absolute;right:16px;bottom:12px;z-index:2;padding:3px 7px;color:#d5eaff;background:#063669;border:1px solid #77b6ec}.nav{display:flex;min-height:29px;padding-left:12px;background:linear-gradient(#fdfdfd,#aebdce);border-top:1px solid #fff;border-bottom:1px solid #657b96}.nav a{display:block;padding:7px 9px 6px;color:#103a69;text-align:center;text-decoration:none;font-weight:bold;border-left:1px solid #fff;border-right:1px solid #91a2b6}.ticker{padding:5px 12px;color:#223b55;background:#fffbd0;border-bottom:1px solid #d0c881}.ticker b{color:#b21b10}.content{padding:8px}.panel{margin-bottom:8px;border:1px solid #7189a3;background:#f5f7fa}.panel-title{display:flex;justify-content:space-between;gap:8px;padding:5px 7px;color:#fff;font-weight:bold;background:linear-gradient(#609cd7,#28649f);border:1px solid #90c2ed;border-bottom-color:#0c3d70;text-shadow:1px 1px #184d80}.panel-body{padding:12px;border-top:1px solid #fff}.intro{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:12px}.intro h1{margin:0 0 8px;color:#174f8b;font:normal 25px Georgia,serif}.intro p{margin:7px 0;line-height:1.55}.terminal{padding:9px;color:#8cff69;background:#030603;border:2px inset #9da7ae;font:11px/1.65 "Courier New",monospace}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}.stat{padding:8px;text-align:center;background:#e7edf4;border:1px outset #fff}.stat strong{display:block;color:#174f8b;font:bold 22px "Courier New",monospace}.cards{display:grid;grid-template-columns:1fr 1fr;gap:8px}.card{display:block;min-height:160px;padding:12px;color:#122c49;text-decoration:none;background:linear-gradient(135deg,#fff,#dae6f3);border:1px solid #7f96af;box-shadow:inset 1px 1px #fff,inset -1px -1px #b1c0d0}.card:hover{border-color:#e66c12;background:linear-gradient(135deg,#fff9d8,#f4d995)}.card-icon{float:left;width:45px;height:45px;margin:0 10px 6px 0;text-align:center;color:#fff;background:linear-gradient(#70aee6,#1d5e9c);border:1px solid #174b7b;border-radius:5px;box-shadow:inset 1px 1px #b9dcfa;font:bold 22px/43px Tahoma}.card.orange .card-icon{background:linear-gradient(#ffb657,#d55a08);border-color:#a33e00}.card h2{margin:2px 0 5px;color:#15518d;font-size:15px;text-decoration:underline}.card p{clear:both;min-height:48px;margin:8px 0;color:#4a5968;line-height:1.45}.go,.button{display:inline-block;padding:4px 9px;color:#fff;font:bold 11px Tahoma,Verdana,sans-serif;text-decoration:none;background:linear-gradient(#6aa9e2,#195c9d);border:1px solid #0e3d6b;cursor:pointer}.button:hover,.go:hover{background:linear-gradient(#ef9a3b,#ce5908)}.button.secondary{color:#173e69;background:linear-gradient(#fff,#b9c9d9);border:1px outset #fff}.button.danger{background:linear-gradient(#f1a84d,#bf4d08);border-color:#963600}.subnav{display:flex;gap:5px;margin-bottom:8px;padding:7px;background:#c9d5e2;border:1px solid #8fa2b5}.subnav a{padding:4px 9px;color:#174f89;font-weight:bold;text-decoration:none;background:#eef4fa;border:1px outset #fff}.subnav a.active{color:#fff;background:linear-gradient(#5d9fe0,#1760a7);border-style:inset}.footer{display:flex;justify-content:space-between;padding:8px 12px;color:#d8e9fb;background:#173d68;border-top:1px solid #fff;font-size:9px}
.trainer-grid{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:8px}.toolbar{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:10px}.switch{display:flex;gap:3px}.switch button.active{color:#fff;background:linear-gradient(#5d9fe0,#1760a7);border-style:inset}.counter{color:#174f8b;font:bold 14px "Courier New",monospace}.progress{height:18px;padding:2px;background:#c0cad5;border:2px inset #e6edf4}.progress span{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,#1d70b8 0,#1d70b8 9px,#65aae1 9px,#65aae1 11px)}.prompt{min-height:210px;padding:35px 10px 24px;text-align:center}.prompt small{display:block;margin-bottom:12px;color:#667789}.prompt h1{margin:0;color:#174f8b;font:normal clamp(30px,6vw,54px) Georgia,serif}.answer label{display:block;margin-bottom:5px;color:#31465d;font-weight:bold}.answer input{width:100%;padding:9px;color:#111;background:#fff;border:2px inset #e1e7ed;font:16px Tahoma,Verdana,sans-serif}.actions{display:flex;gap:5px;margin-top:8px}.result{display:none;margin-top:9px;padding:9px;border:1px solid #7f96af;background:#eef4fa}.result.show{display:flex;justify-content:space-between;gap:10px;align-items:center}.result.correct{color:#126b18;background:#e8f7e7;border-color:#72a971}.result.wrong{color:#8d3400;background:#fff3d8;border-color:#d38a39}.result strong{font-size:14px}.difficult{margin:0;padding:0;list-style:none}.difficult li{display:flex;justify-content:space-between;gap:8px;padding:7px 2px;border-bottom:1px dotted #a9b5c3}.difficult span{color:#174f89;font-weight:bold}.difficult small{color:#667789;text-align:right}.empty{color:#667789;line-height:1.5}.finish{display:none;min-height:390px;padding:55px 20px;text-align:center}.finish.show{display:block}.finish strong{display:block;color:#174f8b;font:bold 72px "Courier New",monospace}.finish h2{color:#174f8b}
.grammar-grid{display:grid;grid-template-columns:225px minmax(0,1fr);gap:8px}.topic-list{margin:0;padding:0;list-style:none}.topic-list button{display:block;width:100%;padding:7px;text-align:left;color:#174f89;background:transparent;border:0;border-bottom:1px dotted #a9b5c3;font:bold 11px Tahoma,Verdana,sans-serif;cursor:pointer}.topic-list button:before{content:"› ";color:#f07816}.topic-list button:hover{color:#d34a00;background:#e7eef7}.topic-list button.active{color:#fff;background:linear-gradient(#5d9fe0,#1760a7)}.topic{display:none}.topic.active{display:block}.topic h1{margin:0 0 4px;color:#174f8b;font:normal 27px Georgia,serif}.topic .kicker{margin:0 0 14px;color:#d35d08;font-weight:bold}.topic .summary{padding:9px;color:#173e69;background:#fffbd0;border:1px solid #d0c881;line-height:1.55}.topic h2{margin:16px 0 6px;color:#173e69;font-size:12px}.rules{margin:0;padding:0;list-style:none}.rules li{padding:7px 5px 7px 17px;position:relative;border-top:1px dotted #a9b5c3;line-height:1.45}.rules li:before{position:absolute;left:3px;content:"›";color:#f07816;font-weight:bold}.example{display:grid;grid-template-columns:1.1fr 1fr;gap:8px;padding:8px;background:#e8eef5;border:1px solid #aebdca;border-bottom:0}.example:last-child{border-bottom:1px solid #aebdca}.example strong{color:#174f89}.example span{color:#667789}
@media(min-width:721px){.nav{display:grid;grid-template-columns:62px 85px 135px 168px 112px 92px 104px 54px;padding-left:12px}.nav a{padding:7px 5px 6px;white-space:nowrap}}@media(max-width:720px){.page{margin:4px auto;max-width:calc(100% - 8px)}.top{height:90px}.logo{font-size:22px}.version{display:none}.nav{display:grid;grid-template-columns:1fr 1fr;padding-left:0}.nav a{min-width:0;padding:7px 5px 6px;white-space:normal}.intro,.cards,.trainer-grid,.grammar-grid{grid-template-columns:1fr}.footer{flex-direction:column;gap:5px}.topic-list{display:grid;grid-template-columns:1fr 1fr}.prompt{min-height:170px}.stats{grid-template-columns:1fr}.subnav{flex-wrap:wrap}}@media(max-width:440px){.topic-list{grid-template-columns:1fr}.example{grid-template-columns:1fr}.actions,.result.show,.toolbar{align-items:stretch;flex-direction:column}}
