@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Serif+Display:wght@600&display=swap";:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#0f172a;background-color:#f1f5f9;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.5}body{background:radial-gradient(circle at 20% 20%,#3b82f61f,#0000 60%),radial-gradient(circle at 80% 0,#6366f126,#0000 65%),linear-gradient(165deg,#e0f2fe 0%,#f8fafc 45%,#f1f5f9 100%);min-width:320px;min-height:100vh;margin:0}a{color:inherit;text-decoration:none}#root{box-sizing:border-box;justify-content:center;align-items:stretch;min-height:100vh;margin:0;padding:clamp(1rem,4vw,3rem);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:flex}.app-shell{flex:1;justify-content:center;align-items:stretch;width:100%;display:flex}.app-card{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffffeb;border:1px solid #ffffffb3;border-radius:24px;flex-direction:column;gap:clamp(1.75rem,2.5vw,2.75rem);width:100%;max-width:none;padding:clamp(1.75rem,2.5vw,2.5rem) clamp(2rem,3.5vw,3.5rem) clamp(2rem,3vw,3rem);display:flex;box-shadow:0 40px 80px #0f172a2e,0 12px 32px #0f172a1f}.app-header{flex-wrap:wrap;justify-content:space-between;align-items:stretch;gap:1.5rem;display:flex}.header-copy h1{color:#0f172a;margin:0;font-size:2rem;font-weight:700}.header-copy p{color:#475569;margin:.25rem 0 0;font-size:.95rem}.header-controls{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.level-select{color:#0f172a;flex-direction:column;gap:.25rem;font-size:.85rem;display:flex}.level-select select{background:#f8fafce6;border:1px solid #0f172a1f;border-radius:.75rem;min-width:14rem;padding:.45rem .75rem;font-size:.95rem;transition:border-color .2s,box-shadow .2s}.level-select select:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 4px #3b82f626}.status-pill{text-transform:uppercase;letter-spacing:.08em;color:#0f172a;background:#94a3b840;border-radius:999px;padding:.4rem 1rem;font-size:.75rem;font-weight:600}.status-pill.playing{color:#1d4ed8;background:#60a5fa40}.status-pill.won{color:#15803d;background:#4ade8040}.history-controls{gap:.5rem;display:flex}.history-controls button{min-width:5.5rem}button{color:#0f172a;cursor:pointer;background:linear-gradient(120deg,#f8fafcf2,#f1f5f9e6);border:1px solid #0f172a29;border-radius:.75rem;padding:.45rem .9rem;font-size:.9rem;font-weight:600;transition:transform .18s,box-shadow .18s,border-color .18s}button:hover:not(:disabled){border-color:#3b82f673;transform:translateY(-1px);box-shadow:0 10px 18px #0f172a1f}button:active:not(:disabled){transform:translateY(0);box-shadow:0 6px 12px #0f172a24}button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;background:#f8fafc80;border-style:dashed;border-color:#0f172a1a;transform:none}.ghost{color:#1e293b;background:0 0;border-style:dashed;border-color:#0f172a40}.app-main{grid-template-columns:minmax(280px,1.05fr) minmax(0,2.4fr) minmax(320px,1fr);grid-template-areas:"axiom play side";align-items:start;gap:clamp(1.75rem,3vw,3rem);display:grid}@media (max-width:1480px){.app-main{grid-template-columns:minmax(260px,1fr) minmax(0,2.1fr) minmax(300px,1fr)}}.play-column{flex-direction:column;grid-area:play;gap:clamp(1.5rem,2vw,2.5rem);display:flex}.graph-panel{background:radial-gradient(circle at top,#e2e8f08c,#e2e8f040);border:1px solid #94a3b840;border-radius:20px;height:clamp(320px,45vh,520px);padding:clamp(1.25rem,2vw,1.75rem);position:relative;overflow:hidden;box-shadow:inset 0 1px #fff9}.axiom-sidebar{flex-direction:column;grid-area:axiom;align-self:stretch;gap:1.25rem;display:flex}.axiom-sidebar .axiom-actions-panel{background:#f8fafce6;border:1px solid #94a3b84d;border-radius:18px;max-height:calc(100vh - clamp(12rem,18vh,16rem));padding:clamp(1.25rem,2vw,1.75rem);overflow-y:auto;box-shadow:inset 0 1px #fff9}.axiom-sidebar .axiom-actions-panel::-webkit-scrollbar{width:.5rem}.axiom-sidebar .axiom-actions-panel::-webkit-scrollbar-thumb{background:#94a3b873;border-radius:999px}.axiom-sidebar .axiom-actions-panel::-webkit-scrollbar-track{background:0 0}.graph-panel.is-previewing{background:linear-gradient(145deg,#dbeafee6,#bfdbfea6);border-color:#3b82f666;box-shadow:0 20px 40px #3b82f62e,inset 0 0 0 1px #ffffff80}.graph-panel.is-previewing .network-view-container{pointer-events:none}.network-view-container{height:100%;position:relative}.network-view-svg{filter:drop-shadow(0 12px 24px #0f172a1f);width:100%;height:100%}.legend-panel{flex-direction:column;gap:.75rem;display:flex}.legend-card{padding:1rem 1.25rem}.legend-title{text-transform:uppercase;letter-spacing:.12em;color:#1e293b;font-size:.7rem;font-weight:700}.legend-grid{flex-direction:column;gap:.6rem;display:flex}.legend-item{align-items:center;gap:.6rem;display:flex}.legend-text{flex-direction:column;gap:.2rem;display:flex}.legend-label{color:#0f172a;font-size:.85rem;font-weight:600}.legend-description{color:#475569;font-size:.75rem}.axiom-actions-panel{padding:1.5rem}.axiom-groups{flex-flow:wrap;justify-content:space-between;gap:1rem;display:flex}.axiom-group{background:#f8fafcd9;border:1px solid #94a3b84d;border-radius:1rem;flex:1 1 0;min-width:220px;padding:.85rem 1rem}.axiom-group-heading{color:#0f172a;text-transform:uppercase;letter-spacing:.05em;justify-content:space-between;align-items:center;margin-bottom:.6rem;font-size:.8rem;font-weight:600;display:flex}.axiom-heading-copy{flex-direction:column;gap:.25rem;display:flex}.axiom-group-visual{justify-content:center;align-items:center;display:flex}.axiom-group-visual svg{width:72px;height:36px}.axiom-group-actions{flex-direction:column;gap:.5rem;display:flex}.axiom-group-actions button{justify-content:flex-start;align-items:center;width:100%;padding:.65rem .85rem;display:flex}.action-button-wrapper{width:100%}.sandbox-variable-field{text-align:center;flex-direction:column;align-items:center;gap:.4rem;margin-top:.6rem;display:flex}.sandbox-variable-field label{text-transform:uppercase;letter-spacing:.08em;color:#64748b;font-size:.72rem;font-weight:600}.sandbox-variable-input{color:#1f2937;background:#f8fafcf2;border:1px solid #94a3b873;border-radius:.75rem;width:100%;max-width:200px;padding:.55rem .85rem;font-size:.9rem;font-weight:600;transition:border-color .18s,box-shadow .18s}.sandbox-variable-input:focus{border-color:#3b82f6cc;outline:none;box-shadow:0 0 0 3px #3b82f62e}.sandbox-variable-input::placeholder{color:#94a3b8;font-weight:500}.action-button-content{align-items:center;gap:.65rem;width:100%;display:inline-flex}.action-button-glyph{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.action-button-glyph svg{width:72px;height:40px}.action-button-text{text-align:left;flex-direction:column;align-items:flex-start;gap:.15rem;display:flex}.action-button-name{color:#0f172a;font-size:.95rem;font-weight:600}.action-button-hint{text-transform:uppercase;letter-spacing:.08em;color:#475569;font-size:.7rem}.action-feedback{color:#334155;margin-top:1.2rem;font-size:.9rem}.preview-label{align-items:center;gap:.85rem;display:flex}.graph-preview-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none;background:#3b82f61f;border:1px solid #3b82f640;border-radius:.9rem;padding:.85rem 1rem;display:flex;position:absolute;bottom:1rem;left:1rem;right:1rem}.preview-glyph svg{width:92px;height:48px}.preview-copy{flex-direction:column;gap:.2rem;display:flex}.preview-operation-label{text-transform:uppercase;letter-spacing:.08em;color:#1d4ed8;font-size:.72rem;font-weight:700}.preview-description{color:#0f172a;font-size:.85rem;line-height:1.3}.preview-note{color:#b91c1c;font-size:.75rem;line-height:1.2}@keyframes button-available-flash{0%,to{border-color:#0f172a29;box-shadow:0 0 #3b82f600}50%{border-color:#3b82f699;box-shadow:0 0 0 4px #3b82f64d}}.button-newly-available{animation:1s ease-out button-available-flash}@media (max-width:1024px){.axiom-groups{flex-direction:column}.axiom-group{min-width:unset}}.side-panel{flex-direction:column;grid-area:side;gap:1rem;display:flex}.info-card{background:#f8fafce0;border:1px solid #94a3b84d;border-radius:18px;flex-direction:column;gap:.85rem;padding:1.1rem 1.25rem;display:flex;box-shadow:inset 0 1px #ffffffa6}.info-card h2{color:#0f172a;margin:0;font-size:1rem;font-weight:700}.goal-complete{color:#15803d;margin:0;font-size:.9rem;font-weight:600}.goal-preview{background:linear-gradient(160deg,#f8fafcf2,#e2e8f0bf);border:1px solid #94a3b84d;border-radius:1rem;justify-content:center;align-items:center;min-height:180px;padding:.75rem;display:flex;position:relative;box-shadow:inset 0 1px #fff9}.goal-network-container{pointer-events:none;width:100%;height:180px}.goal-network-container .network-view-svg{filter:drop-shadow(0 8px 16px #0f172a1a)}.goal-status{letter-spacing:.08em;text-transform:uppercase;color:#1d4ed8;background:#60a5fa2e;border-radius:999px;padding:.2rem .6rem;font-size:.72rem;font-weight:600}.goal-status-complete{color:#15803d;background:#4ade804d}.section-heading{justify-content:space-between;align-items:baseline;display:flex}.sandbox-toggle{color:#1e293b;align-items:center;gap:.6rem;font-weight:600;display:flex}.sandbox-toggle input{accent-color:#2563eb;width:1.05rem;height:1.05rem}.sandbox-copy{color:#475569;margin:0;font-size:.85rem}.sandbox-export{flex-direction:column;gap:.75rem;display:flex}.sandbox-export-label{text-transform:uppercase;letter-spacing:.08em;color:#64748b;font-size:.75rem;font-weight:600}.sandbox-export-textarea{resize:vertical;color:#0f172a;background:#ffffffe6;border:1px solid #94a3b899;border-radius:.75rem;width:100%;min-height:130px;padding:.65rem .75rem;font-family:JetBrains Mono,Fira Code,Segoe UI Mono,monospace;font-size:.8rem}.sandbox-export-textarea:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 3px #3b82f62e}.selection-count{letter-spacing:.04em;text-transform:uppercase;color:#64748b;font-size:.75rem}.empty-note{color:#64748b;margin:0;font-size:.85rem;font-style:italic}.selection-list{flex-direction:column;gap:.45rem;margin:0;padding:0;list-style:none;display:flex}.selection-list li{background:#3b82f614;border-radius:.6rem;align-items:center;gap:.5rem;padding:.2rem;display:inline-flex}.selection-form-preview{width:100px;height:56px}.selection-boundary{text-transform:uppercase;letter-spacing:.1em;color:#1d4ed8;font-size:.75rem;font-weight:600}.selection-list code{color:#0f172a;font-family:Fira Code,SFMono-Regular,ui-monospace,monospace;font-size:.78rem}.parent-summary{border-top:1px solid #94a3b84d;flex-direction:column;gap:.4rem;padding-top:.75rem;display:flex}.parent-label{text-transform:uppercase;letter-spacing:.08em;color:#64748b;font-size:.75rem;font-weight:600}.parent-value{align-items:baseline;gap:.45rem;font-size:.85rem;display:flex}.parent-root{color:#0f172a;font-weight:600}.parent-none{color:#94a3b8;font-style:italic}.action-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;display:grid}.action-grid button{text-align:center;padding:.55rem .65rem}@media (max-width:1260px){.app-main{grid-template-columns:minmax(260px,1fr) minmax(0,2.1fr);grid-template-areas:"axiom play""side side"}.side-panel{flex-flow:wrap;grid-row:auto;gap:1rem}.info-card{flex:260px}}@media (max-width:1160px){#root{padding:clamp(1rem,4vw,1.75rem)}.axiom-sidebar .axiom-actions-panel{max-height:unset}}@media (max-width:820px){.app-main{grid-template-columns:1fr;grid-template-areas:"axiom""play""side";gap:1.25rem}.axiom-sidebar{order:0}.side-panel{flex-direction:column}.app-card{padding:1.5rem}.legend-panel{max-width:none;position:static}.graph-panel{height:clamp(220px,52vh,320px)}}.app-footer{border-top:1px solid #94a3b833;margin-top:1.5rem;padding-top:1.75rem}.footer-content{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin-bottom:1.5rem;display:grid}.footer-section h3{text-transform:uppercase;letter-spacing:.08em;color:#0f172a;margin:0 0 .75rem;font-size:.9rem;font-weight:600}.footer-description{color:#475569;margin:0 0 1rem;font-size:.85rem;line-height:1.5}.footer-links{flex-direction:column;gap:.5rem;display:flex}.footer-links a{color:#1d4ed8;width:fit-content;font-size:.85rem;text-decoration:none;transition:color .2s;display:inline}.footer-links a:hover{color:#1e40af;text-decoration:underline}.footer-settings{border-top:1px solid #94a3b833;margin-top:1rem;padding-top:1rem}.setting-toggle{color:#334155;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.5rem;font-size:.9rem;display:flex}.setting-toggle input[type=checkbox]{cursor:pointer;width:18px;height:18px}.footer-credits{text-align:center;border-top:1px solid #94a3b826;padding-top:1.25rem}.footer-credits p{color:#64748b;margin:.5rem 0;font-size:.8rem;line-height:1.4}.footer-mission{color:#0f172a;font-weight:600}@media (max-width:640px){.app-footer{margin-top:1rem;padding-top:1rem}.footer-content{grid-template-columns:1fr;gap:1.5rem}}.tutorial-overlay{z-index:9999;pointer-events:none;width:100vw;height:100vh;position:fixed;top:0;left:0}.tutorial-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:auto;background:#0f172a99;width:100%;height:100%;animation:.3s ease-out tutorial-fade-in;position:absolute;top:0;left:0}.tutorial-highlight{pointer-events:none;z-index:10000;background:#3b82f61a;border:3px solid #3b82f6;border-radius:12px;animation:2s ease-in-out infinite tutorial-pulse;position:fixed;box-shadow:0 0 0 4px #3b82f633}@keyframes tutorial-pulse{0%,to{box-shadow:0 0 0 4px #3b82f633}50%{box-shadow:0 0 0 8px #3b82f666}}.tutorial-card{pointer-events:auto;z-index:10001;background:#fffffffa;border:2px solid #3b82f680;border-radius:16px;min-width:300px;max-width:400px;padding:1.5rem;animation:.4s cubic-bezier(.34,1.56,.64,1) tutorial-card-enter;position:fixed;box-shadow:0 20px 40px #0f172a4d,0 8px 16px #0f172a33}@keyframes tutorial-card-enter{0%{opacity:0;transform:scale(.9)translateY(-10px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes tutorial-fade-in{0%{opacity:0}to{opacity:1}}.tutorial-content{margin-bottom:1.25rem}.tutorial-title{color:#0f172a;margin:0 0 .75rem;font-size:1.25rem;font-weight:700}.tutorial-message{color:#334155;margin:0;font-size:.95rem;line-height:1.6}.tutorial-illustration{background:#e2e8f080;border-radius:8px;justify-content:center;align-items:center;margin-top:1rem;padding:.75rem;display:flex}.tutorial-illustration svg{max-width:100%;height:auto}.tutorial-actions{justify-content:flex-end;gap:.75rem;display:flex}.tutorial-button{cursor:pointer;border-radius:8px;padding:.5rem 1rem;font-size:.9rem;font-weight:600;transition:all .2s}.tutorial-skip{color:#64748b;background:0 0;border:1px dashed #0f172a4d}.tutorial-skip:hover{background:#94a3b81a;border-color:#0f172a66}.tutorial-primary{color:#fff;background:linear-gradient(135deg,#3b82f6,#2563eb);border:none;box-shadow:0 4px 12px #3b82f64d}.tutorial-primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #3b82f666}.tutorial-primary:active{transform:translateY(0)}@media (max-width:640px){.tutorial-card{max-width:calc(100vw - 40px);min-width:unset;right:20px;left:20px!important}.tutorial-card-center{transform:translateY(-50%);top:50%!important}}
