:root{font-family:Space Grotesk,Noto Sans SC,sans-serif;color:#1f1a17;background:#efe7de}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(1200px 600px at 20% 20%,#f4c68066,transparent 70%),radial-gradient(1000px 500px at 90% 0%,#7aa5d666,transparent 70%),linear-gradient(140deg,#f3eee8,#ebe2d8)}.page{min-height:100vh;padding:40px 20px;position:relative;overflow:hidden}.bg-shape{position:absolute;border-radius:999px;filter:blur(40px);opacity:.7;animation:float 8s ease-in-out infinite}.bg-shape-a{width:360px;height:360px;background:#d96a2b66;top:-80px;left:-80px}.bg-shape-b{width:300px;height:300px;background:#3e7bb866;right:-60px;bottom:-60px;animation-delay:1.5s}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.card{max-width:980px;margin:0 auto;background:#fffdfa;border:1px solid #cebba8;border-radius:20px;padding:28px;box-shadow:0 16px 40px #5f50441f;position:relative;z-index:1}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:#97531f;margin:0;font-weight:700;font-size:.85rem}h1{margin:8px 0 6px;font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.2}.subtitle{margin:0 0 20px;color:#4e433a}.survey-link-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:10px;margin-bottom:0}.survey-link-row a{color:#1d5f92;font-weight:700;text-underline-offset:2px}.survey-link-row a.tutorial-link{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .8rem;border-radius:999px;color:#111;font-family:inherit;font-weight:700;text-decoration:none;background:linear-gradient(135deg,#ff3d7f,#ff8a00 45%,#ffd400);box-shadow:0 10px 24px #ff603e47;border:1px solid rgba(255,255,255,.35);transition:transform .14s ease,box-shadow .14s ease,filter .14s ease}.survey-link-row a.tutorial-link:hover{color:#111;transform:translateY(-1px) scale(1.01);filter:saturate(1.08) brightness(1.02);box-shadow:0 14px 28px #ff603e5c}.survey-link-row a.tutorial-link .tutorial-link-star{text-decoration:none;line-height:1}.survey-link-row a.tutorial-link .tutorial-link-text{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}.survey-link-row a.tutorial-link:focus-visible{outline:3px solid #2d7ff9;outline-offset:3px}.survey-link-row a:hover{color:#15486f}.header-link-separator{color:#8b7f74}.survey-page,.tutorial-page{min-height:100vh;padding:30px 16px}.survey-card,.tutorial-card{max-width:980px;margin:0 auto;background:#fffdfa;border:1px solid #cebba8;border-radius:20px;padding:28px;box-shadow:0 16px 40px #5f50441f}.tutorial-section{border:1px solid #e2d6c8;border-radius:14px;padding:16px;background:#fffaf4}.tutorial-section+.tutorial-section{margin-top:12px}.tutorial-section h2{margin-top:0}.tutorial-image{width:100%;max-width:100%;height:auto;display:block;margin-top:10px;border:1px solid #d8c2aa;border-radius:10px;background:#fff}.tutorial-image-step2{max-height:420px;object-fit:contain}.tutorial-image-dryrun-result{width:100%;max-width:100%;height:auto;max-height:none;object-fit:contain}.tutorial-link-row{margin-top:18px;margin-bottom:0;font-weight:700}.survey-form{display:flex;flex-direction:column;gap:18px}.survey-section{border:1px solid #e2d6c8;border-radius:14px;padding:16px;background:#fffaf4}.survey-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.survey-scale{margin-top:0;color:#5d4f43;font-size:.92rem}.survey-question-row{border-top:1px solid #eaded2;padding-top:12px;margin-top:12px}.survey-question-row p{margin:0 0 8px;color:#3a2e24;font-weight:600}.survey-rating-row{display:flex;gap:10px;flex-wrap:wrap}.survey-radio-option{display:inline-flex;flex-direction:row;align-items:center;gap:6px;border:1px solid #cfb59b;border-radius:999px;padding:4px 10px;background:#fffcf8;font-weight:600}.survey-radio-option input{width:auto;margin:0;padding:0}textarea{border:1px solid #bda892;border-radius:10px;padding:10px 12px;font-size:.95rem;background:#fffcf8;resize:vertical;min-height:96px}textarea:focus{outline:2px solid #d18d49;outline-offset:1px}.survey-hint{margin:0;color:#5d4f43;font-size:.92rem}@media(max-width:700px){.survey-grid{grid-template-columns:1fr}.survey-card,.tutorial-card{padding:20px}}.form-grid{display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}.form-field-static{display:flex;flex-direction:column;gap:6px}.form-label{font-weight:600;color:#3a2e24}.form-static-value{border:1px solid #bda892;border-radius:10px;padding:10px 12px;font-size:.95rem;background:#f5f0ea;color:#6b5a4e;font-family:monospace}label{display:flex;flex-direction:column;gap:6px;font-weight:600;color:#3a2e24}.checkbox-row{flex-direction:row;align-items:center;gap:10px;grid-column:1 / -1}.full-width{grid-column:1 / -1}.checkbox-row input{width:16px;height:16px}input,select{border:1px solid #bda892;border-radius:10px;padding:10px 12px;font-size:.95rem;background:#fffcf8}input:focus{outline:2px solid #d18d49;outline-offset:1px}select:focus{outline:2px solid #d18d49;outline-offset:1px}button{grid-column:1 / -1;margin-top:8px;border:none;border-radius:12px;padding:12px;font-size:1rem;font-weight:700;color:#fff;background:linear-gradient(90deg,#c26028,#b14f3a,#8d5fbe);cursor:pointer;transition:transform .2s ease,filter .2s ease}button:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.04)}button:disabled{cursor:not-allowed;opacity:.7}.error{color:#a32121;font-weight:700;margin-top:12px}.warning-box{margin:12px 0;padding:10px 12px;border:1px solid #d1a33d;border-radius:10px;background:#fff5d6;color:#7b5200;font-weight:700}.warning-box p{margin:0 0 8px}.warning-list{margin:0;padding-left:20px;font-weight:600}.warning-list a{color:#7b5200}.info-box{margin:12px 0;padding:10px 12px;border:1px solid #8fa9be;border-radius:10px;background:#eef6ff;color:#1b4c73;font-weight:700}.result{margin-top:22px;border-top:1px solid #dfd1c4;padding-top:18px}.oauth-section,.migration-section{margin-top:28px;padding:24px;border:1px solid #e2d6c8;border-radius:14px;background:#fffaf4}.tab-row{margin-top:20px;display:flex;gap:10px;padding-top:0;border-top:none}.tab-button{margin-top:0;grid-column:auto;width:auto;min-width:140px;padding:10px 16px;border:1px solid #cfb59b;border-radius:999px;color:#4e3622;background:#f8ebdc}.tab-button:hover{transform:translateY(0);filter:none;background:#f3dfcb}.tab-button-active{color:#fff;border-color:#9c5630;background:linear-gradient(90deg,#bf5f27,#97503b)}.tab-button-active:hover{background:linear-gradient(90deg,#bf5f27,#97503b)}.migration-section{gap:18px}.migration-progress{grid-column:1 / -1;margin-top:4px}.migration-progress-row{display:flex;justify-content:space-between;align-items:center;font-size:.92rem;color:#5d4f43;margin-bottom:6px}.migration-progress-track{width:100%;height:10px;border-radius:999px;background:#ead9c5;overflow:hidden;border:1px solid #d8c2aa}.migration-progress-fill{height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,#c26028,#b14f3a,#8d5fbe);transition:width .28s ease}h2,h3{margin-bottom:8px}pre{background:#f8f1e9;border:1px solid #e0d2c3;border-radius:10px;padding:10px;white-space:pre-wrap;max-height:240px;overflow:auto}ul{margin-top:4px;padding-left:18px}a{color:#1f5d9e}.mapping-tree-root,.mapping-tree{list-style:none;margin:6px 0;padding-left:0}.mapping-tree{margin-left:18px;padding-left:14px;border-left:1px dashed #d7c6b3}.mapping-node{margin:8px 0}.mapping-node+.mapping-node{margin-top:22px}.mapping-node-main{display:flex;align-items:flex-start;gap:8px}.mapping-node-card{border:1px solid #ddcdb9;border-radius:10px;background:#fffaf4;padding:10px 12px;min-width:0;flex:1}.mapping-node-row{display:flex;align-items:flex-start;gap:6px;flex-wrap:wrap}.mapping-node-row+.mapping-node-row{margin-top:4px}.mapping-node-space{font-weight:700;color:#5c432c}.mapping-old-arrow{color:#8c6a48;display:inline-flex;align-items:center;align-self:center}.mapping-old-arrow svg{width:16px;height:16px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}.mapping-toggle,.mapping-toggle-spacer{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 22px}.mapping-toggle{margin:0;padding:0;border:1px solid #d3c3b0;border-radius:6px;background:#fff8ef;color:#5c432c;font-size:.9rem;line-height:1;cursor:pointer}.mapping-toggle:hover{filter:none;transform:none;background:#f4e7d8}.mapping-toggle-spacer{border:1px solid transparent}.mapping-node-meta{margin-top:6px;color:#5d4f43;font-size:.92rem}@media(max-width:760px){.card{padding:18px;border-radius:14px}.tab-row{flex-direction:column}.tab-button{width:100%}.oauth-section,.migration-section{padding:18px}.form-grid{grid-template-columns:1fr}}