/* ================================
   COLORFUL MINIMAL THEME
================================ */
:root{
    --bg:#f5f8fc;
    --card:#ffffff;
    --ink:#25304a;
    --muted:#687086;
    --line:#dfe6ef;
    --purple:#6759e6;
    --purple-light:#efedff;
    --blue:#3ca7ec;
    --blue-light:#eaf7ff;
    --green:#48bb7d;
    --green-light:#eaf9f0;
    --yellow:#f2bd45;
    --yellow-light:#fff7dc;
    --pink:#df6da4;
    --pink-light:#fff0f7;
    --orange:#ef8754;
    --orange-light:#fff1e9;
    --red:#d85c68;
}

body{
    background:
        radial-gradient(circle at 5% 3%,rgba(60,167,236,.10),transparent 22%),
        radial-gradient(circle at 96% 4%,rgba(103,89,230,.09),transparent 24%),
        var(--bg);
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}

.sidebar{width:238px;min-width:238px;padding:23px 16px;background:#30345f;color:#fff;}
.brand{margin-bottom:24px;}
.brand-icon{width:45px;height:45px;border-radius:12px;background:#786bec;}
.brand small{color:#d7d9e9;}
.menu button{padding:12px;border-radius:10px;}
.menu button:hover{background:rgba(255,255,255,.10);}
.safe-box{border-radius:13px;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);}

.content{padding:27px;}
.hero{min-height:0;padding:34px;border:1px solid #dce7f1;border-radius:21px;box-shadow:0 8px 25px rgba(44,57,96,.06);}
.hero h2{font-size:40px;}
.hero-visual{min-height:185px;border-radius:17px;background:linear-gradient(145deg,#6759e6,#897cf0);}
.difficulty-button{border-width:1px;border-radius:10px;}
.difficulty-button.active{box-shadow:none;}

.section-title{margin:28px 0 14px;}
.grid{gap:14px;}
.card{min-height:190px;padding:18px;border-radius:16px;border:1px solid var(--line);border-top-width:4px;box-shadow:none;}
.card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(42,55,93,.07);}
.card-icon{width:44px;height:44px;border-radius:11px;}
.card:nth-child(6n+1) .card-icon{background:var(--blue-light);color:#1477b8;}
.card:nth-child(6n+2) .card-icon{background:var(--green-light);color:#21835a;}
.card:nth-child(6n+3) .card-icon{background:var(--yellow-light);color:#9a7012;}
.card:nth-child(6n+4) .card-icon{background:var(--pink-light);color:#ad3e73;}
.card:nth-child(6n+5) .card-icon{background:var(--orange-light);color:#b85426;}
.card:nth-child(6n+6) .card-icon{background:var(--purple-light);color:#5547ca;}
.card h3{margin:14px 0 6px;}
.card p{color:var(--muted);line-height:1.45;}
.card-bottom{margin-top:12px;}
.open-button{background:#fff;border:1px solid #cfd9e5;border-radius:9px;color:#37506d;}
.exercise-count{background:#f2f5f9;}

.exercise-card{padding:29px;border-radius:19px;box-shadow:0 7px 23px rgba(38,55,96,.05);}
.back,.secondary{border-radius:10px;}
.primary,.hero-button{background:#6759e6;border-radius:10px;box-shadow:none;}
.primary:hover,.hero-button:hover{background:#5748d7;}
.listen-button{border-radius:10px;background:var(--blue-light);border-color:#9ed6f4;color:#146b9d;}
.progress{height:8px;background:#e9eef5;}
.progress-bar{background:linear-gradient(90deg,#6759e6,#47a8eb);}
.answer-input{border-width:1px;border-radius:11px;}
.answer-input:focus{box-shadow:0 0 0 3px rgba(103,89,230,.13);}
.option,.match-word,.shape-option,.dccs-card{border-color:#d8e0ea;border-radius:14px;box-shadow:none;}
.feedback.correct{background:var(--green-light);color:#1e754f;}
.feedback.wrong{background:#fff0f2;color:#ab3e49;}
.break-box{border:1px solid #ecd991;background:#fffae9;color:#746323;}
.memory-card{background:linear-gradient(145deg,#6759e6,#8578ed);box-shadow:0 4px 11px rgba(70,58,160,.15);}
.memory-card.matched{box-shadow:0 0 0 3px var(--green);}
.corsi-board{background:#f2f7fb;border:1px solid #d8e5ef;border-radius:19px;}
.corsi-block{border-width:2px;border-radius:12px;background:#6759e6;box-shadow:none;}
.corsi-block.showing{background:#f2bd45;box-shadow:0 0 0 5px rgba(242,189,69,.24);}
.corsi-block.selected{background:#3ca7ec;}
.dccs-rule{background:var(--purple-light);color:#5142c3;}
.dccs-target{background:#f8faff;}
.dccs-phase span.active{background:var(--purple);}
.dccs-phase span.done{background:var(--green-light);color:#22774f;}
.finish-star{animation:none;}

