:root{color:#18201d;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f7faf9;font-family:Inter,Noto Sans JP,Hiragino Sans,Yu Gothic,system-ui,sans-serif}html,body,#root{min-height:100%}html,body{overflow-x:clip}body{margin:0}*{box-sizing:border-box}.app-shell{color:#18201d;background:#f7faf9;grid-template-columns:240px minmax(0,1fr);min-height:100svh;display:grid}.step-rail{color:#f4fbf7;background:#0f1714;flex-direction:column;gap:36px;padding:26px 20px;display:flex}.brand{align-items:center;gap:10px;font-size:16px;font-weight:800;display:flex}.brand-mark{color:#fff;background:#06c755;border-radius:8px;place-items:center;width:34px;height:34px;display:grid}.step-rail ol{gap:14px;margin:0;padding:0;list-style:none;display:grid}.step-rail li{color:#aab8b1;align-items:center;gap:10px;font-size:14px;display:flex}.step-rail li span{color:#d7e5de;background:#22302b;border-radius:50%;place-items:center;width:28px;height:28px;font-size:13px;display:grid}.step-rail li.active{color:#fff}.step-rail li.active span{color:#fff;background:#06c755}.workbench{gap:20px;min-width:0;padding:28px;display:grid}.topbar{justify-content:space-between;align-items:center;gap:20px;display:flex}.top-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;display:flex}.topbar h1{letter-spacing:0;margin:0;font-size:30px;line-height:1.2}.topbar p,.section-heading p,.stamp-card small,.spec{color:#64736d;font-size:13px}.icon-button,.primary,.secondary,.download{cursor:pointer;border:0;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:0 16px;font-size:14px;font-weight:800;display:inline-flex}.icon-button,.secondary,.download{color:#17221d;background:#fff;border:1px solid #dbe5e0}.icon-button.accent{color:#087a38;background:#e9fff2;border-color:#06c755}.primary{color:#fff;background:#06c755;width:100%}.secondary{color:#bd4b30;background:#fff7f4;border-color:#ffd6ca;width:100%}button:disabled{cursor:not-allowed;opacity:.48}.main-grid{grid-template-columns:minmax(0,1fr) 330px;align-items:stretch;gap:20px;display:grid}.canvas-panel,.inspector,.phrase-area{background:#fff;border:1px solid #dfe8e4;border-radius:8px;box-shadow:0 18px 40px #1b362a12}.canvas-panel{overflow:hidden}.canvas-toolbar{border-bottom:1px solid #e8efec;justify-content:space-between;align-items:center;min-height:48px;padding:0 18px;font-size:13px;font-weight:800;display:flex}.upload-canvas{aspect-ratio:1.45;cursor:pointer;background-color:#fff;background-image:linear-gradient(45deg,#edf4f1 25%,#0000 25%),linear-gradient(-45deg,#edf4f1 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#edf4f1 75%),linear-gradient(-45deg,#0000 75%,#edf4f1 75%);background-position:0 0,0 14px,14px -14px,-14px 0;background-size:28px 28px;border:0;place-items:center;width:100%;display:grid}.capture-actions{border-top:1px solid #e8efec;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;display:grid}.capture-actions button{color:#17221d;cursor:pointer;background:#fff;border:1px solid #dbe5e0;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:40px;font-weight:800;display:inline-flex}.capture-actions button:last-child{color:#087a38;background:#e9fff2;border-color:#06c755}.upload-canvas input{display:none}.upload-canvas img{object-fit:contain;filter:drop-shadow(0 20px 28px #0f171429);width:min(76%,560px);max-height:430px}.upload-canvas span{color:#5d6d66;place-items:center;gap:12px;font-weight:800;display:grid}.inspector{gap:16px;padding:18px;display:grid}.panel-title,.section-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.panel-title{justify-content:flex-start;font-weight:900}.inspector label,.control-block{gap:8px;font-size:13px;font-weight:800;display:grid}textarea{resize:vertical;color:#18201d;border:1px solid #d9e4df;border-radius:8px;min-height:92px;padding:12px;font:14px/1.55 system-ui,sans-serif}.segmented{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.segmented.compact{grid-template-columns:repeat(3,1fr)}.segmented button,.phrase{color:#2a3832;cursor:pointer;background:#fbfdfc;border:1px solid #dbe5e0;border-radius:8px;min-height:38px;padding:7px 8px;font-size:13px;font-weight:800;line-height:1.25}.segmented button.selected,.phrase.selected{color:#087a38;background:#e9fff2;border-color:#06c755}.consent{color:#2b3833;grid-template-columns:18px 1fr;align-items:start;line-height:1.45}.consent input{accent-color:#06c755;width:16px;height:16px}.spec{background:#f1f8ff;border-radius:8px;align-items:center;gap:8px;padding:10px 12px;display:flex}.phrase-area{padding:18px}.section-heading h2{letter-spacing:0;margin:0 0 4px;font-size:20px}.phrase-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin-top:16px;display:grid}.stamp-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;display:grid}.stamp-card{background:#fff;border:1px solid #dfe8e4;border-radius:8px;gap:8px;min-width:0;padding:12px;display:grid}.stamp-preview{aspect-ratio:370/320;background-color:#fff;background-image:linear-gradient(45deg,#eef4f1 25%,#0000 25%),linear-gradient(-45deg,#eef4f1 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#eef4f1 75%),linear-gradient(-45deg,#0000 75%,#eef4f1 75%);background-position:0 0,0 9px,9px -9px,-9px 0;background-size:18px 18px;border-radius:6px;place-items:center;display:grid;overflow:hidden}.stamp-preview img{object-fit:contain;width:100%;height:100%}.stamp-preview span{color:#6a7771;background:#fff;border:1px solid #dfe8e4;border-radius:50%;place-items:center;width:34px;height:34px;font-weight:900;display:grid}.stamp-card strong{font-size:14px}.toast{color:#fff;background:#101a16;border-radius:8px;align-items:center;gap:8px;max-width:min(440px,100vw - 48px);min-height:44px;padding:0 16px;font-size:14px;display:flex;position:fixed;bottom:24px;right:24px;box-shadow:0 16px 36px #00000038}.camera-backdrop{z-index:10;background:#0a110ea8;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.camera-dialog{background:#fff;border:1px solid #dbe5e0;border-radius:8px;gap:14px;width:min(760px,100%);max-height:calc(100svh - 48px);padding:18px;display:grid;overflow:auto;box-shadow:0 24px 70px #00000047}.camera-header{justify-content:space-between;align-items:center;gap:14px;display:flex}.camera-header h2{letter-spacing:0;margin:0 0 4px;font-size:22px}.camera-header p{color:#64736d;font-size:13px}.camera-close{color:#17221d;cursor:pointer;background:#fff;border:1px solid #dbe5e0;border-radius:8px;place-items:center;width:40px;height:40px;display:grid}.camera-dialog video{aspect-ratio:4/3;object-fit:cover;background:#0f1714;border-radius:8px;width:100%;max-height:62svh}.camera-actions{grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:10px;display:grid}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=1080px){.app-shell{grid-template-columns:1fr}.step-rail{z-index:2;gap:14px;padding:14px 18px;position:sticky;top:0}.step-rail ol{grid-template-columns:repeat(5,minmax(0,1fr))}.step-rail li{font-size:12px}.main-grid{grid-template-columns:1fr}.phrase-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width<=680px){.workbench{padding:16px}.topbar,.section-heading{flex-direction:column;align-items:stretch}.top-actions,.capture-actions,.camera-actions{grid-template-columns:1fr}.top-actions{display:grid}.topbar h1{font-size:24px}.step-rail ol{display:none}.phrase-grid,.stamp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
