@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{--ink:#243b35;--muted:#76817a;--paper:#f8f8f2;--green:#285b46}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px 'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #cda65e;outline-offset:4px}header{max-width:1220px;margin:auto;padding:28px 36px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dfe4dc}.brand{display:flex;align-items:center;gap:10px;font-size:32px;color:var(--ink);text-decoration:none}.brand span{font-size:22px;font-weight:700;letter-spacing:-1px}.brand .light{font-weight:400}.tag,.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700}header button,footer button{border:0;background:none;color:var(--ink);font-size:12px}main{max-width:1148px;margin:auto;padding:0 20px}.intro{display:flex;justify-content:space-between;align-items:center;padding:58px 0 44px}.eyebrow{color:#688274}h1{font:500 58px/1.12 'Playfair Display',Georgia,serif;letter-spacing:-2px;margin:20px 0}h1 em{color:#65816c;font-weight:500}.intro p{color:var(--muted);line-height:1.8}.art{width:340px;height:250px;position:relative;display:grid;place-items:center;background:repeating-linear-gradient(0deg,transparent 0 22px,#d9e0d6 23px 24px,transparent 25px 37px);border-radius:50%}.art>span{font:180px Georgia;color:#496e59;transform:rotate(-12deg)}.art i{position:absolute;right:20px;top:15px;font:70px Georgia;color:#bc9f6b}.art b{position:absolute;left:30px;bottom:40px;font:65px Georgia;color:#7c9581}.art small{position:absolute;bottom:-14px;font-size:9px;letter-spacing:3px}.orbit{position:absolute;border:1px solid #d6ddcf;width:230px;height:230px;border-radius:50%}.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #dfe4da;border-radius:13px;background:#fffefa;padding:24px 5px}.stat{padding:0 25px;border-right:1px solid #e2e6de}.stat:last-child{border:0}.stat strong{font-size:25px;margin-right:8px}.stat span{font-size:12px;color:var(--muted)}.sectionhead{display:flex;align-items:end;justify-content:space-between;margin:44px 0 22px}h2{font:500 29px 'Playfair Display',Georgia,serif;margin:8px 0}.sectionhead>span{font-size:12px;color:var(--muted)}.sectionhead i{padding:0 10px}#cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{position:relative;text-align:left;border:1px solid #dce2d8;border-radius:14px;background:#fffefa;padding:25px;transition:.2s;color:var(--ink);min-height:234px}.card:hover{transform:translateY(-4px);box-shadow:0 10px 25px #233b3510;border-color:#8da590}.card.active{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}.icon{display:grid;place-items:center;width:45px;height:45px;border-radius:12px;background:var(--tint);font:27px Georgia;margin-bottom:20px}.number{position:absolute;right:25px;top:28px;color:#a5afa4;font-size:11px}.card h3{font:500 23px 'Playfair Display',Georgia;margin:0 0 8px}.card p{font-size:12px;color:var(--muted);min-height:30px;line-height:1.6}.cardbottom{display:flex;justify-content:space-between;font-size:11px;margin-top:20px}.bar{height:3px;background:#e9ece4;border-radius:4px;margin-top:12px;overflow:hidden}.bar div{background:var(--green);height:100%}.card:last-child{background:#edf1e7}#quiz{margin-top:30px;background:#fffefa;border:1px solid #dce2d8;border-radius:18px;padding:36px;scroll-margin-top:25px}.qtop{display:flex;justify-content:space-between;gap:15px;color:var(--muted);font-size:12px}.question{font:500 28px/1.4 'Playfair Display',Georgia;margin:26px 0}.options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.option{padding:17px;border:1px solid #dbe0d6;border-radius:9px;text-align:left;background:white;color:var(--ink)}.option:hover:enabled{background:#f0f4ed}.option.correct{background:#e1efe4;border-color:#519368}.option.wrong{background:#f8e4df;border-color:#c87b69}.option:disabled{color:var(--ink);cursor:default}.feedback{line-height:1.7;padding:18px;margin-top:18px;border-radius:9px;background:#f0f2e9}.actions{display:flex;gap:12px;justify-content:flex-end;margin-top:22px}.primary,.secondary{padding:12px 20px;border-radius:8px;border:1px solid #cbd6c8;background:transparent;color:var(--ink)}.primary{background:var(--green);color:white;border-color:var(--green)}footer{display:flex;justify-content:space-between;align-items:center;color:#8b968b;font-size:11px;margin-top:55px;border-top:1px solid #dfe4dc;padding:26px 0 32px}dialog{border:1px solid #dce2d8;border-radius:18px;padding:35px;max-width:550px;color:var(--ink);background:var(--paper);line-height:1.8}dialog::backdrop{background:#243b3577}.close{float:right;border:0;background:none}.staff{width:100%;max-width:430px;height:170px;display:block;margin:0 auto}.notehint{color:var(--muted);font-size:12px}button:disabled{opacity:1}@media(max-width:750px){header{padding:20px}.tag{display:none}.intro{padding-top:30px}.art{display:none}h1{font-size:45px}.stats{grid-template-columns:1fr 1fr;gap:20px}.stat:nth-child(2){border:0}#cards{grid-template-columns:1fr 1fr}.card{padding:20px}.sectionhead{align-items:center}.sectionhead>span{display:none}#quiz{padding:22px}.options{grid-template-columns:1fr}.question{font-size:24px}}@media(max-width:450px){#cards{grid-template-columns:1fr}.card{min-height:200px}.stat{padding:0 13px}.stat strong{font-size:22px}footer>span:nth-child(2){display:none}}
.score-scroll{overflow-x:auto;border:1px solid #e0e6da;border-radius:10px;background:#fff;margin:12px 0 23px;overscroll-behavior-x:contain}.score{min-width:760px}.score svg{display:block;width:100%;height:auto}.score:has(svg[aria-label="Oktavı sorulan nota"]){min-width:310px;max-width:580px;margin:auto}.score-label{font-size:10px;letter-spacing:1.5px;color:#688274;font-weight:700;margin-top:24px}.editor-svg{cursor:crosshair;touch-action:pan-x}.editor-tools{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:15px 0}.editor-tools label,.relative-fields label{display:flex;flex-direction:column;gap:8px;font-size:12px;color:#526859}select{font:inherit;color:var(--ink);border:1px solid #c9d5c6;padding:10px;border-radius:7px;background:#fff;min-height:42px}select:focus-visible{outline:3px solid #cda65e}.editor-tools button{font-size:12px;min-height:42px;padding:10px}.relative-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:25px 0}.relative-fields select{width:100%}.optionletter{color:#8b978b;margin-right:14px}.pitch-results{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}.pitch-result{padding:7px 10px;font-size:12px;border-radius:6px}.pitch-result.ok{background:#e1efe4}.pitch-result.bad{background:#f8e4df}#editorStatus{min-height:24px}dialog{max-height:85vh;overflow:auto}dialog a{color:#285b46}@media(max-width:750px){.relative-fields{grid-template-columns:1fr}.editor-tools label{flex:1;min-width:125px}.score{min-width:760px}.score-label{line-height:1.7}#quiz{padding:20px 16px}.question{font-size:24px}}

.developer-credit{text-align:center;color:var(--muted);font-size:12px;line-height:1.6;margin:0;padding:0 12px 28px}
