:root{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#211d19;background:#f6f4f0;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;font-size:15px}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,input:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #ff975c;outline-offset:3px}.app-shell{max-width:640px;margin:auto;background:#f6f4f0;min-height:100vh}.topbar{background:#1d1a18;color:#fff;display:flex;align-items:center;gap:12px;padding:14px 18px;padding-top:max(14px,env(safe-area-inset-top));position:sticky;top:0;z-index:20;box-shadow:0 5px 20px #0002}.brand-mark{width:40px;height:40px;background:#f46e37;border-radius:13px;display:grid;place-items:center;color:#fff;font-size:19px}.brand-copy{display:grid;gap:2px}.brand-copy b{font-size:17px;letter-spacing:.04em}.brand-copy small{font-size:11px;color:#c8c1bb}.icon-btn{margin-left:auto;background:#39332e;color:white;border:0;border-radius:12px;width:40px;height:40px;font-size:22px}main{padding:0 16px 36px}.intro{padding:27px 6px 19px}.eyebrow{display:inline-block;color:#bd582a;background:#ffe8da;border-radius:40px;padding:6px 12px;font-size:11px;font-weight:750;letter-spacing:.04em}.intro h1{margin:14px 0 12px;font-size:clamp(26px,7vw,34px);line-height:1.35;letter-spacing:-.03em}.intro h1 span{color:#d75a27}.intro p{color:#726b65;font-size:13px;line-height:1.9;margin:0}.step-card,.settings-panel,.result{background:#fff;border:1px solid #ebe6df;border-radius:19px;padding:18px;margin:0 0 14px;box-shadow:0 3px 11px #3f30250a}.section-title{display:flex;align-items:center;gap:12px;margin-bottom:17px}.section-title h2{font-size:17px;margin:0 0 5px}.section-title p{font-size:12px;color:#8d8177;margin:0}.step-number{font-size:13px;font-weight:850;color:#d35b25;background:#ffe6d7;border-radius:12px;width:44px;height:44px;display:grid;place-items:center}.upload-area{min-height:131px;border:2px dashed #e2aa8b;background:#fff8f3;border-radius:13px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;cursor:pointer}.upload-area b{color:#8b4427}.upload-area small{font-size:11px;color:#a77c65}.upload-icon{display:grid;place-items:center;background:#f4d0bb;color:#9d4926;border-radius:50%;font-size:26px;width:38px;height:38px;line-height:1}.hint{font-size:12px;color:#988d83;margin-top:13px}.media-list{list-style:none;padding:0;margin:11px 0 0;display:grid;gap:8px}.media-item{display:flex;align-items:center;background:#faf8f5;border:1px solid #f0ece7;border-radius:12px;gap:9px;padding:7px}.media-item img,.media-item video{width:58px;height:58px;object-fit:cover;border-radius:9px;background:#e8e4df}.media-meta{flex:1;min-width:0}.media-meta b{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-meta small{display:block;font-size:11px;color:#8a817a;margin-top:4px}.order-btns{display:flex;gap:3px;align-items:center}.mini-btn{border:0;background:#ece8e2;border-radius:8px;width:27px;height:31px;font-size:14px;color:#5d544a}.mini-btn.delete{color:#b33c2c;background:#fae6e0}.step-card textarea,.result textarea{width:100%;border:1px solid #dcd5cd;border-radius:12px;padding:14px;resize:vertical;line-height:1.85;color:#302923;background:#fff;min-height:170px}.step-card textarea::placeholder{color:#bbb1a9}.char-count{display:flex;justify-content:space-between;gap:8px;color:#998e84;font-size:11px;padding:9px 2px 0}.notice{color:#766d65;background:#ebe6df;border-radius:11px;padding:13px 14px;margin:7px 0 12px;font-size:12px;line-height:1.6}.notice.error{background:#fff0ec;color:#a22f25}.notice.ok{background:#edf5ec;color:#356e38}.primary-btn{appearance:none;width:100%;border:0;border-radius:14px;padding:18px 20px;background:#ec6630;color:#fff;font-size:16px;font-weight:800;display:flex;align-items:center;justify-content:space-between;gap:8px;text-decoration:none;box-shadow:0 7px 15px #e8663033;min-height:56px}.primary-btn:hover:not(:disabled){background:#d95828}.secondary-btn{background:#fff;color:#3b3028;border:1px solid #d6ccc2;border-radius:11px;padding:12px 13px;white-space:nowrap;font-weight:700;font-size:13px}.settings-panel{background:#2b2724;color:#fff}.settings-panel h2{font-size:15px;margin:0}.settings-panel p,.settings-panel small{font-size:12px;color:#c9c0b7;line-height:1.7;display:block}.settings-panel label{font-size:12px;display:block;margin:14px 0 6px}.pin-line{display:flex;gap:8px}.pin-line input{min-width:0;flex:1;border:1px solid #958e87;background:#fff;color:#1d1b19;border-radius:10px;padding:11px}.progress-panel{background:#fff;border:1px solid #ece7e2;padding:18px;border-radius:16px;margin:15px 0}.progress-top{display:flex;justify-content:space-between;gap:10px;font-size:13px}.progress-panel progress{width:100%;height:14px;accent-color:#ec6630;margin-top:12px}.progress-panel p{color:#837870;font-size:12px}.text-btn{border:0;background:transparent;padding:9px;color:#aa3d27;text-decoration:underline}.result{margin:17px 0}.result-head{margin-bottom:14px}.success-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;font-size:19px;background:#e1f1dd;color:#367d39;font-weight:800}.result video{width:100%;max-height:590px;aspect-ratio:9/16;background:#141312;border-radius:14px;object-fit:contain}.format-note{font-size:12px;color:#785d40;line-height:1.6}.button-row{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.result-btn{flex:1;min-width:150px;display:flex;text-align:center;justify-content:center;font-size:14px;min-height:47px;padding:13px}.result h3{font-size:14px;margin:23px 0 9px}.result textarea{min-height:190px;font-size:13px;background:#fbf9f6}.caption-note{font-size:11px;color:#94877b;line-height:1.7}.faq{padding:17px 9px;color:#71665d;font-size:12px;line-height:1.8}.faq summary{font-weight:700;cursor:pointer}footer{text-align:center;font-size:10px;color:#9a9189;padding:20px 0 max(24px,env(safe-area-inset-bottom))}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:641px){.app-shell{box-shadow:0 0 60px #00000008;min-height:100vh}.topbar{border-radius:0 0 12px 12px}}
