:root{--ink:#17181c;--muted:#6d7079;--line:#e7e8ed;--soft:#f7f8fb;--accent:#4b5cff;--danger:#d74343;font-family:Pretendard,"Apple SD Gothic Neo","Noto Sans KR",Inter,system-ui,sans-serif;color:var(--ink);background:#fff}*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink)}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.console-header{height:66px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);z-index:10}.brand{display:flex;align-items:center;gap:10px;font-size:14px;letter-spacing:.07em}.brand-mark{width:31px;height:31px;border:2px solid var(--ink);border-radius:10px;display:grid;place-items:center;transform:rotate(-7deg);position:relative}.brand-mark:before,.brand-mark:after{content:"";position:absolute;width:15px;height:2px;background:var(--ink);border-radius:4px}.brand-mark:before{transform:rotate(45deg)}.brand-mark:after{transform:rotate(-45deg)}.brand-mark i{width:6px;height:6px;background:var(--accent);border-radius:50%;z-index:1}.console-header nav{display:flex;gap:22px;font-size:13px;font-weight:700;color:#454850}.console-header nav a:hover{color:var(--accent)}main{max-width:1180px;margin:auto;padding:54px 24px 100px}.intro{display:flex;justify-content:space-between;align-items:flex-start;gap:30px}.eyebrow{font-size:11px;font-weight:850;letter-spacing:.12em;color:var(--accent);margin:0 0 12px}.intro h1{font-size:clamp(40px,6vw,68px);letter-spacing:-.055em;line-height:1;margin:0}.intro p:not(.eyebrow){max-width:680px;color:var(--muted);font-size:15px;line-height:1.7}.api-status{min-width:210px;border:1px solid var(--line);border-radius:16px;padding:16px;display:grid;grid-template-columns:11px 1fr;gap:3px 10px;background:var(--soft)}.api-status span{width:10px;height:10px;border-radius:50%;background:#d79b32;margin-top:4px}.api-status strong{font-size:13px}.api-status small{grid-column:2;color:var(--muted);font-size:11px}.api-status[data-state="online"] span{background:#16a46c}.api-status[data-state="error"] span{background:var(--danger)}.security-notice{margin:32px 0 20px;border:1px solid #dfe2ff;background:#f6f7ff;border-radius:16px;padding:18px;display:flex;gap:14px;align-items:flex-start}.notice-icon{width:28px;height:28px;border-radius:9px;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:900}.security-notice strong{font-size:14px}.security-notice p{margin:5px 0 0;color:#5c6173;font-size:12px;line-height:1.6}.key-panel{border:1px solid var(--line);border-radius:18px;padding:20px;margin-bottom:24px}.key-panel>label{display:block;font-size:12px;font-weight:800;margin-bottom:8px}.key-row{display:grid;grid-template-columns:1fr auto;gap:10px}.key-row input{height:44px;border:1px solid var(--line);border-radius:11px;padding:0 12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.key-row input:focus{outline:3px solid rgba(75,92,255,.13);border-color:#9ca5ff}.key-row button,.response-head button{border:1px solid var(--line);border-radius:10px;background:white;padding:0 14px;font-weight:750;cursor:pointer}.key-panel p{margin:9px 0 0;color:var(--muted);font-size:11px}.console-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.operation-card{border:1px solid var(--line);border-radius:20px;padding:22px;background:#fff;box-shadow:0 8px 25px rgba(20,23,31,.04)}.card-head{display:flex;gap:13px;align-items:flex-start;margin-bottom:20px}.card-head>span{width:32px;height:32px;border-radius:10px;background:#eef0ff;color:#3040d8;display:grid;place-items:center;font-size:11px;font-weight:900}.card-head h2{margin:0;font-size:20px;letter-spacing:-.03em}.card-head p{margin:5px 0 0;color:var(--muted);font-size:12px}.operation-card form{display:grid;grid-template-columns:1fr 1fr;gap:13px}.operation-card label{display:grid;gap:6px;font-size:11px;font-weight:800;color:#4a4d56}.operation-card label.wide,.operation-card form>button{grid-column:1/-1}.operation-card input,.operation-card textarea{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 11px;background:#fff;color:var(--ink);font-size:13px}.operation-card textarea{resize:vertical;line-height:1.55}.operation-card input:focus,.operation-card textarea:focus{outline:3px solid rgba(75,92,255,.12);border-color:#9ca5ff}.operation-card form>button{height:43px;border:0;border-radius:11px;background:var(--ink);color:#fff;font-size:12px;font-weight:850;cursor:pointer}.operation-card form>button:hover{background:#30323a}.operation-card form>button:disabled{opacity:.5;cursor:wait}.publish-card form{align-content:start}.response-panel{margin-top:24px;border:1px solid var(--line);border-radius:20px;overflow:hidden}.response-head{padding:18px 20px;display:flex;justify-content:space-between;gap:20px;align-items:center}.response-head h2{margin:0;font-size:18px}.response-head p{margin:4px 0 0;color:var(--muted);font-size:11px}.response-head button{height:36px}.response-panel pre{margin:0;background:#17181c;color:#e9eaf0;padding:22px;min-height:220px;max-height:480px;overflow:auto;font:12px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;word-break:break-word}.response-panel pre[data-state="error"]{color:#ffb7b7}.response-panel pre[data-state="success"]{color:#c3f4db}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}@media(max-width:760px){.console-header{padding:0 16px}.console-header nav a:first-child{display:none}main{padding:34px 16px 70px}.intro{display:block}.api-status{margin-top:20px}.console-grid{grid-template-columns:1fr}.operation-card form{grid-template-columns:1fr}.operation-card label,.operation-card label.wide,.operation-card form>button{grid-column:1}.key-row{grid-template-columns:1fr}.key-row button{height:40px}.response-head{align-items:flex-start;flex-direction:column}.response-head button{width:100%}}
.account-card,.keys-card{border:1px solid var(--line);border-radius:20px;padding:22px;margin:24px 0;background:#fff;box-shadow:0 8px 25px rgba(20,23,31,.035)}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.section-heading h2{margin:0;font-size:22px;letter-spacing:-.03em}.section-number{margin:0 0 5px;color:var(--accent);font-size:10px;font-weight:900;letter-spacing:.12em}.section-heading>button,.identity-row>button,.keys-card button,.account-card button{border:1px solid var(--line);border-radius:10px;background:#fff;min-height:38px;padding:0 13px;font-weight:800;font-size:12px;cursor:pointer}.account-state>p,.microcopy{color:var(--muted);font-size:12px;line-height:1.65}.microcopy a{color:var(--accent);font-weight:800}.inline-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end}.inline-form label,.registration-form label{display:grid;gap:6px;font-size:11px;font-weight:800;color:#4a4d56}.inline-form input,.registration-form input,.registration-form textarea,.registration-form select{width:100%;border:1px solid var(--line);border-radius:10px;padding:10px 11px;background:#fff;color:var(--ink);font-size:13px}.inline-form button,.registration-form>button{height:42px;border:0!important;background:var(--ink)!important;color:#fff}.identity-row{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding-bottom:16px}.identity-row div{display:grid;gap:4px}.identity-row span{font-size:11px;color:#16825b}.status-box{margin:16px 0;padding:15px;border-radius:13px;background:var(--soft);display:grid;gap:5px}.status-box strong{font-size:14px}.status-box span,.status-box small{font-size:11px;color:var(--muted)}.status-box em{display:inline-block;margin-left:6px;color:#a35f00;font-style:normal;font-weight:800}.account-card details{border-top:1px solid var(--line);padding-top:14px}.account-card summary{cursor:pointer;font-weight:850;font-size:13px}.registration-form{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:17px}.registration-form .wide,.registration-form>button{grid-column:1/-1}.registration-form .check{display:flex;grid-template-columns:auto 1fr;align-items:center}.registration-form .check input{width:18px;height:18px}.keys-list{display:grid;gap:12px;margin-top:16px}.key-item{border:1px solid var(--line);border-radius:14px;padding:15px;display:grid;grid-template-columns:minmax(180px,1fr) minmax(300px,2fr) auto;gap:16px;align-items:center}.key-item>div:first-child{display:grid;gap:5px}.key-item>div:first-child span{font:11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted)}.key-item dl{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0}.key-item dl div{display:grid;gap:2px}.key-item dt{font-size:9px;text-transform:uppercase;color:var(--muted);font-weight:850}.key-item dd{margin:0;font-size:11px}.key-item dd[data-state="active"]{color:#16825b;font-weight:850}.key-item dd[data-state="revoked"],.key-item dd[data-state="expired"]{color:var(--danger);font-weight:850}.key-actions{display:flex;gap:7px}.key-actions button:disabled{opacity:.35;cursor:not-allowed}.empty{padding:20px;border:1px dashed var(--line);border-radius:13px;text-align:center;color:var(--muted);font-size:12px}.one-time-key{border:1px solid #ccd2ff;background:#f5f6ff;border-radius:15px;padding:17px;margin:15px 0}.one-time-key>strong{display:block;margin-bottom:10px;font-size:13px}.one-time-key .key-row{grid-template-columns:1fr auto auto auto}.one-time-key p{font-size:11px;color:#555b74}.text-button{border:0!important;background:transparent!important;color:var(--accent);padding:0!important;min-height:auto!important}.section-heading button:disabled{opacity:.45;cursor:not-allowed}@media(max-width:900px){.key-item{grid-template-columns:1fr}.key-item dl{grid-template-columns:1fr 1fr}.key-actions button{flex:1}.one-time-key .key-row{grid-template-columns:1fr 1fr 1fr}.one-time-key .key-row input{grid-column:1/-1}}@media(max-width:760px){.inline-form,.registration-form{grid-template-columns:1fr}.registration-form .wide,.registration-form>button{grid-column:1}.section-heading{align-items:flex-start}.key-item dl{grid-template-columns:1fr 1fr}.one-time-key .key-row{grid-template-columns:1fr 1fr}.one-time-key .key-row input,.one-time-key #useKey{grid-column:1/-1}.account-card,.keys-card{padding:17px}.identity-row{align-items:flex-start;flex-direction:column}.identity-row button{width:100%}}
