/* Õpistuudio: a sunlit learning desk, folded paper and playful type. */
:root{font:16px/1.65 'Segoe UI',system-ui,sans-serif;color:#253845;background:#fbf7ed;--ink:#253845;--muted:#607078;--line:#c9cec4;--paper:#fbf7ed;--mint:#dcebdc;--peach:#f4b87e;--violet:#d8cff0;--blue:#c8dee9}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 90% 10%,#f8e3c9,transparent 27%),#fbf7ed}button,input,textarea,select{font:inherit}a{color:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.4;cursor:default}:focus-visible{outline:3px solid #90532e;outline-offset:5px}[hidden]{display:none!important}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.1}p{color:var(--muted)}h1{font:500 clamp(44px,6.5vw,88px)/1.01 Georgia,serif;letter-spacing:-.055em}h1 em{font-weight:400;color:#98582e}h2{font:500 clamp(28px,3.1vw,42px)/1.1 Georgia,serif;letter-spacing:-.035em}h3{font-size:23px;letter-spacing:-.035em;font-weight:650}.eyebrow{font-size:10px;letter-spacing:.17em;font-weight:750;color:var(--ink);margin-bottom:20px}small,.small{font-size:12px;line-height:1.6;color:var(--muted)}
.studio-header{display:flex;justify-content:space-between;align-items:center;gap:25px;max-width:1320px;margin:auto;padding:24px 38px;border-bottom:1px solid var(--line)}.studio-brand{display:flex;gap:13px;align-items:center;text-decoration:none;font:600 23px Georgia,serif;letter-spacing:-.04em}.brand-symbol{display:inline-flex;width:43px;height:43px;align-items:center;justify-content:center;background:#f4b87e;border:1px solid #253845;border-radius:40% 60% 40% 60%;rotate:-8deg;font-size:29px}.studio-brand small{display:block;font:9px/1.8 'Segoe UI',sans-serif;letter-spacing:.13em}.studio-header nav{display:flex;gap:22px;align-items:center;flex-wrap:wrap;font-size:12px}.studio-header nav a{text-decoration:none}.studio-header nav a:hover{text-decoration:underline;text-underline-offset:5px}#admin-link{border:1px solid var(--line);border-radius:25px;padding:9px 15px}#logout{background:transparent;border:0;text-decoration:underline;color:var(--ink)}main{max-width:1244px;padding:0 38px;margin:auto}.studio-hero{display:flex;align-items:center;gap:5%;min-height:540px;padding:68px 0 55px}.hero-copy{flex:1 1 60%;min-width:0;z-index:1}.hero-copy h1{font-size:clamp(56px,7.6vw,103px);margin-bottom:24px}.hero-lead{max-width:560px;font-size:17px}.button{display:inline-flex;align-items:center;justify-content:center;gap:25px;padding:13px 20px;border:1px solid var(--ink);border-radius:4px 22px 4px 22px;text-decoration:none;font-size:13px;font-weight:650;transition:translate .2s,box-shadow .2s}.button:hover{translate:0 -3px;box-shadow:4px 5px 0 #d1a47c}.ink{color:#fff9ed;background:var(--ink)}.light{background:#fbf7ed;color:var(--ink)}.hero-caption{display:flex;flex-wrap:wrap;gap:16px;font-size:10px;color:var(--muted);margin-top:23px}.hero-caption span+span:before{content:'·';padding-right:16px}.learning-sculpture{position:relative;flex:1 1 35%;height:355px;isolation:isolate;pointer-events:none}.sheet{position:absolute;width:235px;height:250px;border:1px solid #708b86;border-radius:5px 40px 5px 5px;padding:24px;font-size:12px;letter-spacing:.13em;box-shadow:10px 18px 28px #334f4020}.sheet.back{background:#c9deeb;right:20%;top:0;rotate:-20deg}.sheet.middle{background:#cfe2c5;right:5%;top:35px;rotate:8deg}.sheet.middle span{display:block;font-size:100px;line-height:1.5}.sheet.front{background:#f5ba7e;right:10%;top:95px;rotate:-7deg;font:500 48px Georgia,serif;letter-spacing:-.04em}.sheet.front small{font:12px 'Segoe UI',sans-serif;letter-spacing:.04em;position:absolute;bottom:25px;color:#3d4b45}.sun{position:absolute;width:90px;height:90px;background:#a994c8;border-radius:50%;top:-10px;right:0;box-shadow:inset 3px 4px 0 #d8cdec;z-index:-1;animation:studio-drift 10s ease-in-out infinite alternate}.orbit-label{position:absolute;bottom:-15px;left:0;font:9px Consolas,monospace;letter-spacing:.15em;rotate:-90deg;transform-origin:left}
.mentor-note{position:relative;padding:30px 34px 30px 210px;margin:0 0 90px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#edf0e6}.mentor-note>.eyebrow{position:absolute;left:25px;top:38px;max-width:130px;line-height:1.8}.mentor-note h2{font-size:30px;margin-bottom:15px}.mentor-note h2 span{font:12px Consolas,monospace;color:#626e69;margin-left:20px;white-space:nowrap}.mentor-note p{max-width:800px;font-size:14px}.role-tags{display:flex;gap:10px;flex-wrap:wrap}.role-tags span{font-size:10px;border:1px solid #a3b4a3;border-radius:3px;padding:4px 9px;background:#f4f7ed}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:30px}.section-heading h2,.section-heading h1{margin-bottom:0}.section-heading .eyebrow{margin-bottom:12px}.text-button{background:transparent;border:0;padding:7px 0;border-bottom:1px solid var(--ink);font-size:12px;white-space:nowrap;color:var(--ink)}.direction-list{display:flex;align-items:flex-start;gap:25px;flex-wrap:wrap}.direction{flex:1 1 43%;padding:30px;border:1px solid #b9c6b9;border-radius:4px 35px 4px 4px;background:#e0ecd9;min-width:0}.direction:nth-child(2){flex-basis:46%;margin-top:38px;border-radius:35px 4px 4px 4px;background:#e4dcf0}.direction:nth-child(3){flex-basis:48%;background:#f5dfc4}.direction:nth-child(4){flex-basis:41%;margin-top:38px;background:#dbe8eb;border-radius:4px 4px 35px 4px}.direction-top{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.13em;margin-bottom:20px}.direction-mark{font:italic 43px Georgia,serif;letter-spacing:-.07em}.direction h3{max-width:390px;margin-bottom:15px;font:500 28px/1.1 Georgia,serif}.direction p{font-size:13px;min-height:64px;color:#4b5e62}.direction-actions{display:flex;gap:25px;align-items:center;justify-content:space-between;border-top:1px solid #71887955;padding-top:18px;font-size:11px}.direction-actions button{border:0;background:none;font-weight:700;color:#253845;padding:5px 0}.direction-actions button[aria-pressed=true]{text-decoration:underline;text-underline-offset:5px}.direction-actions a{color:#3f555d}.course-shelf{padding:85px 0 30px}.search-label{font-size:11px;min-width:220px}.search-label input{margin-top:6px}.shelf-summary{display:flex;justify-content:space-between;gap:15px;font-size:12px;color:var(--muted);padding:0 0 20px;border-bottom:1px solid var(--line);margin-bottom:28px}.course-list{display:flex;align-items:flex-start;flex-wrap:wrap;gap:28px}.course-card{flex:1 1 42%;max-width:calc(50% - 14px);border:1px solid #c7cbbd;border-radius:4px 30px 4px 4px;background:#fffdf6;overflow:hidden}.course-card:nth-child(even){margin-top:40px}.course-cover{height:185px;background:#dcebdc;position:relative;overflow:hidden;padding:22px}.course-cover:after{content:'';position:absolute;right:25px;bottom:-30px;width:155px;height:155px;border:1px solid #667d6c66;border-radius:50%;rotate:-20deg;box-shadow:25px -20px 0 #ffffff33}.course-e-ope .course-cover{background:#e3d9ed}.course-video-disain .course-cover{background:#f5d9b6}.course-ux-prototuup .course-cover{background:#cddfe6}.course-kicker{font-size:9px;letter-spacing:.13em}.course-mark{display:block;font:italic 67px/1.4 Georgia,serif;letter-spacing:-.065em;color:#39564b;rotate:-7deg;margin:8px 25px}.cover-tag{position:absolute;right:20px;bottom:17px;border:1px solid #849887;border-radius:25px;background:#ffffff88;padding:3px 10px;font-size:10px;z-index:1}.course-info{padding:26px}.course-info h3{font:500 30px/1.1 Georgia,serif}.course-info>p{font-size:13px;min-height:65px}.progress-copy{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin:18px 0 8px}.progress-copy b{font-size:14px}progress{width:100%;height:7px;display:block;border:0;border-radius:10px;overflow:hidden;background:#e6e9df;accent-color:#526d52}progress::-webkit-progress-bar{background:#e6e9df;border-radius:10px}progress::-webkit-progress-value{background:#526d52;border-radius:10px}progress::-moz-progress-bar{background:#526d52}.course-open{display:flex;justify-content:space-between;text-decoration:none;font-weight:650;font-size:12px;margin-top:26px;padding-top:17px;border-top:1px solid var(--line)}.course-open:hover{color:#9b542b}.course-open span{font-size:20px}.back-link{display:inline-block;font-size:12px;margin:35px 0 25px;text-decoration:none}.course-heading{display:flex;justify-content:space-between;align-items:center;gap:35px;padding:20px 0 35px}.course-heading>div:first-child{max-width:830px}.course-heading h1{font-size:clamp(40px,5.2vw,66px);margin-bottom:22px}.course-heading p{max-width:750px}.course-progress-stamp{flex:0 0 150px;width:150px;height:150px;border-radius:48% 52% 40% 60%;border:1px solid #97aa93;background:#dcebdc;display:flex;flex-direction:column;align-items:center;justify-content:center;rotate:7deg}.course-progress-stamp>b{font:500 50px Georgia,serif}.course-progress-stamp small{font:20px Georgia,serif;color:var(--ink)}.course-progress-stamp>span{font-size:8px;letter-spacing:.1em}.lesson-layout{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.9fr);gap:35px;align-items:start}.syllabus{background:#eaf0e4;border:1px solid #c3d0bc;border-radius:5px 25px 5px 5px;padding:25px;position:sticky;top:20px}.syllabus h2{font-size:23px}.syllabus ol{list-style:none;margin:25px 0;padding:0}.syllabus li{display:flex;gap:10px;align-items:flex-start;padding:14px 8px;border-top:1px solid #b6c6ae}.syllabus li.is-active{background:#fdfaf0;margin:0 -10px;padding-inline:18px;box-shadow:4px 4px 0 #d2dfc9}.syllabus input{margin-top:6px;accent-color:#426447;width:15px;height:15px;flex-shrink:0}.syllabus button{border:0;background:none;text-align:left;padding:0;color:var(--ink);font-size:13px;font-weight:600;line-height:1.5}.syllabus button small{display:block;font:10px Consolas,monospace;color:#6a7e62;margin-bottom:5px}.lesson-paper{background:#fffdf7;border:1px solid #d1d2c5;box-shadow:10px 12px 0 #e9e7db;padding:38px;border-radius:3px 35px 3px 3px;min-width:0}.lesson-paper h2{font-size:35px}.lesson-body{white-space:pre-wrap;color:#4a5c63;font-size:17px}.exercise{background:#f7e4cb;padding:22px;border-left:3px solid #cf9563;margin:28px 0;border-radius:0 20px 0 0}.exercise-label{font-size:9px;letter-spacing:.14em;font-weight:700}.exercise p{font-size:14px;color:#6b523f;white-space:pre-wrap;margin:12px 0 0}label{display:block;font-size:12px;color:var(--ink);margin-bottom:7px}input:not([type=checkbox]),textarea,select{display:block;width:100%;min-width:0;border:1px solid #b7c4b7;padding:11px 13px;background:#fffefa;color:var(--ink);border-radius:5px;outline-offset:3px}textarea{resize:vertical;line-height:1.6}input:focus,textarea:focus,select:focus{border-color:#7d6648}.lesson-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:24px}.source-note{font-size:11px;margin-top:28px;border-top:1px solid var(--line);padding-top:18px}.completion{margin-top:25px;padding:22px;background:#deebd6;border-radius:4px 25px 4px 4px}.completion p{font-size:13px;margin:8px 0 0}.login-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center;padding:35px 0 60px}.login-layout h1{font-size:68px}.paper-panel{padding:34px;background:#fffdf7;border:1px solid #c7cbbd;box-shadow:9px 10px 0 #e7e2d4;border-radius:4px 30px 4px 4px}.paper-panel input,.paper-panel textarea,.paper-panel select{margin-bottom:20px}.demo-note{background:#eae5f0;padding:24px;border:1px solid #c6bad5;border-radius:20px 3px 20px 3px;max-width:510px}.demo-note p{margin:10px 0;font-size:14px}.demo-note code{color:#4b3d68;font-weight:bold}.demo-note small{display:block;color:#645770}#login-error,#editor-error{color:#943c26;font-size:13px}#admin-view .section-heading h1{font-size:68px}.admin-intro{max-width:680px}.admin-courses{margin:30px 0}.admin-courses article{display:flex;justify-content:space-between;gap:25px;align-items:center;border-top:1px solid var(--line);padding:25px 0}.admin-courses h3{font:500 25px Georgia,serif;margin:9px 0 0}.admin-courses .eyebrow{font-size:9px}.form-pair{display:grid;grid-template-columns:1fr 1fr;gap:25px}.topic-heading{margin-top:35px}.topic-heading h3{margin-bottom:0}.topic-edit{min-width:0;margin:25px 0;padding:24px;border:1px solid #c3cdbb;background:#f5f6ef}.topic-edit legend{font:11px Consolas,monospace;letter-spacing:.12em;padding:0 9px}.topic-tools{display:flex;justify-content:flex-end;gap:8px;margin:0 0 18px}.topic-tools button{border:1px solid #b3c0a9;background:#edf0e4;padding:5px 12px;color:var(--ink);font-size:11px}.empty-state{padding:45px;background:#f0e9dc;border:1px dashed #aaa88c;width:100%}.empty-state button{background:var(--ink);color:white;padding:10px 15px;border:0}#lms-status{font-size:13px;color:#4c6442;min-height:22px;margin:30px 0}footer{max-width:1244px;margin:35px auto 0;padding:30px 38px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:30px}footer p{font-size:10px;margin:0}footer>span{font-size:9px;letter-spacing:.14em}.footer-brand{font:italic 25px Georgia,serif;text-decoration:none}
@keyframes studio-drift{to{translate:8px 15px;rotate:15deg}}
@media(max-width:900px){.studio-header{padding:22px}.studio-header nav{gap:12px}main{padding:0 22px}.studio-hero{gap:15px}.learning-sculpture{scale:.8;transform-origin:right center;flex-basis:32%}.mentor-note{padding-left:30px}.mentor-note>.eyebrow{position:static;max-width:none}.lesson-layout{grid-template-columns:1fr}.syllabus{position:static}.syllabus ol{display:flex;flex-wrap:wrap;gap:10px}.syllabus li{flex:1 1 200px}.syllabus li.is-active{margin:0;padding-inline:8px}.login-layout{gap:30px}.login-layout h1{font-size:52px}}
@media(max-width:620px){.studio-header{align-items:flex-start;flex-direction:column;gap:18px;padding:20px}.studio-header nav{width:100%;justify-content:space-between;gap:8px;font-size:11px}#admin-link{padding:6px 9px}main{padding:0 20px}.studio-hero{display:block;padding:40px 0}.hero-copy h1{font-size:65px}.hero-lead{font-size:15px}.learning-sculpture{height:260px;width:100%;scale:1;margin-top:45px}.sheet{width:190px;height:190px}.sheet.front{top:60px;font-size:40px;right:14%}.sheet.middle{top:20px;right:8%}.sheet.back{right:30%}.sheet.middle span{font-size:70px}.sun{right:0;width:65px;height:65px}.orbit-label{rotate:0;bottom:0;font-size:8px}.hero-caption{gap:10px;font-size:9px}.hero-caption span+span:before{padding-right:10px}.mentor-note{padding:25px;margin-bottom:55px}.mentor-note h2 span{display:block;margin:12px 0}.section-heading{align-items:flex-start;flex-direction:column;gap:20px}.direction:nth-child(n){flex-basis:100%;margin:0;padding:25px}.direction h3{font-size:27px}.direction p{min-height:0}.course-shelf{padding-top:55px}.search-label{width:100%}.course-card:nth-child(n){flex-basis:100%;max-width:none;margin:0}.course-info{padding:24px}.shelf-summary{flex-direction:column;gap:4px}.course-heading{align-items:flex-start;gap:20px;flex-direction:column;padding-top:0}.course-progress-stamp{width:100px;height:100px;flex-basis:100px;align-self:flex-end;margin-top:-20px}.course-progress-stamp>b{font-size:35px}.course-progress-stamp>span{font-size:7px}.lesson-paper{padding:25px;box-shadow:6px 7px 0 #e9e7db}.lesson-paper h2{font-size:30px}.lesson-layout{gap:25px}.syllabus{padding:22px}.syllabus li{flex-basis:100%}.lesson-body{font-size:16px}.lesson-actions .button{width:100%}.login-layout{display:block;padding-top:10px}.login-layout h1{font-size:52px}.login-layout .paper-panel{margin-top:30px}.paper-panel{padding:24px}.form-pair{grid-template-columns:1fr;gap:0}.topic-edit{padding:17px}.admin-courses article{align-items:flex-start;flex-direction:column;gap:15px}#admin-view .section-heading h1{font-size:52px}.topic-tools{gap:5px;flex-wrap:wrap}.topic-tools button{padding:5px 9px}.course-heading h1{overflow-wrap:anywhere}footer{padding:25px 20px;align-items:flex-start;flex-direction:column;gap:15px}footer>span{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.sheet.front small{left:24px;right:20px}
