.view{padding:var(--sp-4);display:grid;gap:var(--sp-4);align-content:start}
.eyebrow{font-size:var(--fs-xs);font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--purple-dark)}
.subtext,.muted{color:var(--muted)}
.micro,.note{font-size:var(--fs-xs);color:var(--muted)}
.note{padding:0 4px}
.block{display:block;color:var(--muted);font-weight:500}
.accent{color:var(--purple)}
.row{display:flex;gap:var(--sp-2)}
.stack{display:grid;gap:var(--sp-2)}
.chips{display:flex;gap:var(--sp-2);justify-content:center;flex-wrap:wrap;margin-top:var(--sp-3)}
.plain-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-3)}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:var(--sp-3);margin-top:var(--sp-2)}
.section-head p{color:var(--muted);font-size:var(--fs-s)}
.back-link{display:inline-flex;align-items:center;gap:6px;min-height:var(--tap);color:var(--purple-dark);font-weight:800;text-decoration:none}
.list-title{margin-top:var(--sp-2)}
.empty-note{padding:var(--sp-4);text-align:center;color:var(--muted);background:#fff;border:2px dashed var(--line);border-radius:var(--r-m)}
.done-note{display:flex;align-items:center;gap:8px;color:var(--ok);font-weight:800}
.pager{display:flex;justify-content:space-between;gap:var(--sp-2)}

/* Home */
.hero{display:grid;grid-template-columns:1fr 110px;gap:var(--sp-3);align-items:center;padding:var(--sp-5) var(--sp-4);border-radius:var(--r-l);
  background:linear-gradient(135deg,#efecff,#e3faf5);border:1px solid #fff;box-shadow:var(--shadow)}
.hero-copy{display:grid;gap:var(--sp-3);justify-items:start}
.hero-copy p:not(.eyebrow){color:var(--muted)}
.hero-art svg{width:100%;height:auto}
.name-card .row .input{flex:1}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2)}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:var(--sp-3);display:grid;gap:4px;align-content:start;box-shadow:var(--shadow)}
.stat strong{font-size:1.5rem;line-height:1}.stat small{font-size:var(--fs-s);color:var(--muted);font-weight:700}
.stat-label{font-size:var(--fs-xs);font-weight:800;color:var(--muted)}
.stat-icon{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--purple-soft);color:var(--purple-dark)}
.stat-icon.gold{background:var(--gold-soft);color:var(--gold)}
.stats.compact .stat{text-align:center}
.daily{display:grid;gap:var(--sp-2);justify-items:start}
.daily-top{display:flex;gap:var(--sp-3);align-items:center}
.continue-card{display:flex;align-items:center;gap:var(--sp-3);text-decoration:none;color:inherit}
.continue-copy{display:grid;gap:4px;flex:1;min-width:0}
.continue-copy span:not(.progress){font-size:var(--fs-s);color:var(--muted)}
.round-arrow{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--purple);color:#fff;flex:none}

