.design-page{color:#20232a;background:#f4f5f6;min-height:100dvh;font-family:Noto Sans JP,Noto Sans,sans-serif}.design-page *{box-sizing:border-box}.design-page button,.design-page input,.design-page textarea{font:inherit}.design-skip{z-index:50;color:#fff;background:#20232a;padding:10px 15px;position:fixed;top:-80px;left:12px}.design-skip:focus{top:12px}.design-topbar{background:#fff;border-bottom:1px solid #dfe2e6;grid-template-columns:1fr auto 1fr;align-items:center;height:78px;padding:0 4.5%;display:grid}.design-topbar>a:first-child{align-items:center;gap:7px;font-size:13px;font-weight:700;display:flex}.design-topbar nav{justify-self:end;font-size:13px}.design-page main{max-width:1440px;margin:auto;padding:48px 4.5% 80px}.design-title{justify-content:space-between;align-items:flex-end;gap:45px;margin:0 0 42px;display:flex}.design-title h1{letter-spacing:-.03em;text-wrap:balance;margin:7px 0 18px;font-size:clamp(34px,4vw,58px);line-height:1.18}.design-title p:not(.workspace-kicker){color:#555c66;text-wrap:pretty;max-width:670px;line-height:1.9}.design-title-mark{background:#fff;border:1px solid #d5d9de;border-bottom:5px solid #20232a;flex-direction:column;justify-content:center;align-items:center;width:150px;height:150px;display:flex}.design-title-mark svg{color:#ff5a00}.design-title-mark span{font-variant-numeric:tabular-nums;font-size:34px;font-weight:800}.design-title-mark small{font-size:9px;font-weight:800}.design-board{grid-template-columns:200px minmax(0,1fr) 300px;align-items:start;gap:22px;display:grid}.profile-rail,.design-section,.brand-preview,.character-library,.design-login{background:#fff;border:1px solid #dfe2e6}.profile-rail{padding:16px;position:sticky;top:18px}.rail-heading{justify-content:space-between;align-items:center;padding:5px 4px 15px;display:flex}.rail-heading h2{font-size:13px}.rail-heading button{border:1px solid #d5d9de;border-radius:6px;place-items:center;width:32px;height:32px;display:grid}.profile-card{text-align:left;border:1px solid #0000;border-radius:7px;grid-template-columns:28px 1fr auto;align-items:center;gap:10px;width:100%;padding:12px 10px;display:grid}.profile-card:hover{background:#f4f5f6}.profile-card.selected{background:#fff5f0;border-color:#ff5a00}.profile-card span:nth-child(2){min-width:0}.profile-card b,.profile-card small{display:block}.profile-card b{text-overflow:ellipsis;font-size:12px;overflow:hidden}.profile-card small{color:#6b7280;margin-top:3px;font-size:10px}.profile-card>svg{color:#ff5a00}.profile-swatches{display:flex}.profile-swatches i{width:15px;height:28px}.rail-empty{text-align:center;color:#6b7280;padding:30px 10px}.rail-empty svg{margin:auto}.rail-empty p{font-size:12px;line-height:1.7}.new-profile{border-top:1px solid #e5e7eb;justify-content:center;align-items:center;gap:6px;width:100%;margin-top:12px;padding:10px;font-size:12px;font-weight:700;display:flex}.design-form-column{flex-direction:column;gap:16px;min-width:0;display:flex}.design-section{padding:25px}.section-heading{align-items:start;gap:16px;margin-bottom:22px;display:flex}.section-heading>span,.character-heading span{color:#d9480f;border:1px solid #ffcab2;padding:3px 6px;font-size:9px;font-weight:800}.section-heading h2{margin:0;font-size:18px}.section-heading p{color:#6b7280;margin:4px 0 0;font-size:12px;line-height:1.7}.design-field{flex-direction:column;gap:8px;font-size:12px;font-weight:700;display:flex}.design-field>input,.character-upload input,.character-upload textarea{background:#fff;border:1px solid #cfd4da;border-radius:6px;padding:11px 12px;line-height:1.6}.design-field>input:focus,.character-upload input:focus,.character-upload textarea:focus{outline-offset:1px;border-color:#ff5a00;outline:3px solid #ffcfb7}.logo-editor{grid-template-columns:150px 1fr;align-items:center;gap:18px;display:grid}.logo-drop{color:#555c66;background:#f7f8f9;border:1px dashed #aeb5bd;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:5px;height:110px;display:flex}.logo-drop img{object-fit:contain;width:88%;height:80%}.logo-drop span{font-size:12px;font-weight:700}.logo-drop small{font-size:9px}.logo-editor>div{flex-direction:column;align-items:flex-start;gap:8px;display:flex}.text-action{align-items:center;gap:6px;font-size:12px;font-weight:700;display:flex}.text-action.danger{color:#9b3838}.logo-editor p,.field-help{color:#6b7280;font-size:10px;line-height:1.6}.color-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.color-field{border:1px solid #dfe2e6;border-radius:7px;grid-template-columns:minmax(0,1fr) 34px 78px;align-items:center;gap:6px;padding:10px;font-size:12px;font-weight:700;display:grid}.color-field input[type=color]{background:0 0;border:0;width:34px;height:36px}.color-field input:last-child{border:0;width:78px;min-width:0;font:600 12px Noto Sans,monospace}.derived-swatches{margin-top:12px;display:flex}.derived-swatches i{flex:1;height:13px}.font-cards{grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px;display:grid}.font-cards button{text-align:left;border:1px solid #d5d9de;border-radius:7px;min-height:104px;padding:13px;position:relative}.font-cards button[aria-pressed=true]{background:#fff8f4;border:2px solid #ff5a00}.font-cards span{font-size:22px;display:block}.font-cards b{margin-top:12px;font-size:11px;display:block}.font-cards svg{color:#d9480f;position:absolute;top:8px;right:8px}.switch-row{border-bottom:1px solid #eceff1;justify-content:space-between;align-items:center;gap:16px;padding:13px 0;display:flex}.switch-row:last-child{border:0}.switch-row b,.switch-row small{display:block}.switch-row b{font-size:12px}.switch-row small{color:#6b7280;margin-top:3px;font-size:10px}.design-preview-column{min-width:0;position:sticky;top:18px}.brand-preview{padding:18px}.preview-label{justify-content:space-between;margin-bottom:13px;font-size:9px;display:flex}.preview-label span{font-weight:800}.preview-label b{color:#6b7280}.preview-slide{aspect-ratio:16/9;font-family:var(--preview-font);background:#fff;border:1px solid #dfe2e6;position:relative;overflow:hidden}.preview-slide>p{font-size:17px;font-weight:700;line-height:1.35;position:absolute;top:9%;left:8%}.preview-slide>i{background:var(--preview-primary);width:18%;height:4px;position:absolute;top:42%;left:8%}.preview-slide>div{grid-template-columns:repeat(3,1fr);gap:7px;height:25%;display:grid;position:absolute;top:54%;left:8%;right:8%}.preview-slide>div span{background:var(--preview-tint);border-top:4px solid var(--preview-primary)}.preview-slide>div span:nth-child(2){border-color:var(--preview-accent)}.preview-logo{object-fit:contain;max-width:16%;max-height:10%;position:absolute}.preview-logo.bottom-right{bottom:5%;right:5%}.preview-logo.bottom-left{bottom:5%;left:5%}.preview-logo.top-right{top:5%;right:5%}.preview-logo.top-left{top:5%;left:5%}.brand-preview dl{margin:15px 0 0;font-size:10px}.brand-preview dl>div{border-bottom:1px solid #eceff1;justify-content:space-between;padding:8px 0;display:flex}.brand-preview dl>div:last-child{border:0}.brand-preview dt{color:#6b7280}.brand-preview dd{font-weight:700}.save-design,.secondary-button{border-radius:7px;justify-content:center;align-items:center;gap:8px;width:100%;padding:13px 15px;font-size:13px;font-weight:800;display:flex}.save-design{color:#fff;background:#ff5a00;border-bottom:4px solid #c84906;margin-top:12px}.save-design:disabled,.secondary-button:disabled{opacity:.5}.design-message{background:#fff5f0;border-left:3px solid #ff5a00;padding:11px;font-size:12px;line-height:1.7}.sync-note{color:#555c66;background:#fff;border:1px solid #dfe2e6;margin-top:12px;padding:15px;font-size:11px;line-height:1.8}.character-library{min-width:0;padding:25px}.character-heading{justify-content:space-between;align-items:start;gap:14px;margin-bottom:22px;display:flex}.character-heading h2{margin:9px 0 6px;font-size:18px}.character-heading p{color:#6b7280;font-size:12px;line-height:1.7}.character-heading>svg{color:#ff5a00;flex-shrink:0;width:24px}.character-layout{flex-direction:column;gap:22px;display:flex}.character-shelf{grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:14px;display:grid}.character-card{border:1px solid #dfe2e6;padding:10px;position:relative}.character-card>div{aspect-ratio:4/3;background:#f2f3f4;position:relative;overflow:hidden}.character-card img{object-fit:contain;width:100%;height:100%}.character-card>div span{color:#fff;background:#20232a;padding:4px 6px;font-size:8px;font-weight:800;position:absolute;bottom:7px;left:7px}.character-card h3{margin:12px 2px 5px;font-size:13px}.character-card p{color:#555c66;min-height:32px;font-size:10px;line-height:1.6}.character-card small{color:#6b7280;font-size:9px}.character-card>button{color:#9b3838;background:#fff;border:1px solid #d5d9de;border-radius:50%;place-items:center;width:31px;height:31px;display:grid;position:absolute;top:8px;right:8px}.character-upload{background:#f7f8f9;border:1px solid #dfe2e6;grid-template-columns:160px minmax(0,1fr);column-gap:18px;padding:18px;display:grid}.character-upload h3{grid-column:1/-1;margin:0 0 13px;font-size:14px}.character-drop{aspect-ratio:3/4;text-align:center;background:#fff;border:1px dashed #aeb5bd;flex-direction:column;grid-area:2/1/5;justify-content:center;align-self:start;align-items:center;gap:6px;width:100%;padding:10px;display:flex}.character-drop img{object-fit:contain;width:100%;height:100%}.character-drop span{font-size:11px;font-weight:700}.character-drop small{color:#6b7280;font-size:9px}.character-upload label{flex-direction:column;grid-column:2;gap:5px;min-width:0;margin-top:12px;font-size:10px;font-weight:700;display:flex}.character-upload textarea{resize:vertical;width:100%;min-height:74px}.secondary-button{color:#fff;background:#20232a;margin-top:14px}.design-loading,.design-login{padding:40px}.design-login h2{font-size:22px}.design-login p{color:#555c66;margin:10px 0 20px}.design-login .primary-button{display:inline-flex}.design-footer{color:#6b7280;background:#fff;border-top:1px solid #dfe2e6;justify-content:space-between;padding:20px 4.5%;font-size:11px;display:flex}.design-page button:focus-visible,.design-page a:focus-visible{outline-offset:3px;outline:3px solid #ffb68f}.logo-editor{margin-top:14px}.character-upload .secondary-button,.character-upload .field-help{grid-column:1/-1}.character-upload input{width:100%;min-width:0}.character-upload label:first-of-type{margin-top:0}.brand-preview dd{text-align:right;overflow-wrap:anywhere;max-width:65%}@media (max-width:1240px){.design-board{grid-template-columns:minmax(0,1fr) 300px}.profile-rail{grid-column:1/-1;gap:8px;display:flex;position:static;overflow-x:auto}.rail-heading{gap:12px;min-width:140px;padding:5px}.profile-card{flex-shrink:0;width:180px;min-width:180px}.new-profile{border:0;width:auto;min-width:140px;margin-top:0}}@media (max-width:900px){.design-page main{padding:32px 20px 55px}.design-board{grid-template-columns:minmax(0,1fr)}.design-preview-column{grid-template-columns:1fr 1fr;align-items:start;gap:14px;display:grid;position:static}.brand-preview{grid-row:span 3}.save-design,.sync-note{margin:0}.design-title-mark{display:none}}@media (max-width:600px){.design-topbar{grid-template-columns:1fr auto;height:68px;padding:0 17px}.design-topbar>a:first-child{font-size:0}.design-topbar nav{display:none}.design-page main{padding:30px 16px 55px}.design-title{margin-bottom:28px}.design-title h1{font-size:36px}.design-section,.character-library{padding:20px}.color-grid{grid-template-columns:1fr}.font-cards{gap:6px}.font-cards button{padding:9px}.font-cards b{font-size:10px}.logo-editor{grid-template-columns:120px minmax(0,1fr);gap:14px}.section-heading{gap:10px}.character-upload{grid-template-columns:minmax(0,1fr);padding:14px}.character-drop{aspect-ratio:4/3;grid-row:auto;justify-self:center;max-width:220px}.character-upload label{grid-column:1}.character-upload label:first-of-type{margin-top:12px}.design-preview-column{grid-template-columns:minmax(0,1fr)}.brand-preview{grid-row:auto}.design-footer span:last-child{display:none}}