*{box-sizing:border-box}body{margin:0;padding:36px 20px;background:#f4f4ef;color:#202126;font:16px/1.55 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}.card{max-width:920px;margin:auto;padding:36px;background:#fff;border:1px solid #e1e2e6;border-radius:22px;box-shadow:0 8px 30px #20212606}h1{font-size:30px;margin:0}h2{font-size:25px;line-height:1.25;margin:22px 0 16px}h3{margin:0 0 8px}.brand{display:flex;align-items:center;gap:18px;margin-bottom:24px}.brand img{width:64px;height:76px;object-fit:contain}.brand p{margin:3px 0;color:#60636b}.home{margin-left:auto;color:#4059c8}.muted,footer{color:#60636b;font-size:14px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}label{display:block;font-weight:650;margin:16px 0 6px}input,select,textarea{width:100%;border:1.5px solid #d7dce3;border-radius:10px;padding:12px;font:inherit;background:#fff;color:#202126}textarea{resize:vertical}button,.back-link{font:600 14px/1.4 inherit;border:1px solid #ccd4e5;border-radius:10px;background:#eef2fb;color:#263c6e;padding:11px 15px;min-height:44px;cursor:pointer;margin:8px 7px 8px 0}button:hover{filter:brightness(.97)}button:disabled{opacity:.55;cursor:wait}.primary{background:#286954;border-color:#286954;color:#fff}.finish{display:block;background:transparent;color:#60636b;border-color:#ddd;margin-top:24px}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #dc9f32;outline-offset:3px}[hidden]{display:none!important}.status{color:#286954}.status:empty,#export-status:empty{display:none}#error{background:#fff0e9;border-left:4px solid #b64c25;padding:14px}.eyebrow{text-transform:uppercase;font-size:12px;letter-spacing:.08em;color:#60636b}.steps{display:flex;gap:8px;flex-wrap:wrap;padding:0;list-style:none;font-size:13px}.steps li{background:#f0f2f6;border-radius:20px;padding:6px 13px}.steps [aria-current]{background:#dceddf;color:#1c563c;font-weight:700}.map-toolbar{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}.map-toolbar button{font-size:13px}.map{background:#fbfaf7;border-radius:18px;padding:20px;margin:12px 0 24px;overflow-wrap:anywhere}.node{--tone:#2768c6;--fill:#eaf3ff;text-align:center;background:var(--fill);border:3px solid var(--tone);border-radius:20px;padding:18px 14px;min-width:0;position:relative}.node.root{--tone:#198351;--fill:#e8f6df;border-width:5px;border-radius:34px;max-width:370px;margin:auto}.node h3{font:750 23px/1.18 'Trebuchet MS','Segoe UI',sans-serif;margin:9px 0 13px}.node.root h3{font-size:29px}.node .symbol{display:block;font-size:31px;line-height:1.1}.node ul{list-style:none;display:table;text-align:left;padding:0;margin:12px auto 0}.node li{position:relative;padding-left:19px;margin:6px 0;font-size:15px}.node li:before{content:'';position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--tone)}.children{display:flex;align-items:flex-start;justify-content:center;gap:20px;margin-top:22px}.branch{flex:1;min-width:0;position:relative;padding-top:18px;border-top:4px solid var(--tone,#2768c6);border-radius:15px 15px 0 0}.branch:before{content:'↓';position:absolute;top:-9px;left:calc(50% - 8px);font-size:23px;color:var(--tone,#2768c6);background:#fbfaf7;line-height:25px}.branch .children{display:block}.branch .branch{margin-top:18px}.map.sequence .children{display:block;max-width:460px;margin:22px auto 0}.node.depth-2{border-width:2px}.node.depth-2 h3{font-size:20px}.node input{max-width:100%;font-weight:700;border:2px dashed var(--tone);background:white}.node .blank-label{font-size:12px;margin:8px 0}.node.incorrect{outline:3px solid #bc6032;outline-offset:4px}.hints{list-style:none;padding:18px;background:#f7f8fb;border-radius:16px}.hints li{display:flex;gap:12px;margin:12px 0}.hint-icon{flex:0 0 38px;align-self:flex-start;text-align:center;padding:5px;background:#e5eefb;border-radius:12px;font-size:23px}.hints strong{font-family:Arial,sans-serif;font-weight:800;background:#e5eaf2;padding:1px 3px;border-radius:4px}.answer-title{font-size:19px}.counter-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:14px;margin:12px 0}output{font-weight:700;font-variant-numeric:tabular-nums}.feedback{padding:18px;background:#f1f6ef;border-left:4px solid #59825d;border-radius:12px;margin:20px 0}.feedback p{margin:8px 0}.result{border-bottom:1px solid #ddd;padding:18px 0}.result summary{cursor:pointer;font-weight:650}footer{border-top:1px solid #e1e2e6;padding-top:16px;margin-top:28px;display:flex;gap:8px;flex-direction:column;font-size:12px}.back-link{display:inline-block;text-decoration:none}#draft-status:empty{display:none}
.map.stacked .children{flex-direction:column}.map.stacked .branch{width:100%}
@media(max-width:600px){body{padding:12px}.card{padding:20px 16px}.brand{gap:12px}.brand img{width:48px;height:58px}.brand p{font-size:13px}.home{font-size:13px}.fields{grid-template-columns:1fr}.children{flex-direction:column;gap:18px}.branch{width:100%}.map{padding:16px 12px}.node h3{font-size:23px}.node.root h3{font-size:27px}.map-toolbar{justify-content:flex-start}.steps{gap:4px}.steps li{padding:5px 10px}}

/* Promemoria didattico, senza interazione o aspetto da pulsante. */
.notebook-hint{display:flex;align-items:center;gap:14px;width:100%;margin:18px 0;padding:16px 18px;border:1px solid #e8c16a;border-left:6px solid #a65c0b;border-radius:0 16px 16px 0;background:#fff5d9;color:#543407;font-family:'Segoe UI',Arial,sans-serif;font-size:clamp(18px,2.5vw,22px);font-weight:800;line-height:1.35;cursor:default;overflow-wrap:anywhere}
.notebook-hint::before{content:'';display:block;flex:0 0 44px;width:44px;height:48px;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 48'%3E%3Crect x='8' y='3' width='32' height='42' rx='5' fill='%23fff' stroke='%23804b0b' stroke-width='2.5'/%3E%3Cpath d='M16 4v40M5 12h7M5 22h7M5 32h7' fill='none' stroke='%23804b0b' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M22 15h11M22 23h11M22 31h7' stroke='%23b77013' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E")}
@media(max-width:600px){.notebook-hint{padding:13px 12px;gap:12px}.notebook-hint::before{flex-basis:38px;width:38px;height:42px}}