/* Corsi */
.course-list{display:grid;gap:var(--sp-3)}
.course-card{display:flex;gap:var(--sp-3);text-decoration:none;color:inherit;align-items:flex-start}
.course-card:hover,.row-link:hover{border-color:var(--purple)}
.course-art{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;flex:none;background:var(--purple-soft);color:var(--purple-dark)}
.course-art .icon{width:28px;height:28px}
.course-art.mint{background:var(--mint-soft);color:var(--mint)}.course-art.gold{background:var(--gold-soft);color:var(--gold)}
.course-art.big{width:68px;height:68px}
.course-main{display:grid;gap:6px;min-width:0;flex:1}
.course-meta{display:flex;gap:6px;flex-wrap:wrap}
.course-head{display:flex;gap:var(--sp-3);align-items:center}
.search{position:relative}
.search .icon{position:absolute;left:14px;top:12px;color:var(--muted);pointer-events:none}
.search .input{padding-left:42px}
.filter-row{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.filter{min-height:var(--tap);padding:0 16px;border-radius:30px;border:2px solid var(--line);background:#fff;font-weight:800;color:var(--muted)}
.filter[aria-pressed="true"]{background:var(--purple);border-color:var(--purple);color:#fff}
.row-link{display:flex;align-items:center;gap:var(--sp-3);text-decoration:none;color:inherit}
.row-link>span:nth-child(2){flex:1;display:grid;gap:2px}
.row-link small{color:var(--muted)}
.check{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#eef0f8;color:var(--muted);font-weight:800;flex:none}
.check.on{background:var(--ok-soft);color:var(--ok)}
.prose{display:grid;gap:var(--sp-3);font-size:1.0625rem;line-height:1.65}
.key-card{background:var(--gold-soft);border-color:#f1d58b}
.key-card h2{display:flex;gap:8px;align-items:center;font-size:var(--fs-m);color:var(--gold);margin-bottom:var(--sp-2)}
.key-card ul{margin:0;padding-left:20px;display:grid;gap:6px}

/* Missioni */
.quiz-card{display:grid;gap:var(--sp-3)}
.quiz-top{display:flex;justify-content:space-between;align-items:center;font-size:var(--fs-xs);font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.fake-message{border:2px dashed #cfd3ec;border-radius:var(--r-m);padding:var(--sp-3);background:#fafbff;display:grid;gap:var(--sp-2)}
.fake-message .sender{display:flex;gap:10px;align-items:center;font-weight:800}
.fake-message .sender small{display:block;color:var(--muted);font-weight:500}
.fake-message>small{color:var(--muted)}
.answer-list{display:grid;gap:var(--sp-2)}
.answer-option,.spot-item{display:flex;gap:var(--sp-3);align-items:center;text-align:left;width:100%;min-height:var(--tap);padding:12px 14px;border-radius:var(--r-m);border:2px solid var(--line);background:#fff;font-weight:700}
.answer-option .icon{margin-left:auto}
.letter{width:30px;height:30px;border-radius:10px;background:#eef0f8;display:grid;place-items:center;font-weight:900;flex:none;font-size:var(--fs-s)}
.answer-option.selected,.spot-item.selected{border-color:var(--purple);background:var(--purple-soft)}
.answer-option.correct,.spot-item.correct,.order-item.correct{border-color:var(--ok);background:var(--ok-soft)}
.answer-option.wrong,.spot-item.wrong,.order-item.wrong{border-color:var(--rose);background:var(--rose-soft)}
.spot-item.missed{border-color:var(--warn);background:var(--warn-soft);border-style:dashed}
.spot-why{font-size:var(--fs-s);color:var(--muted);padding:6px 4px 0}
.feedback{padding:var(--sp-3);border-radius:var(--r-m);background:var(--ok-soft);color:#064e42}
.feedback.warn{background:var(--warn-soft);color:#5c3100}
.quiz-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.order-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-2)}
.order-item{display:flex;gap:var(--sp-3);align-items:center;padding:10px 12px;border:2px solid var(--line);border-radius:var(--r-m);background:#fff}
.order-text{flex:1;font-weight:700}
.order-btns{display:flex;gap:4px}
.icon-btn{width:var(--tap);height:var(--tap);border-radius:12px;border:0;background:var(--purple-soft);color:var(--purple-dark);display:grid;place-items:center}
.icon-btn:disabled{opacity:.35}
.result{text-align:center;justify-items:center}
.result-icon{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:var(--warn-soft);color:var(--warn)}
.result-icon.ok{background:var(--ok-soft);color:var(--ok)}.result-icon .icon{width:36px;height:36px}
.result-score{font-size:2.5rem;font-weight:900;color:var(--purple-dark);line-height:1}
.result .stack{width:100%}

/* Tutor */
.tutor-head{display:grid;justify-items:center;text-align:center;gap:var(--sp-2)}
.tutor-orb{width:120px}
.tutor-bot{width:100%;height:auto;display:block}
.bot-float{animation:float 3.2s ease-in-out infinite;transform-origin:center}
.bot-eyes{animation:blink 5s infinite;transform-origin:50px 47px}
.bot-antenna{animation:pulse 2s infinite}
.tutor-bot.thinking .bot-float{animation:float 1s ease-in-out infinite}
.tutor-bot.happy .bot-float{animation:hop 1.1s ease-out 1}
@keyframes float{50%{transform:translateY(-4px)}}
@keyframes blink{0%,94%,100%{transform:scaleY(1)}97%{transform:scaleY(.1)}}
@keyframes pulse{50%{opacity:.35}}
@keyframes hop{30%{transform:translateY(-10px)}60%{transform:translateY(0)}80%{transform:translateY(-3px)}}
.chat-card{display:grid;gap:var(--sp-3)}
.chat-log{display:grid;gap:var(--sp-2);max-height:48vh;min-height:140px;overflow:auto;padding:2px}
.bubble{max-width:88%;padding:10px 14px;border-radius:18px;line-height:1.45;display:grid;gap:6px;overflow-wrap:anywhere}
.bubble.bot{background:var(--purple-soft);border-bottom-left-radius:6px;justify-self:start}
.bubble.user{background:var(--purple);color:#fff;border-bottom-right-radius:6px;justify-self:end}
.bubble-link{color:var(--purple-dark);font-weight:800}
.bubble.typing{display:flex;gap:5px;align-items:center}.bubble.typing[hidden]{display:none}
.typing i{width:8px;height:8px;border-radius:50%;background:var(--purple);animation:pulse 1s infinite}
.typing i:nth-child(3){animation-delay:.3s}.typing i:nth-child(4){animation-delay:.6s}
.chat-compose{display:flex;gap:var(--sp-2)}.chat-compose .input{flex:1}
.suggestions{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.suggestion{min-height:var(--tap);padding:0 14px;border-radius:30px;border:1px solid var(--line);background:#fff;font-weight:700;font-size:var(--fs-s)}

/* Profilo */
.profile-hero{text-align:center;display:grid;justify-items:center;gap:4px;background:linear-gradient(135deg,#efecff,#e3faf5)}
.profile-big svg{width:104px;height:104px;border-radius:50%;border:4px solid #fff;box-shadow:var(--shadow)}
.level-bar{display:flex;gap:var(--sp-3);align-items:center}
.level-copy{flex:1;display:grid;gap:6px}.level-copy p{color:var(--muted);font-size:var(--fs-s)}
.level-medal{width:44px;height:44px;border-radius:14px;background:var(--gold-soft);color:var(--gold);display:grid;place-items:center;flex:none}
.badge-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:var(--sp-2)}
.badge-item{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);padding:var(--sp-3);display:grid;gap:4px;justify-items:center;text-align:center}
.badge-item small{color:var(--muted)}
.badge-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--gold-soft);color:var(--gold)}
.badge-item.locked{background:#f3f4fa}.badge-item.locked .badge-icon{background:#e3e5f0;color:#6a7090}
.avatar-editor{display:grid;gap:var(--sp-3)}
fieldset{border:0;margin:0;padding:0;display:grid;gap:6px}legend{font-weight:800;font-size:var(--fs-s);padding:0;margin-bottom:6px}
.opt-row{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.opt{min-width:var(--tap);min-height:var(--tap);padding:0 12px;border-radius:14px;border:2px solid var(--line);background:#fff;font-weight:700;display:grid;place-items:center}
.opt.swatch{border-radius:50%;background:var(--c);padding:0;color:#1d2347}
.opt[aria-pressed="true"]{border-color:var(--purple);box-shadow:0 0 0 3px rgba(90,73,224,.3)}
.list-card{padding:0;overflow:hidden}
.setting-row{display:flex;align-items:center;gap:var(--sp-3);width:100%;min-height:56px;padding:0 var(--sp-4);border:0;border-bottom:1px solid var(--line);background:#fff;text-align:left}
.setting-row b{flex:1}.setting-row:last-child{border-bottom:0}
.file-btn{cursor:pointer}
.file-btn:focus-within,input[type=file]:focus-visible+*{outline:3px solid var(--purple)}
.modal-icon{width:52px;height:52px;border-radius:16px;background:var(--purple-soft);color:var(--purple-dark);display:grid;place-items:center}
@media (max-width:360px){.hero{grid-template-columns:1fr}.hero-art{display:none}.stats{grid-template-columns:1fr 1fr}}
