*{box-sizing:border-box}body{margin:0;background:#f7f7f2;color:#182d35;font-family:Arial,Tahoma,sans-serif;font-size:14px}a{color:inherit}.shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}aside{background:#172f38;color:#eef4ef;padding:32px 22px;position:sticky;top:0;height:100vh;overflow:auto}.brand{font-size:32px;letter-spacing:-2px;text-decoration:none;font-weight:bold}.brand span{color:#d4f178}.category{display:block;color:#a9bfbf;font-size:12px;margin:14px 0 26px}.search{display:flex;align-items:center;gap:10px;border:1px solid #465d62;border-radius:12px;padding:9px}.search input{width:100%;background:transparent;color:white;border:0;min-width:0;padding:0}.nav-label{color:#a9bfbf;font-size:10px;letter-spacing:2px;margin:28px 0 12px}nav{display:grid;gap:7px}nav a{display:flex;gap:12px;padding:12px;border-radius:10px;text-decoration:none;font-size:12px;line-height:1.4}nav a:hover{background:#29464e}nav a.active{background:#d4f178;color:#172f38;font-weight:bold}.nav-icon{font-size:10px;opacity:.7;width:14px;flex-shrink:0}.sidebar-bottom{margin-top:38px;border-top:1px solid #456069;padding-top:24px;font-size:11px;color:#bdcfcf}.local-dot{display:inline-block;width:7px;height:7px;background:#d4f178;border-radius:50%;margin-inline-end:8px}header{display:flex;justify-content:space-between;align-items:center;padding:23px 42px;background:#fff;border-bottom:1px solid #e7ebe6;font-size:12px;color:#5f7274}header a{text-decoration:none;font-weight:bold}main{max-width:1400px;margin:auto;padding:38px 42px}.intro{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-bottom:32px}.eyebrow{font-size:10px;font-weight:bold;letter-spacing:2px;color:var(--accent)}h1{font-family:Georgia,Tahoma,serif;font-size:44px;letter-spacing:-1px;margin:15px 0;line-height:1.1}.intro p{color:#647478;line-height:1.7}.art{position:relative;width:180px;height:160px;flex-shrink:0}.art span{position:absolute;width:92px;height:112px;border:1px solid #d6ded6;border-radius:18px;background:white;left:25px;top:24px;transform:rotate(-18deg);box-shadow:0 14px 24px #182d3512}.art span:nth-child(2){left:47px;top:18px;transform:rotate(-3deg);background:#d4f178}.art span:nth-child(3){left:69px;top:20px;transform:rotate(13deg);background:var(--accent)}.art b{position:absolute;left:82px;top:61px;font-size:30px;color:white}.workspace{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;align-items:start}.panel{border:1px solid #dfe5dc;background:#fff;border-radius:22px;padding:28px;box-shadow:0 8px 28px #132d3503}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px}h2{font-size:18px;margin:0}h3{font-size:14px;margin-top:22px}.pill{background:#f1f5ea;color:#526c3d;padding:7px 10px;border-radius:24px;font-size:9px;letter-spacing:1px}label:not(.drop){display:block;font-size:12px;margin:16px 0 9px;color:#42595e;font-weight:bold}input,textarea,button{font:inherit}input,textarea{border:1px solid #d3dfdc;border-radius:10px;padding:12px;width:100%;background:#fcfdfb;color:#182d35}input:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:2px}textarea{min-height:190px;resize:vertical;line-height:1.6;font-family:Consolas,monospace;font-size:13px}.options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}.options textarea{min-height:90px}.drop{display:grid;gap:12px;text-align:center;padding:25px 18px;background:#f7f9f1;border:1px dashed #bcccaa;border-radius:16px;font-size:28px;color:var(--accent);cursor:pointer}.drop strong{font-size:14px;color:#263e44}.drop small{font-size:11px;color:#718075}.drop input{font-size:12px;background:white}.scope{display:flex;align-items:flex-start;gap:10px;background:#f7f8f2;padding:13px;border-radius:10px;margin:20px 0;line-height:1.7;font-size:11px;color:#607069}.scope p{margin:0}.actions{display:flex;gap:9px;flex-wrap:wrap}button{border:1px solid #d6dfda;background:white;border-radius:10px;padding:12px 16px;cursor:pointer;font-size:12px;font-weight:bold}button:hover{background:#f0f4e7}.primary{background:var(--accent);border-color:var(--accent);color:white}.primary:hover{filter:brightness(.92);background:var(--accent)}button:disabled{opacity:.55;cursor:wait}.subtle{font-size:10px;padding:8px 11px}#message{font-size:11px;line-height:1.7;color:#63776a;margin-bottom:0}.error{color:#a33127!important}.output{min-height:440px}#empty{text-align:center;padding:55px 15px;color:#76857e}#empty h3{color:#344e4c}.result-art{font-size:42px;background:#edf2e3;display:flex;align-items:center;justify-content:center;width:85px;height:85px;border-radius:24px;margin:auto;color:var(--accent)}#output{white-space:pre-wrap;overflow-wrap:anywhere;max-height:530px;overflow:auto;background:#f8faf5;border:1px solid #e6ebe0;border-radius:12px;padding:20px;font-size:12px;line-height:1.8;unicode-bidi:plaintext}#preview{max-width:100%;max-height:300px;object-fit:contain;margin-bottom:15px}.guide{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:42px 0;padding:32px;border-radius:20px;background:#edf2e4}.guide h2{font-family:Georgia,Tahoma,serif;font-size:28px;margin-top:13px}.guide ol{margin:0;padding-inline-start:22px;color:#52645c;font-size:13px;line-height:2}.related-title{margin-bottom:18px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.cards a{padding:24px;border:1px solid #e1e6db;border-radius:15px;text-decoration:none;background:white;transition:transform .15s}.cards a:hover{transform:translateY(-3px);border-color:var(--accent)}.cards span{float:right;color:var(--accent)}.cards h3{margin:0 14px 15px 0;line-height:1.6}.cards p{font-size:11px;color:#7c8c81;line-height:1.6}footer{display:flex;gap:24px;flex-wrap:wrap;font-size:11px;color:#77877e;padding:36px 0 5px}footer a{text-decoration:none}.hidden{display:none!important}.muted{font-size:11px;overflow-wrap:anywhere;color:#718075}.embed aside,.embed header,.embed .intro,.embed .guide,.embed .cards,.embed footer,.embed .related-title{display:none}.embed .shell{display:block}.embed main{padding:16px}.embed .workspace{grid-template-columns:1fr}.embed .output{min-height:200px}@media(max-width:1050px){.shell{grid-template-columns:210px 1fr}main,header{padding:25px}.workspace{grid-template-columns:1fr}.output{min-height:250px}h1{font-size:36px}}@media(max-width:650px){.shell{display:block}aside{height:auto;position:relative;padding:20px}aside .category,aside .search,aside .nav-label,.sidebar-bottom{display:none}nav{display:flex;overflow:auto;margin-top:14px}nav a{white-space:nowrap;flex-shrink:0;font-size:11px}.nav-icon{display:none}header{padding:16px 20px}main{padding:25px 18px}.intro{gap:12px;align-items:flex-start}.art{width:96px;height:100px;transform:scale(.6);transform-origin:top right;margin-left:-55px}h1{font-size:32px;overflow-wrap:anywhere}.intro p{font-size:12px}.panel{padding:20px}.cards{grid-template-columns:1fr 1fr}.cards a{padding:18px}.guide{grid-template-columns:1fr;padding:24px}.options{grid-template-columns:1fr}.output{min-height:230px}}@media print{aside,header,.intro,.editor,.guide,.cards,footer,.related-title,.panel-head,.actions,#empty{display:none!important}.shell,.workspace{display:block}main{padding:0}.output{border:0;padding:0;box-shadow:none}#output{max-height:none;overflow:visible;background:white;border:0;font-size:12pt}}

.content,.workspace,.panel,.intro>div,nav{min-width:0}input,textarea{min-width:0}pre{max-width:100%}@media(max-width:650px){.art{display:none}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.cards a{min-width:0;overflow-wrap:anywhere}header>span{min-width:0;overflow-wrap:anywhere}header>a{flex-shrink:0}}

#video-preview{width:100%;max-height:340px;border-radius:12px;background:#102937;margin:12px 0}#audio-preview{width:100%;margin:16px 0}#design-preview{margin:18px 0}.design-sample{padding:32px 24px;border:1px solid #dae2d3;border-radius:16px;background:#f2f5e9;min-height:150px}.design-sample h3{font-size:24px;margin:0 0 16px}.design-sample p{font-size:13px;line-height:1.7}.palette-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.palette-preview span{display:block;height:90px;border-radius:12px}.palette-preview strong{display:block;font-size:11px;text-align:center;margin-top:9px}

:root{--accent:#6655e9}body{background:#f3f5fc;color:#1e2543;font-family:Arial,Tahoma,sans-serif}aside{background:#151a31;border-right:1px solid #303650;padding:30px 22px}.brand{letter-spacing:-1.8px}.brand span{color:#aa9bff}nav a.active{background:#7966f4;color:#fff;box-shadow:0 8px 20px #0002}nav a:hover{background:#30354d}.local-dot{background:#a99aff}header{background:#ffffffb8;backdrop-filter:blur(16px);border-color:#e1e5f2}main{max-width:1500px;padding:40px}.intro{position:relative;padding:36px 40px;background:linear-gradient(120deg,#171e38,#343464);border:1px solid #424668;border-radius:28px;color:white;overflow:hidden;min-height:230px}.intro:after{content:'';position:absolute;width:340px;height:340px;border-radius:50%;border:50px solid #ffffff05;right:-80px;top:-130px;pointer-events:none}.intro .eyebrow{color:#c3baff}.intro p{color:#c7ccdf;max-width:650px;font-size:15px}h1{font-family:Arial,Tahoma,sans-serif;font-size:42px;letter-spacing:-1.5px;line-height:1.15;max-width:760px}.art{z-index:1}.art span{border-color:#ffffff44;background:#d7d1ff}.art span:nth-child(2){background:#aca0fa}.art span:nth-child(3){background:#8070e8}.workspace{gap:24px;grid-template-columns:1.15fr 1fr}.panel{border-color:#e1e5f2;border-radius:24px;padding:28px;box-shadow:0 12px 40px #26316508}.panel-head{border-bottom:1px solid #edf0f7;padding-bottom:18px}.panel-head h2{font-size:13px;text-transform:uppercase;letter-spacing:1px;color:#5c6581}.drop{background:linear-gradient(135deg,#f5f3ff,#f0f5ff);border:2px dashed #c1b8ef;min-height:150px}.drop.dragging{background:#e0daff;border-color:#7966f4}.drop strong{font-size:16px}.drop input{border:0;background:#fff9}input,textarea,select{background:#f8f9fe;border-color:#dce1f0;color:#27314a}select{font:inherit;padding:12px;border:1px solid #dce1f0;border-radius:10px;width:100%}.scope{background:#fff8e8;color:#6d5a33;border-inline-start:3px solid #e8bd64}.primary{background:#6956df;border-color:#6956df;box-shadow:0 5px 12px #6956df20}.primary:hover{background:#6956df}.pill{background:#eeeaff;color:#6750bd}.output{background:linear-gradient(150deg,#fff,#f8f9ff);min-height:420px}.result-art{background:#eae6ff;color:#7761dd;border-radius:50%;border:10px solid #f3f0ff;width:105px;height:105px}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.cards a{border-color:#e0e4f1;background:white;border-radius:18px;box-shadow:0 4px 15px #26316504}.cards h3{color:#28314f}.cards p{color:#65728b}.tool-guide{margin:48px 0}.guide-heading{max-width:760px;margin-bottom:25px}.guide-heading h2{font-size:29px;letter-spacing:-.6px;margin:12px 0}.guide-heading p,.guide-columns p{line-height:1.8;color:#626d85}.guide-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.guide-columns>div{background:#fff;border:1px solid #e1e5f2;border-radius:20px;padding:26px}.guide-columns h3{margin:0 0 18px;font-size:16px}.guide-columns ol{padding-inline-start:24px;line-height:1.9;color:#626d85}.guide-columns li{padding-inline-start:7px;margin-bottom:10px}.guide-columns pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#f5f6fc;padding:16px;border-radius:12px;font-size:12px;line-height:1.7}.editorial-note{font-size:11px}.tool-guide>h3{margin:30px 0 16px;font-size:20px}.tool-guide details{padding:20px 24px;background:white;border:1px solid #e1e5f2;border-radius:14px;margin:10px 0}.tool-guide summary{cursor:pointer;font-weight:bold;line-height:1.5}.tool-guide details p{line-height:1.8;color:#65728b}.home-nav{display:flex;justify-content:space-between;margin-bottom:28px}.home-nav a{text-decoration:none}.home-intro{min-height:280px}.home-intro h1{font-size:54px}.home-count{font-size:90px;line-height:1;font-weight:bold;color:#b6a9ff;margin:0}.home-section-title{display:flex;justify-content:space-between;align-items:center;margin:36px 0 22px}.home-card-number{display:block;float:none!important;color:#8f7de5!important;font-size:12px;letter-spacing:2px;margin-bottom:20px}.home-card{min-height:190px}.home-card h3{font-size:18px}.embed .tool-guide{display:none}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #8b79ee;outline-offset:4px}@media(max-width:1050px){main{padding:26px}.workspace{grid-template-columns:1fr}.intro{padding:28px}.guide-columns{grid-template-columns:1fr}h1{font-size:36px}}@media(max-width:650px){main{padding:20px 14px}.intro{padding:26px 22px;border-radius:20px;min-height:190px}h1{font-size:30px;letter-spacing:-.7px}.intro p{font-size:13px}.panel{padding:21px}.cards{grid-template-columns:1fr}.home-intro h1{font-size:36px}.home-count{display:none}.guide-heading h2{font-size:25px}.guide-columns>div{padding:22px}.home-nav .brand{font-size:28px}.tool-guide{margin:32px 0}}@media print{.tool-guide{display:none}}

.table-wrap{overflow:auto;background:white;border:1px solid #e1e5f2;border-radius:16px}table{width:100%;border-collapse:collapse;text-align:start}th,td{padding:15px 22px;border-bottom:1px solid #e1e5f2;line-height:1.5}th{background:#f4f3fc}td{color:#626d85}.tool-guide>p{line-height:1.9;color:#626d85}.tool-guide h2{font-size:28px}.guide-columns h3:not(:first-child){margin-top:25px}.breadcrumbs{font-size:13px;margin-bottom:24px}