:root{color-scheme:light;--ink:#22213b;--muted:#65627a;--paper:#f6f4ef;--line:#dfdce7;--violet:#5b43cb;--pale:#eeebff;--panel:#fff;--dark:#1b1936;font-family:system-ui,-apple-system,"Malgun Gothic",sans-serif;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:.23em}a,button,input,select{touch-action:manipulation}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #735aff;outline-offset:3px}[hidden]{display:none!important}
.shell{width:min(1120px,calc(100% - 40px));margin-inline:auto}.top,.footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-block:18px}.top nav,.footer nav{display:flex;gap:17px;font-size:.87rem;flex-wrap:wrap}.brand{display:inline-flex;gap:9px;align-items:center;text-decoration:none;font-weight:850;white-space:nowrap}.mark{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#6b50df;color:#fff}.skip{position:fixed;left:12px;top:12px;transform:translateY(-180%);background:white;padding:10px;z-index:3}.skip:focus{transform:none}
.hero{min-height:318px;display:grid;grid-template-columns:1.3fr .7fr;align-items:center;gap:10px;overflow:hidden;position:relative;border-radius:26px;padding:36px clamp(25px,6vw,66px);color:#f9f8ff;background:radial-gradient(ellipse at 100% 5%,#3d326d,var(--dark) 61%)}.overline{font-size:.72rem;font-weight:850;letter-spacing:.13em;color:#6655ad;margin:0}.hero .overline{color:#c5b8ff}.hero h1{font-size:clamp(2.6rem,6vw,4.75rem);line-height:1.06;letter-spacing:-.075em;margin:16px 0}.hero h1 em{font-style:normal;color:#d2bcff}.hero p:not(.overline){line-height:1.65;color:#e0dbee;margin:0;font-size:clamp(.9rem,2vw,1.04rem)}.hero-art{position:relative;height:218px}.sample-frame{position:absolute;border:8px solid #eeebf5;border-bottom-width:27px;width:min(195px,78%);height:157px;top:21px;left:12%;border-radius:14px;box-shadow:0 18px 30px #10102262}.frame-back{background:#bcaeec;transform:rotate(-14deg) translate(-12px,12px)}.frame-front{background:linear-gradient(160deg,#eedaff,#baabec 65%);transform:rotate(10deg) translate(16px,7px)}.frame-front span{position:absolute;bottom:-21px;left:7px;color:#463475;font-weight:800;font-size:.6rem;letter-spacing:.1em}.sample-sun{width:32px;height:32px;border-radius:50%;background:#f8e1a1;position:absolute;right:22%;top:20%}.sample-hill{position:absolute;bottom:0;inset-inline:0;height:70%;background:#7969b7;clip-path:polygon(0 86%,38% 14%,56% 45%,72% 22%,100% 73%,100% 100%,0 100%)}.art-tag{position:absolute;right:7%;bottom:24px;background:#d8f0bb;color:#2a3a26;font-size:1.1rem;font-weight:900;padding:11px 16px;border-radius:10px;transform:rotate(-10deg)}
.trust{display:flex;gap:9px;flex-wrap:wrap;padding-block:16px}.trust span{background:#e9e5f6;border-radius:999px;padding:5px 11px;font-weight:700;color:#514477;font-size:.76rem}.trust span:first-child{background:#e4efd9;color:#35522a}
.workspace{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,1fr);align-items:start;gap:16px;scroll-margin-top:10px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:19px;padding:clamp(16px,3vw,26px);min-width:0}.section-title{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:16px}h2{font-size:clamp(1.25rem,3vw,1.6rem);letter-spacing:-.04em;margin:5px 0 0}.quiet{border:1px solid #d7cdef;color:#4d399d;background:#f7f5ff;padding:9px 12px;border-radius:9px;font-weight:750;font-size:.83rem}.drop{display:flex;align-items:center;flex-direction:column;text-align:center;gap:5px;border:2px dashed #bcb0e3;background:#f9f7ff;border-radius:15px;padding:20px 12px}.drop.drag{background:#e8e1ff;border-color:#6850cb}.drop-icon{background:var(--pale);border-radius:12px;color:#5136bc;display:grid;place-items:center;width:40px;height:40px;font-size:1.35rem}.drop label{font-weight:800}.drop input{max-width:100%;font-size:.84rem;padding:4px}.drop input::file-selector-button{border:1px solid #c1b3e9;background:white;color:#4c369f;padding:6px 9px;border-radius:7px;margin-right:7px;cursor:pointer}.drop p,.drop small{color:var(--muted);margin:0;font-size:.8rem}.status,.helper{font-size:.86rem;color:var(--muted);line-height:1.5}.status{min-height:1.4em}.file-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.file-row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:9px;border:1px solid var(--line);padding:9px;border-radius:11px}.thumb{width:48px;height:44px;object-fit:contain;border-radius:6px;background:#eeeaf6}.file-info{overflow-wrap:anywhere}.file-info strong,.file-info small{display:block}.file-info small{color:var(--muted);font-size:.79rem}.file-info .warning{color:#8b4605}.actions{display:flex;flex-wrap:wrap;gap:4px;justify-content:end}.actions a,.actions button{padding:5px 7px;font-size:.8rem}.actions a{color:#4d399d;font-weight:800}.summary{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding-top:12px}.summary p{font-weight:750;font-size:.87rem;margin:0}
.settings label{display:block;margin:12px 0 5px;font-size:.85rem;font-weight:800}.settings select,.settings input{width:100%;min-width:0;background:#fcfbff;color:var(--ink);padding:9px;border:1px solid #d8d2e6;border-radius:9px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:9px}.primary{display:flex;justify-content:space-between;width:100%;border:0;border-radius:11px;background:#5a42c6;color:white;font-weight:850;padding:13px 15px}.tips{display:grid;grid-template-columns:1.3fr 1fr;gap:18px;align-items:start;margin-block:32px}.tips p,.article p,.article li{color:#535068;line-height:1.75}.tip-card{background:#ebe6f7;padding:16px 20px;border-radius:14px}.tip-card p{margin:2px 0 10px;font-size:.88rem}.text-link{color:#4d36a4;font-weight:800}.footer{border-top:1px solid var(--line);color:var(--muted);font-size:.85rem}.article{background:white;border:1px solid var(--line);border-radius:20px;max-width:800px;padding:clamp(18px,5vw,48px);margin:18px auto 32px}.article h1{font-size:clamp(1.9rem,5vw,3.1rem);letter-spacing:-.05em;line-height:1.12;margin:12px 0}.article h2{margin:27px 0 8px}.article h3{margin:20px 0 4px}.article table{border-collapse:collapse;width:100%;font-size:.9rem}.article td,.article th{text-align:left;padding:8px;border-bottom:1px solid var(--line)}.article .callout{background:var(--pale);border-radius:12px;padding:13px 16px}
@media(max-width:690px){.shell{width:calc(100% - 24px)}.hero{min-height:245px;grid-template-columns:1fr;padding:27px 21px}.hero-art{display:none}.workspace,.tips{grid-template-columns:1fr}.top,.footer{align-items:flex-start}.top nav,.footer nav{gap:8px;font-size:.78rem}.hero h1{font-size:clamp(2.55rem,10vw,3.9rem)}.file-row{grid-template-columns:41px minmax(0,1fr)}.thumb{width:41px}.actions{grid-column:2;justify-content:start}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}}