:root{--ink:#203a38;--muted:#5e736d;--accent:#236e64;--line:#d7e3dc;--paper:#f5f7f1;--gold:#d7ac56}*{box-sizing:border-box}html,body{margin:0;background:var(--paper);color:var(--ink)}body{font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea,summary{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #ad8125}button:disabled{opacity:.5;cursor:not-allowed}.workshop{max-width:1140px;margin:auto;padding:30px 24px 24px;min-width:0}.workshop-header{display:flex;gap:20px;justify-content:space-between;align-items:start;margin-bottom:24px}.eyebrow{font-size:.73rem;letter-spacing:.11em;text-transform:uppercase;font-weight:800;color:#386e63;margin:0 0 8px}h1{font-size:clamp(1.8rem,4vw,2.5rem);line-height:1.16;letter-spacing:-.04em;font-weight:800;margin:0 0 14px}h2{font-size:clamp(1.4rem,3vw,1.85rem);line-height:1.25;font-weight:800;letter-spacing:-.025em}h3{font-size:1.08rem;font-weight:750;line-height:1.4}p{margin:0 0 14px}.intro{color:var(--muted);max-width:670px}.source-link{color:var(--accent);font-weight:700;white-space:nowrap;text-underline-offset:4px}.scenario-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:8px;background:#e6eee7;border-radius:18px;margin-bottom:28px}.scenario-tabs button{min-height:52px;padding:12px;border:1px solid transparent;border-radius:12px;background:none;color:#45645d;text-align:left;font-size:.88rem;font-weight:750;overflow-wrap:anywhere}.scenario-tabs button span{opacity:.6;margin-right:8px;font-size:.76rem}.scenario-tabs button[aria-selected=true]{background:#fff;border-color:#cddcd3;box-shadow:0 3px 8px #17392c09;color:var(--accent)}.panel-heading{max-width:800px;margin-bottom:16px}.panel-heading>p:last-child{color:var(--muted)}.try-note{padding:18px 20px;border-left:3px solid var(--gold);border-radius:0 12px 12px 0;background:#fcf6e8;color:#625c4c;margin-bottom:22px}.surface{border:1px solid var(--line);border-radius:18px;background:#fff;padding:22px;min-width:0;margin:18px 0}.surface-heading{display:flex;align-items:start;justify-content:space-between;gap:12px;flex-wrap:wrap}.surface h3{margin-bottom:12px}.surface p:last-child{margin-bottom:0}.field{min-width:0;margin-bottom:16px}.field>label{display:block;font-size:.86rem;font-weight:700;margin-bottom:6px}.form-control,.form-select{min-height:46px;font-size:16px;color:var(--ink);background-color:#fafcf9;border-color:#cbdad2;border-radius:8px}.form-control:focus,.form-select:focus{color:var(--ink);background-color:#fff;border-color:#488c7d;box-shadow:0 0 0 .2rem #226b601c}.form-control[aria-invalid=true]{border-color:#a74431}.form-grid{display:grid;grid-template-columns:2fr 1fr;gap:0 16px}.form-grid .full{grid-column:1/-1}textarea.form-control{min-height:110px;resize:vertical}.btn{min-height:44px;padding:10px 15px;border-radius:10px;font-weight:750;white-space:normal;line-height:1.35}.btn-accent{background:var(--accent);border:1px solid var(--accent);color:#fff}.btn-accent:hover,.btn-accent:focus{background:#194f47;color:#fff}.btn-outline-accent{background:#fff;border:1px solid #c1d4c8;color:#285e55}.btn-outline-accent:hover{background:#edf4ed;color:#194f47}.btn-danger-soft{background:#fff3ef;color:#993e2c;border:1px solid #d6a996}.btn-danger-soft:hover{background:#f6e1d7;color:#79301f}.buttons{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.hint{color:var(--muted);font-size:.83rem;margin:8px 0 0}.error{color:#9b3927;font-size:.84rem;font-weight:650;margin:5px 0 0}.error:empty{display:none}.status{font-size:.9rem;color:#346b5d;margin:14px 0;overflow-wrap:anywhere;white-space:pre-line}.notice{padding:14px 17px;border:1px solid #d3dfcb;border-radius:12px;background:#eef5e9}.notice.warning{background:#fff7e7;border-color:#e7d29c}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.metric{padding:16px;border:1px solid var(--line);border-radius:14px;background:#eaf3eb;min-width:0}.metric-label{display:block;font-size:.77rem;color:#4c655b;line-height:1.4;margin-bottom:7px}.metric-value{display:block;font-size:clamp(1.3rem,3vw,1.8rem);line-height:1.25;font-weight:800;overflow-wrap:anywhere}.task-list{display:grid;gap:10px;margin:16px 0}.task-row{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid #dce5d7;border-radius:10px;background:#f8faf5;cursor:pointer;min-height:64px}.task-row input{width:22px;height:22px;accent-color:var(--accent);flex-shrink:0}.task-row strong{display:block;font-size:.94rem;line-height:1.45}.task-row .task-copy{min-width:0;flex:1}.pill{display:inline-block;border:1px solid #bfd6c3;border-radius:20px;padding:3px 10px;background:#eaf4e8;font-size:.75rem;font-weight:700;color:#3b6753;white-space:nowrap}.task-row .pill{margin-top:4px}.project-name{font-size:clamp(1.4rem,4vw,2rem);font-weight:800;line-height:1.3;overflow-wrap:anywhere;margin:8px 0 18px}.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px;margin:16px 0}.detail-grid>div{min-width:0}.detail-grid dt{font-size:.8rem;font-weight:650;color:var(--muted)}.detail-grid dd{margin:3px 0 0;font-weight:700;overflow-wrap:anywhere;white-space:pre-wrap}.receipt{border:1px solid #c4d9c7;border-radius:12px;background:#edf6e8;padding:18px;margin:12px 0}.receipt h4{font-size:1rem;font-weight:800;margin:0 0 10px}.receipt p{font-size:.88rem;white-space:pre-wrap;overflow-wrap:anywhere}.empty-state{padding:20px;border:1px dashed #bfceba;border-radius:12px;background:#f5f8f1;color:var(--muted)}.result-table{width:100%;font-size:.88rem;border-collapse:collapse}.result-table th,.result-table td{padding:13px;text-align:left;border-bottom:1px solid #dae4d5;vertical-align:top}.result-table th{color:#416855;background:#edf4e7}.result-table caption{caption-side:top;padding:10px 0;color:var(--muted);font-size:.82rem}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}.check-label{display:flex;align-items:center;gap:10px;min-height:44px;font-weight:650;font-size:.9rem}.check-label input{width:22px;height:22px;accent-color:var(--accent);flex-shrink:0}.preview-list{display:grid;gap:10px;margin:16px 0}.preview-list.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.preview-item{padding:18px;border:1px solid #d3e0cc;border-radius:11px;background:#f4f8ef;min-width:0}.preview-item strong{display:block;font-size:.9rem;overflow-wrap:anywhere}.preview-item span{display:block;font-size:.79rem;color:var(--muted);margin-top:6px}.preview-list.compact .preview-item{padding:10px}.draft-step{font-size:.83rem;color:#7b642f;background:#fff6df;border-radius:20px;padding:6px 12px;display:inline-block;font-weight:750}.technical{border:1px solid var(--line);border-radius:12px;background:#fff;margin:12px 0;padding:0}.technical summary{cursor:pointer;padding:15px 17px;font-size:.9rem;font-weight:750;min-height:50px}.technical-content{padding:0 17px 17px}.technical p{font-size:.86rem;color:var(--muted)}pre{white-space:pre;overflow:auto;max-height:420px;background:#163a32;color:#e7f3de;padding:18px;border-radius:10px;font-size:12px;line-height:1.6;tab-size:2;max-width:100%}.workshop-tools{border-top:1px solid var(--line);padding-top:24px;margin-top:28px}.workshop-footnote{font-size:.75rem;color:var(--muted);margin:24px 0 0}.workshop-footnote a{color:var(--accent)}.technical-note{font-size:.86rem;color:var(--muted);margin:18px 0}.standalone-label{padding:12px 20px;background:#dfeadc;font-size:.84rem}.standalone .workshop{max-width:1000px}.standalone .workshop-header h1{font-size:1.6rem}.swal2-popup{font-family:system-ui,sans-serif!important;border-radius:18px!important;color:var(--ink)!important}.swal2-title{font-size:1.5rem!important;line-height:1.3!important}.swal2-html-container{font-size:1rem!important;white-space:pre-line;line-height:1.55!important}.swal2-actions{gap:8px!important}.swal2-styled{border-radius:9px!important;font-weight:700!important}.swal2-input,.swal2-select,.swal2-textarea{font-size:16px!important;min-height:46px}.swal2-validation-message{font-size:.9rem!important;line-height:1.5!important}.swal2-popup.swal2-toast{padding:14px!important}.swal2-toast .swal2-title{font-size:1rem!important}.swal2-toast .swal2-html-container{font-size:.85rem!important}.swal2-toast .swal2-actions{margin:8px 0 0!important}.swal2-toast .swal2-confirm{min-height:44px!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}
@media(min-width:950px){.scenario-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:700px){.workshop{padding:22px 16px}.workshop-header{display:block}.workshop-header .source-link{display:inline-block;margin:0 0 8px}.surface{padding:17px}.form-grid,.settings-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.preview-list.cards{grid-template-columns:1fr}.metrics{gap:8px}.metric{padding:13px}.metric-value{font-size:1.25rem}.task-row{padding:12px}}
@media(max-width:500px){.workshop{padding:22px 12px}.scenario-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:6px}.scenario-tabs button{font-size:.81rem;padding:12px 9px}.scenario-tabs button span{margin-right:5px}.try-note{padding:16px}.metrics{grid-template-columns:1fr}.metric{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center}.metric-label{margin:0;font-size:.8rem}.metric-value{text-align:right}.detail-grid{grid-template-columns:1fr}.result-table,.result-table tbody,.result-table tr{display:block;width:100%}.result-table thead{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}.result-table caption{display:block}.result-table tr{border:1px solid var(--line);border-radius:9px;margin:10px 0;padding:8px}.result-table td{display:grid;grid-template-columns:80px minmax(0,1fr);gap:10px;padding:6px;border:0;overflow-wrap:anywhere}.result-table td:before{content:attr(data-label);font-size:.76rem;font-weight:700;color:var(--muted)}.swal2-actions{flex-wrap:wrap!important}.swal2-title{font-size:1.3rem!important}.swal2-html-container{margin-left:1rem!important;margin-right:1rem!important}.swal2-popup.swal2-toast{width:calc(100vw - 24px)!important;max-width:380px!important}.surface{padding:15px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(max-width:700px){pre{font-size:16px;line-height:1.55}}
@media(max-width:500px){.metric{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.metric-value{min-width:0;overflow-wrap:anywhere}}
.example-controls{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.example-controls .btn{font-size:.85rem}.validation-form{margin:18px 0}.validation-form fieldset{border:0;min-width:0;margin:0;padding:0}.validation-form legend{float:none;width:auto;font-size:1.05rem;font-weight:800;padding:0;margin-bottom:15px}.validation-form legend+*{clear:none}.validation-form .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}.validation-form .field.full{grid-column:1/-1}.validation-form .check-label{font-size:.88rem;line-height:1.45}.validation-form textarea{min-height:110px}.validation-form [aria-invalid=true]{border-color:#a9432b}.validation-form input[type=checkbox][aria-invalid=true]{outline:2px solid #a9432b;outline-offset:3px}.validation-result{border:1px solid #cedbc6;border-radius:16px;background:#fff;padding:22px;margin:20px 0;min-width:0}.validation-result h3{font-size:1.15rem;margin:0 0 12px;scroll-margin-top:20px}.validation-result h3:focus{outline:0}.validation-result h3:focus-visible{outline:3px solid #b58a27;outline-offset:5px}.validation-result p{font-size:.9rem}.validation-result.is-valid{background:#edf7e9;border-color:#9dc395}.validation-result.is-invalid{background:#fff4ed;border-color:#d8ac99}.validation-result.is-error{background:#fff7e6;border-color:#ddc58f}.validation-result.is-pending{background:#edf3f7;border-color:#aac7d5}.violation-list{margin:12px 0;padding-left:22px}.violation-list li{margin:9px 0;font-size:.9rem;line-height:1.5}.violation-list a{color:#8e3826;font-weight:650;text-underline-offset:3px;overflow-wrap:anywhere;display:inline-block;min-height:34px;padding:4px 0}.server-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0 0}.server-facts>div{min-width:0;border-top:1px solid #c4d9bc;padding-top:10px}.server-facts dt{font-size:.8rem;color:#4b6854}.server-facts dd{font-weight:800;margin:4px 0 0;font-size:1.2rem;overflow-wrap:anywhere}.server-summary{font-weight:650}.array-section{margin:20px 0}.array-row{border:1px solid #d7e2d0;background:#f6f9f2;border-radius:13px;padding:18px;margin:14px 0}.array-row-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.array-row-top h4{font-size:.95rem;font-weight:800;margin:0}.array-row .form-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.array-row .btn{font-size:.82rem}.type-info{font-size:.78rem;line-height:1.5;margin:7px 0;color:#5f7469}.type-info.is-string{color:#985526;font-weight:650}.type-convert{font-size:.78rem;padding:8px 10px;margin-top:6px}.field-hint{font-size:.8rem;color:var(--muted);margin:6px 0 0}.field .error{font-size:.83rem;line-height:1.5}.field input,.field select,.field textarea{font-size:16px}.array-empty{padding:18px;background:#fff7e5;border:1px dashed #d7c191;border-radius:10px}.technical .buttons{margin-bottom:14px}.workshop-footnote code{overflow-wrap:anywhere}.result-action{margin-top:18px}.validation-form:focus-visible,fieldset:focus-visible{outline:3px solid #b58a27;outline-offset:4px}.metric-value#metric-engine{font-size:1rem;line-height:1.45}
.field>label.check-label{display:flex;gap:10px;align-items:center;line-height:1.5}.field>label.check-label input{flex-shrink:0;margin:0}
@media(max-width:700px){.validation-form .form-grid,.array-row .form-grid{grid-template-columns:1fr}.validation-form .field.full{grid-column:auto}.validation-result{padding:17px}.server-facts{grid-template-columns:1fr}.array-row{padding:14px}.violation-list a{min-height:44px}.example-controls{display:grid;grid-template-columns:1fr}.example-controls .btn{width:100%;text-align:left}.array-row-top{align-items:start}}
