/* Clickable sample workflows live inside the screen. Reading copy stays still. */
.experience-screen{display:block;width:100%;background:#fff;border:1px solid #dce5f2;border-radius:18px;overflow:hidden;box-shadow:0 18px 50px #1f3b6412}
.experience-mobile-open{display:none}
.experience-layer,.experience-art,.experience-controls{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.experience-art{font-family:"Noto Sans JP",system-ui,sans-serif}
.sim-is-enhanced .experience-art{visibility:hidden}
.experience-hotspot{position:absolute;pointer-events:auto;border:1px solid #3f7be787;border-radius:6px;background:#427cf609;transition:background .18s,box-shadow .18s;min-width:0;padding:0}
.experience-hotspot.primary{border:2px solid #447be6;box-shadow:0 0 0 3px #4480ef18;background:#427cf60c}
.experience-hotspot.card{border-color:transparent}
.experience-hotspot.check{border-color:transparent;border-radius:3px}
.experience-hotspot:hover,.experience-hotspot:focus-visible{background:#427cf620;box-shadow:0 0 0 3px #4480ef35;border-color:#3875de;outline:2px solid #2865dd;outline-offset:1px}
.experience-caption{display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:0 12px!important;min-height:58px}
.experience-status{font-size:11px;line-height:1.7;color:#526582;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;grid-column:1/-1;min-height:19px}
.experience-try,.experience-reset{background:none;color:#365d99;font-weight:650;font-size:11px;min-height:36px;padding:4px 0;white-space:nowrap}
.experience-try{background:#edf4ff;border:1px solid #d6e4fb;border-radius:50px;padding:5px 13px}
.experience-reset{color:#687b95;font-weight:500}
.experience-caption .story-screen-actions{gap:14px}
.experience-dialog{width:min(720px,calc(100% - 32px));max-height:90svh;padding:0;border:1px solid #e0e7f1;border-radius:26px;background:#fff;color:#243c5c;overscroll-behavior:contain;box-shadow:0 35px 120px #19345b28}
.experience-dialog::backdrop{background:#15284166;backdrop-filter:blur(7px)}
.experience-dialog-header{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:20px;background:#fffffff5;padding:23px 32px;border-bottom:1px solid #e9eef5}
.experience-dialog-header p{font-size:10px;letter-spacing:.13em;color:#667e9e;margin-bottom:6px}
.experience-dialog-header h2{font-size:26px;line-height:1.45}
.experience-dialog-header .dialog-close{position:static;flex-shrink:0;width:44px;height:44px;border-radius:50%;background:#f1f5fb;color:#446284;font-size:25px}
.experience-dialog-body{padding:26px 32px 18px}
.experience-dialog-intro{font-size:15px;margin-bottom:24px;color:#58708f}
#experience-form{display:grid;gap:20px}
.experience-summary{display:flex;flex-direction:column;gap:5px;background:#f1f6fd;border:1px solid #e1eaf7;border-radius:17px;padding:19px 22px}
.experience-summary span{font-size:12px;color:#657d9b}
.experience-summary strong{font-size:25px;font-weight:700;line-height:1.6;overflow-wrap:anywhere}
.experience-field{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:650;min-width:0}
.experience-field input,.experience-field select,.experience-field textarea{font:inherit;font-size:16px;font-weight:400;color:#243c5c;border:1px solid #cdd9e9;border-radius:10px;background:#fff;padding:12px 14px;min-height:48px;max-width:100%;width:100%;box-sizing:border-box}
.experience-field textarea{resize:vertical;line-height:1.9;min-height:130px}
.experience-field select:focus-visible{outline:3px solid #4268ff;outline-offset:3px}
.experience-field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;min-width:0}
.experience-primary{display:flex;align-items:center;justify-content:space-between;gap:15px;background:#285fde;color:#fff;border-radius:12px;padding:13px 20px;min-height:50px;font-size:14px;font-weight:650}
.experience-primary:hover{background:#1e50c4}
.experience-primary span{font-size:20px}
.experience-choice-row{display:flex;gap:12px;flex-wrap:wrap}
.experience-choice-row>button{flex:1;min-height:48px;border-radius:12px;padding:12px 18px;font-size:14px;background:#edf3fd;color:#2e5697}
.experience-choice-row>.experience-primary{background:#285fde;color:#fff}
.experience-help{font-size:12px;color:#687d99;line-height:1.9}
.experience-dialog-status{min-height:24px;font-size:13px;line-height:1.9;color:#21735b;margin-top:20px;overflow-wrap:anywhere}
.experience-dialog-status.is-error{color:#a64242}
.experience-dialog-status:focus{outline:none}
.experience-dialog-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 32px 24px;background:#f8fafd;border-top:1px solid #e9eef5}
.experience-dialog-footer span{font-size:10px;line-height:1.9;color:#697f9c}
.experience-dialog-footer button{font-size:12px;font-weight:650;color:#365d99;background:none;white-space:nowrap;min-height:44px}
.experience-history{list-style:none;padding:0;margin:0;display:grid;gap:10px;max-height:240px;overflow:auto}
.experience-history:empty{display:none}
.experience-history li{display:flex;justify-content:space-between;gap:14px;padding:13px 16px;background:#f5f8fc;border-radius:10px;font-size:13px;overflow-wrap:anywhere;white-space:pre-wrap}
.experience-history li>span{min-width:0}
.experience-history button{background:none;color:#5c7394;min-width:44px;min-height:44px;align-self:center}
.experience-paper{padding:24px;background:#f9fbfe;border:1px solid #e0e8f2;border-radius:14px;overflow-wrap:anywhere}
.experience-paper small{font-size:11px;color:#667e9e}
.experience-paper h3{font-size:19px;margin:10px 0 14px}.experience-paper p{font-size:13px;line-height:2}.experience-paper>strong{display:block;font-size:30px;margin:12px 0}
.experience-message{white-space:pre-wrap}
.experience-stock-counts{display:flex;gap:12px}.experience-stock-counts>span{flex:1;padding:12px;background:#f6f9fd;border-radius:10px;font-size:12px;text-align:center}.experience-stock-counts strong{display:block;font-size:20px}
.experience-check{display:flex;align-items:center;gap:14px;padding:13px 15px;background:#f5f8fc;border-radius:10px;font-size:14px;min-height:52px}
.experience-check input,.experience-permissions input{width:22px;height:22px;accent-color:#2865dd;flex-shrink:0}
.experience-permissions{border-collapse:collapse;width:100%;font-size:13px}.experience-permissions th{font-weight:500;padding:12px 6px;text-align:left}.experience-permissions thead th{font-size:11px;color:#697e9a}.experience-permissions td{text-align:center;border-top:1px solid #e8eef7}.experience-permissions tbody th{border-top:1px solid #e8eef7}.experience-permissions label{min-height:48px;display:grid;place-items:center}
@media(max-width:1100px){.experience-caption>span:first-child{display:none}.experience-caption .story-screen-actions{grid-column:1/-1;justify-content:space-between;gap:12px}.experience-status{font-size:10px}.experience-caption{min-height:60px}}
@media(max-width:760px){.experience-screen{border-radius:12px}.experience-caption{padding:0 6px!important;min-height:68px;gap:2px 10px!important}.experience-try,.experience-reset,.experience-caption .story-replay,.experience-caption .story-enlarge{min-height:44px;font-size:11px}.experience-try{padding:6px 15px}.experience-hotspot{pointer-events:none;border-color:transparent!important;box-shadow:none!important;background:none!important}.experience-controls{display:none}.experience-mobile-open{display:block;position:absolute;right:8px;top:8px;min-height:44px;padding:9px 14px;border:1px solid #bfd2f2;border-radius:24px;background:#fff;color:#2c579c;box-shadow:0 3px 14px #20436c16;font-size:11px;font-weight:650}.experience-hotspot:focus-visible{outline:0}.experience-status{font-size:10px}.experience-dialog{width:calc(100% - 20px);border-radius:22px;max-height:94svh}.experience-dialog-header{padding:18px 20px}.experience-dialog-header h2{font-size:23px}.experience-dialog-body{padding:22px 20px 16px}.experience-dialog-intro{font-size:14px}.experience-dialog-footer{padding:16px 20px;gap:12px;align-items:flex-start;flex-direction:column}.experience-dialog-footer button{align-self:flex-end}.experience-summary{padding:16px}.experience-summary strong{font-size:23px}.experience-field-row{gap:12px}.experience-paper{padding:18px}.experience-permissions{font-size:12px}.experience-permissions th{padding:10px 3px}.experience-stock-counts{gap:8px}.experience-stock-counts>span{padding:10px 6px}}
@media(prefers-reduced-motion:reduce){.experience-hotspot{transition:none}}
